Перейти к содержимому

Дизайн мобильного онбординга в Figma: туториал | Auto Layout, сетки и прототипирование

riamu design

0:00 / 0:00

Дизайн мобильного онбординга в Figma: туториал | Auto Layout, сетки и прототипирование

69 просмотров · 8 дн. назад
riamu design
7 подписчиков
69 просмотров · 8 дн. назад
Узнайте, как шаг за шагом разработать симпатичный и лаконичный интерфейс для мобильной версии приложения в Figma, используя 4-колоночную сетку макета, Auto Layout и прототипирование. Мы также добавим очаровательные облака в акварельном стиле и интерактивные кнопки, чтобы оживить наш дизайн! 🌿☁️💜 📂 РЕСУРСЫ И ССЫЛКИ: 🎬 Предыдущий урок    • how to create a Watercolor Halloween Pumpk...      • How to Create an Interactive FAQ Accordion...      • Creating a Responsive Product Card in Figm...      • How to create a responsive header in figma...      • Figma Instance Swap & Boolean Properties i...      • How to Create a Checkbox in Figma-Step by ...      • How to Create a Button Component in Figma–...      • Hug vs Fill vs Fixed in Figma's Auto Layout      • How to Create a Cute Toggle Switch in Figm...   ⏱️ ВРЕМЕННЫЕ МЕТКИ: 00:00 – Вступление 00:20 – Создание сетки макета из 4 колонок 01:30 – Настройка автоматической компоновки и интервалов 04:00 – Добавление акварельных облаков 04:29 – Добавление нового экрана 05:56 – Соединение экранов с Прототипирование 06:14 – Предварительный просмотр финального процесса адаптации 💡 ЧТО ВЫ УЗНАЕТЕ: ✅ Как создать 4-колоночную сетку макета для мобильного дизайна ✅ Как организовать контент с помощью Auto Layout ✅ Как настроить интервалы, отступы и радиус скругления углов ✅ Как добавить облака в стиле акварели в ваш дизайн ✅ Как создать интерактивные элементы для кнопок «Далее», «Пропустить» и «Начать» 🌷 ДАВАЙТЕ ОБЩАТЬСЯ! 🔔 Подпишитесь, чтобы получать больше милых и простых в освоении уроков по Figma и UI-дизайну!    / @riamudesign   Dribbble: https://dribbble.com/zahraabbaszade LinkedIn:   / zahra-abbaszade-uidesigner   💬 Есть вопросы или идеи для следующего урока? Напишите в комментариях! #Figma #FigmaTutorial #OnboardingDesign #FigmaPrototyping #AutoLayout #UIDesign #MobileAppDesign #FigmaForBeginner #MobileUIDesign