Figma Pro

Програма курсу

Основи роботи у Figma

На цьому курсі починають з основ. Спочатку розглядають інтерфейс Figma - як завантажити та встановити програму, орієнтуватися в інструментах. Потім вчать працювати зі сторінками, використовувати емодзі для позначень. Також пояснюють, як користуватися Figma Community, коментувати макети та організовувати спільну роботу.

Робота з об'єктами та векторами

Далі переходять до створення та редагування об'єктів. Учні вчаться групувати елементи, об'єднувати фігури, створювати лінії та використовувати маски. Окремо розглядають векторні інструменти - Pen та Pencil, навчаються створювати та редагувати векторні об'єкти.

Фрейми та Auto Layout

Тут пояснюють роботу з фреймами - як вибирати тип, налаштовувати сам фрейм та об'єкти всередині нього. Розглядають constraints та скейлінг. Потім переходять до Auto Layout - від базових налаштувань до створення кнопок і карток. Окремо вивчають оновлення Auto Layout 2023 року.

Дизайн системи та компоненти

Цей блок присвячений створенню дизайн систем. Починають з кольорів - робота з суцільною заливкою та градієнтами, створення кольорових стилів. Потім переходять до тексту - вибір шрифтів, налаштування інтервалів, висоти та ширини. Далі вивчають компоненти - материнські та дочірні, варіативність, створення сетів кнопок та інпутів.

Ефекти, сітки та плагіни

У цій частині курсу розглядають створення та налаштування ефектів, включаючи стилі ефектів. Потім переходять до сіток - створення 12-колоночної сітки, налаштування для різних пристроїв, робота з направляючими. Окремо вивчають плагіни - для роботи з кольором, текстом, зображеннями та іконками.

Складні елементи інтерфейсу

Тут учні вчаться створювати різні елементи інтерфейсу. Починають з кнопок різних станів, інпутів, чекбоксів та радіокнопок. Потім переходять до складніших елементів - чипсів, модальних вікон, сповіщень, тоглів, випадаючих списків, вкладок, підказок та таблиць.

Змінні та прототипування

Цей модуль присвячений Local Variables. Спочатку розглядають основні типи - кольорові, числові, текстові та булеві змінні. Потім переходять до практичного застосування Boolean у макетах. Далі вивчають просунуте прототипування з використанням змінних, включаючи автоматичне підрахування сум у корзині.

Робота з графікою та макетами

Тут учні вчаться працювати з графікою - вставляти та редагувати зображення, обрізати їх, оптимізувати. Потім переходять до об'єднання елементів - створення навігації, меню, карток. Розглядають прототипування взаємодій між елементами.

Підготовка та наповнення макетів

Перед створенням макетів учні вивчають особливості UI-Kit та основи роботи у FigJam. Потім переходять до безпосереднього наповнення макетів - створення сторінок та додавання елементів інтерфейсу.

Анімація та прев'ю

У цьому блоці розглядають роботу з прев'ю. Учні вчаться збирати блоки в лендінг, використовувати Smart Animate для створення анімаційних переходів. Також вивчають фіксацію елементів при скролі, підбір мокапів та плагіни для перегляду макетів.

Завершення роботи

На завершення курсу розглядають передачу макетів у розробку - експорт елементів у різних форматах, збереження у PDF, особливості комунікації з розробниками. Після цього учні виконують дипломний проект, де застосовують усі отримані навички.

Додаткові можливості

Курс включає перевірку домашніх завдань викладачем, що допомагає краще засвоїти матеріал та отримати зворотний зв'язок.