Спасибо большое за Ваш труд! Вы очень структурировано, логично и понятно подаёте информацию! А это редкость среди людей занимающихся аналогичной деятельностью.
Валерия, очень крутой контент. Вы показываете систему и как с ней работать. Ваш канал - не просто про то, как сделать визуально кнопку, но и как эта кнопка работает в системе и по каким правилам. Нашла вас по этому видео и сразу подписалась)
Доброго времени суток. Огромное спасибо за это видео. Первое внятное объяснение по сеткам и стайл гайду, которое мне попалось. Я новичёк в вебе (только учусь), скажите, в каких случаях для десктопа применяется сетка стрейч, и применяется ли вообще. И обязательно ли ширина контейнера должна быть 1200px?
Можно ли текст разместить в узких колонках, как в газете? Чтобы при заполнении высоты последующий текст (или другое содержимое) автоматически располагался в следующей колонке?
На самом деле все зависит от проекта, в некоторых случаях контент у десктопа адаптируется под экран и может растягиваться. Но чаше всего контентная область 1200-1170. И на разных экранах контент будет выглядеть одинаково корректно.
А можно объяснить для тех кто в танке - зачем нужна клеточная сетка для смартфонов? И в каких случаях она вообще нужна? Я например пользуюсь только колонками
Необходимо ли учитывать заданное межстрочные расстояния в тексте при вставке фигуры для отступов? Например кегель подзаголовок 24, кегель параграфа 15 межстрочное расстояние параграфа 24, необходим отступ от подзаголовка до параграфа 40 пик. Вопрос - фигура должна быть по высоте 40 или на порядок меньше с учетом межстрочного расстояния в параграфе 24 пик?
привет, от себя добавлю ещё такой момент... правильнее будет писать разрешения не 320-640, 640-1280 и т.д., а 320-639, 640-1279 и т.д. либо, скорее так 320-640, 641-1280 и т.д. (в зависимости от того, какие именно брейкпоинты подразумеваются) иначе, если взять, к примеру, экран в 640px, то какой из макетов использовать, если и первый и второй соответствует критерию ширины в 640?
Заголовки бывают разного уровня и разного размера, а так же у них может быть разная высота строки. И еще от шрифта зависит. Я когда только начинала, смотрела отступы на других сайтах сравнивала.
Валерия, спасибо за видео. Объясните, пожалуйста, почему в десктопной версии мы ставим значение center, а в планшете и мобильной версии - stretch? Всегда использовала stretch, мне казалось это очень удобно. Столько видео пересмотрела на эту тему, и все равно не понимаю...))
В мобилке и планшете контентная область может растягиваться, а в десктопе нет. К примеру мы берём фрейм 1920 и делаем сетку с контентной областью 1200, если мы изменим ширину фрейма в большую или меньшую сторону наша сетка должна остаться с контентной областью 1200, чтобы наш контент оставался точно в этих границах. В мобилках же наоборот контент может растягиваться от размера 320 до 578 например. В десктопе бывают исключения, если мы делаем сайт на всю ширину фрейма не задавая сетку, но это бывает очень редко.
Добрый вечер!) А подскажите, пожалуйста, в реальном макете вы делаете отступы за счёт auto layout? Или просто смотрите через alt какое расстояние между объектами?
В реальном макете у меня было только один раз и то проект был на поддержке и там было уже так заведено, но я скажу, что это не всегда удобно. Вообще когда я разрабатываю, придерживаюсь правил отступов и они всегда у меня в голове, отступы автолейаутами для всего макета я не делаю. Надеюсь ответила на вопрос)
Бралась за работы, в которых более менее была уверена в своих силах, просила заказчика дать обратную связь по работе и вносила правки. Очень ответственно относилась к работе. Обычно, когда работа конкурсная и бесплатная, к ней относятся не очень серьезно и это очень большая ошибка.
16:20 Отступ 16 px от H1 до базового текста в реальных величинах больше, чем от базового текста до кнопки (24px). Можете взять rectangl и померять. Посмотрите как работают фреймы. Текст должен ровняться относительно x-height, а не от фрейма. Да ужж)
Напишите, чтобы хотели узнать про дизайн не связанное с фигмой и гайдом? Хочу снять говорящую голову))))
Расскажите пожалуйста про тренды)
Спасибо большое за Ваш труд! Вы очень структурировано, логично и понятно подаёте информацию! А это редкость среди людей занимающихся аналогичной деятельностью.
Спасибо, очень рада, что вам все понятно! Успехов в обучении 🍀
@@ValeriyaDesire Благодарю 😌
Почему я раньше не видела ваше видео, это шедевр! Спасибо❤
Супер! Отличная проработка деталей. Очень понравилась идея с визуальным оформлением отступов👍
Валерия, очень крутой контент. Вы показываете систему и как с ней работать. Ваш канал - не просто про то, как сделать визуально кнопку, но и как эта кнопка работает в системе и по каким правилам. Нашла вас по этому видео и сразу подписалась)
Огромное спасибо. Посмотрела, сохранила как шпаргалку. Супер понятным языком и для визуалов 😊
Доброго времени суток. Огромное спасибо за это видео. Первое внятное объяснение по сеткам и стайл гайду, которое мне попалось. Я новичёк в вебе (только учусь), скажите, в каких случаях для десктопа применяется сетка стрейч, и применяется ли вообще. И обязательно ли ширина контейнера должна быть 1200px?
У вас такой приятный и успокаивающий голос 🫂
Я так часто это слышу. Спасибо ☺️
То что я искал. Спасибо)
Валерия ооочень круто, и для меня сейчас очень в тему)) Благодарю
Здравствуйте, интересно было бы узнать какую дают работу новичкам в студии? Как организована работа ? Есть ли ментор ?
Спасибо Валерия!
Валерия, спасибо огромное!
Офигенский контент! Спасибо огромное!!!
очень полезный ролик, спасибо!
В целом интересен ваш опыт и к чему стремитесь в продуктовом дизайне. Интересно узнать на чем больше фокусируетесь на веб или апликейшн?
Поправочка - значения не в пикселях измеряется, а в поинтах (1 поинт может скейлится в 2,4,8 раз) из-за высокой плотности пискселя
Можно ли текст разместить в узких колонках, как в газете? Чтобы при заполнении высоты последующий текст (или другое содержимое) автоматически располагался в следующей колонке?
Здравствуйте, а как читать гайд в фигме? Ничего не видно при приближении
В данном примере показаны только вертикальные отступы, жаль не показали горизонтальные отступы - как именно лучше показывать в дизайн системе
А почему в десктопе ширина колонки именно 78???
У вас тоже в strech сетке получается не одинаковая ширина колонок?
Добрый день! Все круто. Только не понял почему сетку для Desktop нельзя тоже Stretch сделать?
На самом деле все зависит от проекта, в некоторых случаях контент у десктопа адаптируется под экран и может растягиваться. Но чаше всего контентная область 1200-1170. И на разных экранах контент будет выглядеть одинаково корректно.
А можно объяснить для тех кто в танке - зачем нужна клеточная сетка для смартфонов? И в каких случаях она вообще нужна? Я например пользуюсь только колонками
Необходимо ли учитывать заданное межстрочные расстояния в тексте при вставке фигуры для отступов?
Например кегель подзаголовок 24, кегель параграфа 15 межстрочное расстояние параграфа 24, необходим отступ от подзаголовка до параграфа 40 пик. Вопрос - фигура должна быть по высоте 40 или на порядок меньше с учетом межстрочного расстояния в параграфе 24 пик?
привет, от себя добавлю ещё такой момент... правильнее будет писать разрешения не 320-640, 640-1280 и т.д., а 320-639, 640-1279 и т.д. либо, скорее так 320-640, 641-1280 и т.д. (в зависимости от того, какие именно брейкпоинты подразумеваются) иначе, если взять, к примеру, экран в 640px, то какой из макетов использовать, если и первый и второй соответствует критерию ширины в 640?
Хорошее замечание, надо будет поправить в ui kit 👍 И думаю стартовать можно уже с экрана 360. Давно на 320 ни чего не разрабатывала.
Спасибо, очень полезное видео! Хотела узнать про отступы. Сколько нужно от заголовка до подзаголовка?
Заголовки бывают разного уровня и разного размера, а так же у них может быть разная высота строки. И еще от шрифта зависит. Я когда только начинала, смотрела отступы на других сайтах сравнивала.
Валерия, спасибо за видео. Объясните, пожалуйста, почему в десктопной версии мы ставим значение center, а в планшете и мобильной версии - stretch? Всегда использовала stretch, мне казалось это очень удобно. Столько видео пересмотрела на эту тему, и все равно не понимаю...))
В мобилке и планшете контентная область может растягиваться, а в десктопе нет. К примеру мы берём фрейм 1920 и делаем сетку с контентной областью 1200, если мы изменим ширину фрейма в большую или меньшую сторону наша сетка должна остаться с контентной областью 1200, чтобы наш контент оставался точно в этих границах. В мобилках же наоборот контент может растягиваться от размера 320 до 578 например.
В десктопе бывают исключения, если мы делаем сайт на всю ширину фрейма не задавая сетку, но это бывает очень редко.
@@ValeriyaDesire Благодарю в очередной раз! 🌸
Добрый вечер!)
А подскажите, пожалуйста, в реальном макете вы делаете отступы за счёт auto layout? Или просто смотрите через alt какое расстояние между объектами?
В реальном макете у меня было только один раз и то проект был на поддержке и там было уже так заведено, но я скажу, что это не всегда удобно. Вообще когда я разрабатываю, придерживаюсь правил отступов и они всегда у меня в голове, отступы автолейаутами для всего макета я не делаю. Надеюсь ответила на вопрос)
Спасибо за полезный контент!) Подскажите, набор иконок в вашем файле можно бесплатно и со спокойной душой использовать в своих проектах?)
Пожалуйста, да иконки можно использовать.
Добрый день, скажите, пожалуйста, в реальном макете вы тоже измеряете и задаёте отступы "прямоугольниками"? Или как это происходит?
Это просто правила отступов в дизайн системе. В реальном макете я не использую прямоугольники для отступов. Я просто использую эти правила.
ваяяяя шик
Вы упоминали, что выигрывали в конкурсах на бирже фриланса, вы можете выделить основные критерии , которые позволят приблизиться к победе ?)
Бралась за работы, в которых более менее была уверена в своих силах, просила заказчика дать обратную связь по работе и вносила правки. Очень ответственно относилась к работе. Обычно, когда работа конкурсная и бесплатная, к ней относятся не очень серьезно и это очень большая ошибка.
16:20 Отступ 16 px от H1 до базового текста в реальных величинах больше, чем от базового текста до кнопки (24px). Можете взять rectangl и померять. Посмотрите как работают фреймы. Текст должен ровняться относительно x-height, а не от фрейма. Да ужж)
дон готов 🤡
😂. Дизайн
Всё, Дон Прошу, начините наконец учить английский! Это стыд и позор какой-то