Продвинутый урок в Figma от арт-директора. Автолейауты, компоненты и эффект листающихся букв.
Рет қаралды 14,583
Күн бұрын🔥 Бесплатный курс по дизайну с бесплатной обратной связью: t.me/freeeducation_uprockbot
Продвинутый урок в Figma от арт-директора
Евгений Кузьмин (CEO & Art-director студии UPROCK) делится своим опытом, рисует актуальный дизайн, и разбирает главные ошибки в UX/UI.
00:00 Вступление
00:49 Сетка и фон
01:41 Хэдер
03:03 Бэкграунд обложки
03:49 Создание эффекта листающихся букв
06:26 Карточки обложки
08:57 Второй блок
11:57 Карточки для второго блока
16:41 Заключение
🚀 Ждём вас в школе UX/UI дизайна №1 UPROCK: school.uprock.ru/middle
☀️ Написать менеджеру школы: t.me/uprocksale
ПОЛЕЗНОЕ ДЛЯ UX/UI-ДИЗАЙНЕРОВ:
Скачать бесплатно кириллические шрифты: www.fonts.uprock.ru/
Все самые полезные сайты и мокапы для дизайнеров: www.baza.uprock.ru/
Бесплатная онлайн-книга по UX/UI-дизайну: www.uprock.ru/education
Зарубежные статьи по UX: www.uprock.ru/all-articles
Видео-уроки по дизайну: t.me/uprockdesign
НАШИ СОЦ. СЕТИ:
Личный инстаграм Евгения: / zhenya.ninja (запрещен в РФ)
Крутые анимации из наших кейсов: dribbble.com/uprockpro
Лучшие сайты на Behance: www.behance.net/uprockawards
Заказать дизайн сайта или брендинг компании: www.agency.uprock.ru
#вебдизайн #figma #ux #uprock
@UPROCK 11 ай бұрын
🔥 Бесплатный курс по дизайну с бесплатной обратной связью: t.me/freeeducation_uprockbot Материалы к уроку - www.figma.com/file/spO7vC62YKAKtKAlhRWvtV/23.02.28---%D0%9B%D0%B8%D1%81%D1%82%D0%B0%D1%8E%D1%89%D0%B8%D0%B5%D1%81%D1%8F-%D0%B1%D1%83%D0%BA%D0%B2%D1%8B-%D0%BE%D0%B1%D0%BB%D0%BE%D0%B6%D0%BA%D0%B0-(%D0%BF%D1%80%D0%B0%D0%BA%D1%82%D0%B8%D0%BA%D0%B0)?node-id=121%3A168&t=DizA05O6ZPZexGDq-1
@quangtungnguyen3753 Жыл бұрын
Я из Вьетнама. Я не говорю по-русски, но с помощью инструментов перевода ваши уроки потрясающие.
@UPROCK Жыл бұрын
Спасибо большое, я очень рад☺️
@user-rx5il2oo3p Жыл бұрын
Ваши уроки и видео всегда просто вау! Столько вдохновения и мотивации, спасибо за Ваш труд)
@UPROCK Жыл бұрын
Всегда пожалуйста, Анастасия! Спасибо за комментарий)
@mila_web Жыл бұрын
Даешь больше продвинутых уроков с арт-директором! )) Спасибо большое за ваши уроки😘 Это моя самая любимая рубрика )
@UPROCK Жыл бұрын
Класс! Рад, что эти уроки так заходят) Всегда пожалуйста☺️
@tati_zhabskaia Жыл бұрын
Женя спасибо за продвинутые уроки,отлично прокачивает навыки!
@UPROCK Жыл бұрын
Всегда пожалуйста👍
@mishin.m.m Жыл бұрын
Балдёёёж! Такие идеи крутые подкидываете! Огромное спасибо за труд! Повторяю все уроки по фигме, еще не один не пропустил. Лекции по типографике и нестандартным сеткам тоже обязательно посмотрю по мере свободного времени)
@UPROCK Жыл бұрын
Супер! Для этого и делаю такие уроки) Спасибо👍
@UPROCK Жыл бұрын
Материалы к уроку - clck.ru/34AqBG
@user-fh1yd7sh5l 7 ай бұрын
Боже, я в восторге! Впервые попала на твой канал, хотела просто посмотреть что-нибудь полезное за завтраком. Не все термины и действия были понятны, не сразу поняла, зачем тебе 3 монтажные области, а потом каааак поняла! Я никогда не видела настолько качественных работ, когда все так структурировано. Мой внутренний перфекционист в экстазе. Захотелось больше узнать о тебе, твоей школе и посмотреть больше твоих уроков. Теперь я знаю, к чему буду стремиться. Спасибо огромное!
@UPROCK 7 ай бұрын
Салют, Александра! Спасибо большое тебе за такой позитивный и подробный комментарий👍 Очень рад, что видео понравилось, и тому, что заинтересовала моя школа) Чувствуй себя как дома, с удовольствием отвечу на любые вопросы!
@natalienataniel3688 Жыл бұрын
Спасибо за шикарный урок!!!
@UPROCK Жыл бұрын
Всегда пожалуйста☺️
@miroff_art Жыл бұрын
Спасибо огромное, очень полезное видео👍
@UPROCK Жыл бұрын
Всегда пожалуйста☺️
@user-qu3fv4tv8r 2 ай бұрын
большое спасибо за видео!
@UPROCK 2 ай бұрын
Всегда пожалуйста, Хелен👍
@user-io5.56 Жыл бұрын
Жень, ты - ОООЧЕнь сильный мотиватор! :) Пошёл делать коммерческий проект.
@UPROCK Жыл бұрын
Спасибо, Александр🙏Очень рад, успехов с проектом)
@Prima_filiip_ Жыл бұрын
Спасибо! 🏵
@UPROCK Жыл бұрын
Пожалуйста👍
@Sukhart Жыл бұрын
наконец-то!
@UPROCK Жыл бұрын
Григорий, рад что угодил)
@user-ou6sc3vl4h Жыл бұрын
крутий туторіал)
@UPROCK Жыл бұрын
Дякую, Андрій🙏
@alex_pivko Жыл бұрын
Здравствуйте Спасибо за качественный ролик, сейчас по очереди буду вопросы задавать: 1. Почему отступ лого от верхней границы 25? Обычно же на четные числа делают , почему не 24 ?
@UPROCK Жыл бұрын
Привет, можно делать любые числа, разницы никакой. Я предпочитаю кратные 5 и 10, чтобы легче считать.
@ed_tomeyan 8 ай бұрын
Спасибо за видео! Почему высота фрейма принимается 1080, если на fullHD мониторе высота окна в браузере меньше из-за шапки браузера, адресной строки и т.д.? Т.е. пользователь с вероятностью почти 100% не увидит полностью первый блок сайта.
@UPROCK 8 ай бұрын
Салют! Так как браузеры у всех разные и точно расчитать невозможно - обложка будет адаптивной и при любых условиях заполнять 100% имеющейся высоты
@leominor4296 Жыл бұрын
Здравствуйте, подскажите пожалуйста, почему после применения маски, в буквах появляются куски фона? Причем, с "целыми" буквами, вроде Е и G таких проблем нет. Не понимаю, что не так
@UPROCK Жыл бұрын
Салют! Если я правильно понял Вас, отверстия в "закрытых" буквах могут теряться на стадии перевода в вектор, и их необходимо добавлять вручную перед применением маски
@alex_pivko Жыл бұрын
А вопросов то и нет других, все понятно Единственное , просто интересно почему решили между блоками брать 6рх? Как то тесновато не кажется ?
@UPROCK Жыл бұрын
Может быть и так. В любом случае, Вы попрактиковались и немного набили руку) А в своих макетах сможете сделать так, как посчитаете нужным
@SSStellanity Жыл бұрын
Если бы можно было поставить 300 лайков, я бы поставила! ❤
@UPROCK Жыл бұрын
Привет! Ну на канале 343 видео, это не то, чтобы совсем невозможно.. Это шутка😉 Но мне очень ценно такое высокое мнение и положительный отзыв, спасибо☺️
@iliyassha3427 Жыл бұрын
спасиб Мач Лав сорокалетнему Дяде 🌶
@UPROCK Жыл бұрын
Пожалуйста, молодёжь😉
@---mz6mb Жыл бұрын
Подскажите, пожалуйста, почему стрелка "вправо" не меняется на стрелку "влево", если всё сделала также: создала стрелку, сделала компонентом, вставила в варианты с другими иконками, написала Тип у одной стрелки вправо, у другой влево. Потом копирую с Alt одну из стрелок, пробую поменять ее тип и ничего не происходит. Переделала с нуля уже несколько раз. ничего не меняется, градус поворота остаётся как был.
@---mz6mb Жыл бұрын
Получилось сейчас, когда я в миллионный раз попробовала сделать по-другому. Ту же стрелку я вытащила из вариантов, СДЕЛАЛА ЕЕ ВЕКТОРОМ, потом всё повторила и она начала крутиться! На 2 день переборов только нашла решение.. Может кому-то поможет)
@UPROCK Жыл бұрын
Привет! Странно, во время отрисовки такой проблемы не было( В любом случае, спасибо большое что написали и респект, что нашли решение👍
@user-ez6oo7xt4e 8 ай бұрын
Здравствуйте, подскажите пожалуйста, я делаю все остальные буквы как первую и получается полная фигня)) я правильно понимаю,найстройки такие же точно как и для первой буквы?
@UPROCK 8 ай бұрын
Салют! Да, настройки можно использовать такие же, кроме угла наклона букв, их копий и теней - в них, собственно, и будет вариативность
@korolynasizar1643 11 ай бұрын
можно спросить, а вы буквы заново сделали или как они у вас появились?
@UPROCK 11 ай бұрын
Салют! Да, конечно) В видео есть этот момент, пишем все буквы по-отдельности и производим с каждой те же действия, что и с первой
@alexeyilin1 Жыл бұрын
Здравствуйте, можете подсказать как переименовать букву? Я делаю дубликат Mask group но как в этой группе изменить букву на другую я не понимаю( Или их мы пишем с нуля? И применяем все действия как с буквой G?
@UPROCK Жыл бұрын
Салют, Алексей! Да, делаем с нуля, как с первой буквой) К сожалению, изменять внешний вид букв текстового слоя невозможно, поэтому мы переводим их в вектор. В этот момент, соответственно, буква перестаёт быть текстом и становится векторным изображением
@alexeyilin1 Жыл бұрын
@@UPROCK Спасибо!
@user-kl4ze3yc1y 6 күн бұрын
👍
@UPROCK 5 күн бұрын
🙏
SMOL Italian
Рет қаралды 44 МЛН