Делаем отзывчивый дизайн сайта в Figma (бесплатный мастер-класс по веб-дизайну)
HTML-код
- Опубликовано: 2 авг 2020
- Хочешь больше полезностей о дизайне?
Вступай в чат Гильдии дизайнеров: ttttt.me/designers_guild
Подписывайся на мой инстаграм: / yan.ageenko
Читай мою книгу: www.litres.ru/yan-ageenko/kak...
Приходи ко мне на курсы: yan.ageenko.pro/school.html?ut...
Урок для тех, кто начинает с полного нуля и не владеет графическими редакторами: • Бесплатный мастер-клас...
Мастер-класс по адаптивному дизайну: • Делаем адаптивный диза...
После окончания заметил небольшой косячок. Чтобы иконки при изменении размера оставались вертикально на одном уровне с заголовком, заголовку нужно задать Left Center, и также вставить его в отдельный фрейм со Scale по обеим осям
Спасибо, вот и у меня с заголовком не очень, а так получился отзывчивый.)
Вот теперь, чудесно вышло)))
Спасибо
Спасибо огромное! Узнала то, что не объясняли на других видео-уроках. Наконец-то поняла для чего эта привязка нужна. Всё доступно и понятно и с примерами, а не на словах "ну вот сделайте такую привязку, потому что надо". Спасибо)
Спасибо тебе за урок и ютубу за х1.75 скорость )
а я смотрела на 1,25. мне так тоже понравилось!
я х2 тоже норм
очень полезно, спасибо! как раз пытаюсь усвоить responsive design, теперь все запомнилось!
Спасибо, отличный урок! Красивый макет получился)
благодарю )
Спасибо огромное за урок, очень важно и понятно!
Спасибо большое! Всё кратко и понятно
Спасибо огромное за очень полезный урок!
Спасибо вам за классное видео,вы лучший!!
ты внатуре дизайнер дизайнеров! Спасибо
Отличный урок.Спасибо.
Спасибо! Все классно!!!
Просто класс!
Спасибо ❤️🔥
Офигенный урок!!! Только блоки немного съезжают почти всегда, нужно контроллить
Спасибо большоею
Спасибо за прекрасный урок! У меня не получилось только создать вокруг гибкого фрэйма фиксированную рамку (условно 10 пикселей с каждой стороны, залитые тянущейся картинкой). Во фрейме стоит auto layout (чтобы размер фрэйма был по высоте текста). У него нельзя задать contstraints top & bottom, поэтому нижний элемент рамки к нему не вяжется.
Здравствуйте, как скруглить только один угол квадрата?😅
P.s.: разобрался
Спасибо, вот только появился вопрос))
При каких обстоятельствах нужно делать привязки в макете ? Ибо тут главный экран занял почти час, а если весь макет ... 😨
Может проще делать адаптив?
Все зависит от конкретного случая :)
Спасибо большое за урок.
А скажите, пожалуйста, Вы иконки сами делаете или берете откуда-то? А то у меня пока с ними проблемка)
Можно использовать готовые, можно нарисовать самостоятельно, тут урок: ruclips.net/video/UoBjTrNs6DQ/видео.html
@@YanAgeenko А где можна брать готовые, не подскажете?
Спасибо за отличный урок! Подскажите, пожалуйста, как вставить символ копирайта..
Можно просто скопировать с любого сайта и вставить: ©
Спасибо за МК! У меня такой вопрос: autolayout не выравнивается по левому краю как заголовок при масштабировании, хотя сделала все как в видео, единственный момент, когда выбирала "слева и по центру" у меня выходит не left и center, а hug contents, может дело в этом?
Да, скорее всего именно в этом
@@YanAgeenko а как тогда это исправить?
Подскажите пожалуйста, почему при выделении нижнего текста, не активно поле Constrains? И как выделить прямоугольник, чтобы скруглить один угол?
constraints могут быть неактивны, если элемент находится вне фрейма. Чтобы скруглить один из углов, нужно нажать на кнопку с четырьмя уголками справа от поля с радиусом углов и ввести в появившихся полях нужные значения, или при наведении на нужный угол зажать alt
@@YanAgeenko Благодарю !
Привет Ян. Подскажите пожалуйста, почему когда я уменьшаю фрейм, то заголовок куда-то съедает и пропадает и закрывает дискриптор. В чем проблема. Помогите пожалуйста решить. Я буду очень благодарен
скорее всего, constraints неправильно заданы. привязка заголовка должна быть top left в этом примере
спасибо; а кто-нибудь знает, как скелить шрифт? то есть чтобы при уменьшении фрэйма, кегль тоже уменьшался
В фигме к сожалению нет такого функционала пока что
Подскажите, пожалуйста, как вставить символ в текст для отзывчивого дизайна
О каком символе речь?
@@YanAgeenko Символ копирайта.
Подскажите а для вордпресса можно в фигме дизайны делать? (я новичок)
Можно
@@YanAgeenko Спасибо, у вас есть какие-то гайды по этой теме?
все получилось. кроме одного. я взяла круг и на него поместила букву. сделала subtract selection и при движении frame у меня масштабируется круг и буква меняет свое положение. как её зафиксировать?
ответь, пожалуйста))) очень поможете
ничего не понял :) Напиши мне в телеграм yanageenko - там разберемся
Чем вы обоснуете применение сетки не кратной числу "2" ? Не ужели удобно масштабировать?
Не понял, о чем речь, т к в данном примере сетка кратна двум
@@YanAgeenko 50px умножьте на 1.5 и вы получите объект в 75 px, который не будет кратным 2-ки, 8px cетка такой проблемы не даст. Масштабирование на 150% (1.5) сломает объекты в сетке.
@@YanAgeenko тоже хотелось бы узнать. как известно восьмипиксельная сета используется для того, чтобы пиксели не двоились при масштабировании
Здраствуйте, а куда надо заходить чтоб ставить символ для цитаты?
можно просто в гугле найти и скопировать
@@YanAgeenko Хорошо,большое спасибо
А где урок , где создаются другие страницы для этого сайта? и перекликиываются
Пока нету, может быть как-нибудь сделаю
ничего не получилось зафиксировать,все путешествует по макету.Логотип уезжает куда то.
значит что-то делаете не так. Рекомендую начать сначала и делать пошагово, как в уроке
Сколько вы зарабатываете на веб дизайне?
Достаточно :)
в CSS:
width: 10%;
height: 10vh;
/* цифры заменить на необходимые вам */
Урок окончен)
В css еще как минимум свойства position, top/left/bottom/right. Но это в любом случае урок о дизайне, а не о верстке.