Figma для веб дизайнера – видеокурс

Язык преподавания в курсе – русский. Вскоре будет доступна украинская версия этого курса.

Видеозаписи лекций без обратной связи и участия преподавателя. Вы получите доступ к материалам сразу после оплаты.

Чему вы научитесь
Внутренний и внешний интерфейс программы
Инструменты Figma
Frame – очень важная часть. Фрейм – это основа программы.
Компоненты
Contsraints (Ограничения/привязки)
Система сеток и направляющих в Figma
Плагины
Прототипирование
Стили
Ты заложишь основу своей библиотеки компонентов
Практическая работа по созданию мобильного приложения с применением полученных знаний и своей библиотеки компонентов
Изучение основ атомарного дизайна

Требования
Компьютер и интернет

Описание
Привет, мой друг.
Если ты интересуешься веб дизайном, то ты наверняка слышал о таком инструменте, как Figma.
Figma – это самая перспективная программа для веб дизайна в наше время. Она объединила в себе самые передовые инструменты разработки дизайна сайтов и уже на голову опережает конкурентов.
Одним из наиболее важных плюсов фигмы является простота использования и легкость в освоении. Так же не стоит забывать, что за такими продвинутым инструментом будущее. Все больше дизайнеров и компаний по всему миру переходят на Figma. Например, команды дизайнеров Twitter и Uber полностью работают в Figma. Она не требует места на твоем жестком диске, так как работает в облаке и мгновенно сохраняет все изменения в макете. В Фигма есть контроль версий и ты всегда можешь откатиться до нужного момента.
Фигма не требует никакой инсталляции, ты можешь ее открыть просто в браузере и работать. Это означает, что ее можно использовать на любой платформе (Windows, Mac, Linux). Для первых двух, есть десктопная версия.

Максимальным плюсом Figma является то, что она использует самые передовые инструменты для работы веб-дизайнера:
– Компоненты
– Ограничения
– Стили
– Систему сеток
– Прототипирование
Обо всех этих инструментах максимально подробно говорится в этом курсе. Но мало просто изучить инструменты, нужно научиться использовать их в комплексе друг с другом и ускорять рабочий процесс в разы.
Во время курса на практике мы на практике будем использовать все инструменты программы и создадим твою собственную библиотеку компонентов и макет мобильного приложения. Так же мы сделаем кликабельный прототип этого приложения.
Для кого этот курс:
Начинающие веб дизайнеры
Веб дизайнеры, которые хотят перейти работать с фотошопа на Figma
Продолжительность курса – 07:23:18
–
Введение – 33:32
Скачать Figma и зарегистрироваться в программе – 02:29
В чем главные отличия Figma от других редакторов – 03:33
Структура файлов – 11:25
Обзор интерфейса программы – 04:40
Сохранение и передача файла – 06:58
Файлы Sketch в Figma – 03:27
–
Инструменты Figma – 02:19:14
Горячие клавиши – 01:37
Move tool, Scale tool – 01:50
Выравнивание объектов0 – 4:52
Прямоугольник овал – 12:19
Полигон Звезда – 03:59
Обводка – 03:34
Эффекты – 05:58
Заливка градинет – 09:20
Изображение – 11:44
Маска – 05:20
Перо – 17:42
Инструмент «Текст» – 15:39
Группа – 09:46
Frame – 19:08
Булевые группы – 04:38
Комментарии – 03:19
Эффекты наложения – 04:29
Экспорт – 04:00
–
Профессиональные инструменты Figma – 02:12:14
Плагины – 09:52
Скрытые инструменты Figma – 18:03
Стили – 15:08
Constraints (Ограничения/привязки) Часть 1 – 18:48
Constraints (Ограничения/привязки) Часть 2 – 13:38
Сетки. Часть 1 – 04:12
Сетки. Часть 2 – 13:46
Компоненты – 07:29
Мультикомпоненты – 11:03
Практика создания мультикомпонента – 20:15
–
Создание своей библиотеки компонентов – 21:47
Основа атомарного дизайна – 12:40
Создание основы библиотеки компонентов – 02:22
Что должно быть в твоей библиотеке компонентов – 06:45
–
Практика работы в Figma – 58:45
Практика. Создаем макет мобильного приложения. Часть 1 – 26:45
Практика. Создаем макет мобильного приложения. Часть 2 – 18:25
Практика. Создаем макет мобильного приложения. Часть 3 – 13:35
–
Прототипирование в Figma58:05
Создаем кликабельный прототип мобильного приложения. Часть 1 – 12:17
Создаем кликабельный прототип мобильного приложения. Часть 2 – 04:31
Создаем кликабельный прототип мобильного приложения. Часть 3 – 09:38
Создаем кликабельный прототип мобильного приложения. Часть 4 – 01:29
Создаем кликабельный прототип мобильного приложения. Часть 5 – 15:31
Эффекты взаимодействия в прототипе – 14:01