- Кількість кредитів 2
- Тип Обов'язковий
- Семестр 1
- Рівень вищої освіти Бакалавр
- Підсумковий контроль Залік
⚡Квест: Побудуй системний інтерфейс за законами математики та ШІ!
Думаєш, дизайн — це просто малювати картинки? Ні, це системна інженерія! На курсі ти підкориш Figma, опануєш Атомарний дизайн та передову методологію BEM. Навчишся створювати адаптивні інтерфейси за допомогою Auto Layout та розраховувати когнітивне навантаження на користувача.
🚀Спроєктуй інтерфейс, який ідеально ляже в код!
🛠Стек: Figma, FigJam, Miro, Stark, Relume AI, Notion.
🎒В рюкзак: Професійний Responsive Interface Design Pack: гнучкий UI-кіт та макети під десктоп і мобайл.
⚡Квест: Опануй Figma, підкори Auto Layout та створюй залізобетонну архітектуру інтерфейсів!
🌐Опис місії
Сучасний UI-дизайн — це не про хаотичну творчість, а про строгу компонентну інженерію та математичні закони людського сприйняття. Цей квест навчить тебе мислити як Front-end програміст ще до написання першого рядка коду. Забудь про шаблони «Lorem Ipsum» та нудні макети. Ми розберемося, як візуально пакувати елементи за методологією BEM, створювати адаптивні «гумові» контейнери, управляти дизайн-токенами та проєктувати продукти, доступні для кожного. Стань інженером інтерфейсів, чиї макети розробники забирають у код без жодних питань!
🛠Твій інструментарій
Interface Modeling Platform: Figma (основне хмарне середовище розробки, Variables та сітки).
Conceptualization & Logic: Miro, FigJam, Notion (брифи, беклоги та карти сайтів).
AI-driven Extensions: Relume AI, Wireframe Plugin (генерація каркасів за промптами), ChatGPT (мікрокопірайтинг).
Accessibility Audit: Stark, Axe for Figma (автоматична валідація контрасту за стандартами WCAG).
🚀Що прокачаєш (Суперсили)
Figma Auto Layout Mastery: Навчишся керувати розмірами контейнерів (Fixed, Hug, Fill) — твої макети будуть ідеально адаптуватися під будь-який екран (як на CSS Flexbox).
Atomic Design Logic: Опануєш системний підхід Бреда Фроста — від елементарних майстер-компонентів до масштабних інтерфейсних систем.
Cognitive UX Laws: Навчишся розраховувати інтерфейси за математичними законами Хіка, Фіттса та Міллера для мінімізації ментального навантаження користувачів.
Tokenization & Typography: Налаштуєш трирівневу архітектуру дизайн-токенів для миттєвої зміни стилів та колірних палітр ПЗ.
🎒Що покладеш у рюкзак (Портфоліо)
Результатом першого семестру стане твій особистий Responsive Interface Design Pack у Figma, який містить:
Site Map & Low-Fi Wireframes: Чітка логічна карта продукту та каркаси екранів.
Atomic UI-Kit: Масштабована бібліотека компонентів (кнопки, форми введення, картки) з прописаними варіантами станів.
Cross-Platform Layouts: Фінальні макети для Desktop, Tablet та Web-Mobile, побудовані за 12-колонковою сіткою та перевірені плагіном Stark на стандарт WCAG.
💼Твій майбутній тайтл
Цей семестр закладає базу для швидкого старту на стику дизайну та розробки:
Junior UI/UX Designer / Product Designer.
UI Engineer (інженер інтерфейсів).
