Figma

Интерфейс — Компоненты — UI Kit — 

Интерфейс — Компоненты — UI Kit — 

Интерфейс — Компоненты — UI Kit — 

Интерфейс — Компоненты — UI Kit — 

Интерфейс — Компоненты — UI Kit — 

Интерфейс — Компоненты — UI Kit — 

Онлайн-курс по Figma с углубленным изучением популярного графического редактора. На курсе вы научитесь работать с интерфейсом, узнаете, как удобно организовывать работу в Figma, шаг за шагом освоите сложные компоненты, Auto Layout, Ui Kit и дизайн-токены.

FIGMA START
by Visorit Studio
Смотреть кейсы на сайте
visorit.com

Кому подойдет данный курс

начинающий веб‑дизайнер

С нуля освоишь Figma и научишься использовать программу для проектов любой сложности. Поймешь, как создавать интерактивные прототипы и использовать горячие клавиши для быстрой работы.

практикующий веб‑дизайнер

Систематизируешь и дополнишь навыки по Figma. Разберешься со сложными компонентами, вариантами и Auto Layout и будешь эффективно использовать их в работе над проектами.

дизайнер-фрилансер

Получишь профессиональные навыки для работы в редакторе. От интерфейса Figma до атомарного дизайна. Создашь свой Ui kit, а также изучишь основы работы с дизайн-токенами.

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


(1) Знакомство с Figma
Видеоурок / Тест
  • Установка и обзор интерфейса
  • Базовые настройки программы
  • Как поделиться проектом
  • Комментарии в Figma

(2) Инструменты и горячие клавиши
Видеоурок / Тест
  • Основные инструменты Figma
  • Работа с геометрическими фигурами
  • Горячие клавиши

(3) Заливка, обводка и эффекты
Видеоурок / Тест / Домашнее задание
  • Заливка, градиент и обводка
  • Базовые эффекты в Figma: тени и блюр
  • Изображения и как с ними работать
  • Создание паттерна в Figma

(4) Работа с пером
Видеоурок / Тест
  • Основы работы с пером
  • Особенности применения на практике
  • Создание иконок

(5) Маски и Boolean Groups в Figma
Видеоурок / Тест
  • Как работать с масками в Figma
  • Маски и Boolean Groups 
  • Применение масок в дизайне

(6) Слои, группы, фреймы и настройка сетки
Видеоурок / Тест
  • Работа со слоями и группами
  • Фреймы и настройка модульной сетки
  • Особенности Bootstrap
  • Делаем адаптивный дизайн

(7) Плагины и виджеты
Видеоурок / Тест
  • Как установить и включить плагины в Figma
  • Популярные плагины. Что необходимо для работы

(8) Стили и Компоненты
Видеоурок / Тест / Домашнее задание
  • Создание текстовых и цветовых стилей
  • Как устроены компоненты
  • Создание компонентов и работа с ними
  • Примеры использования в дизайне

(9) Auto Layout. Выравнивание и отступы
Видеоурок / Тест / Домашнее задание
  • Что такое Auto Layout
  • Как настраивать Auto Layout
  • Практическое применение в дизайне

(10) Дополнительные функции
Видеоурок
  • Дополнительные hot keys
  • Поиск и замена элементов
  • Лайфхаки и советы

(11) Атомарный дизайн
Видеоурок / Тест
  • Основы атомарного дизайна
  • Принципы и структура
  • Когда применять атомарный подход к дизайну

(12) UI KIT. Создание дизайн-системы
Видеоурок / Тест
  • Что такое UI kit
  • Задача и функции Ui kit
  • Структура и содержание дизайн-системы
  • Создание Ui kit на практике

(13) Варианты и автоматизация
Видеоурок / Домашнее задание
  • Создание вариантов компонента
  • Свойства вариантов
  • Автоматизация: switcher, checkbox, radiobutton

(14) Основы работы с дизайн-токенами
Видеоурок / Тест
  • Что такое токены дизайн-системы
  • Основные задачи токенов
  • Принципы работы

(15) Карта сайта и Wireframes
Видеоурок / Тест / Домашнее задание
  • С чего начинать дизайн?
  • Структура и блоки веб-сайта
  • Создание карты сайта и Wireframes

(16) Дизайн токены на практике
Видеоурок
  • Темизация. Создание и переключение тем
  • Управление дизайн-токенами

(17) Дизайн сайта на практике
Видеоурок / Домашнее задание
  • Применение полученных знаний на практике
  • Дизайн макетов веб-сайта

(18) Интерактивный прототип в Figma
Видеоурок / Тест
  • Для чего нужен интерактивный прототип?
  • Создание связей и запуск прототипа
  • Панель с анимациями
  • Настройка popup-окон, меню и scroll

(19) Анимация прототипа
Видеоурок / Домашнее задание
  • Анимация ссылок и кнопок
  • Анимация checkbox, input, selectbox
  • Как оживить слайдер

(20) Экспорт файлов и передача верстальщику
Видеоурок / Тест
  • Как экспортировать файлы и что передавать верстальщику
  • Типы доступов к файлу
  • Дубликат файлов. Как защитить макет

(21) Шаблоны и бонусы для ускорения работы
Видеоурок
  • Полезные бонусы от автора курса
  • Конструктор Wireframe
  • Шаблон UI kit

Как проходит
обучение на курсе

смотришь онлайн
видеоуроки

Видеоуроки можно смотреть в любое время. Доступ к урокам будет открываться в личном кабинете в течение 2 месяцев. В каждом занятии есть конспект с материалами, он остается у тебя навсегда.

выполняешь
задания

Для закрепления материала после видеоурока проходишь тест и, если нужно, выполняешь практическое домашнее задание, которое необходимо отправить на проверку куратору.

получаешь фидбэк
от куратора

Куратор дает обратную связь в личном кабинете по каждому домашнему заданию. Это помогает лучше разобраться в материале, исправить ошибки и улучшить свой результат.
Что в результате
обучения на курсе
ты получишь

практические
навыки

Освоишь Figma и научишься создавать интерактивные прототипы будущих веб-сайтов. Разберешься в bootstrap и атомарном дизайне. Поймешь, что такое дизайн-токены и как их применять в работе.

новые кейсы в
портфолио

На выходе у тебя будет уверенный кейс веб-сайта, созданный в рамках данного онлайн-курса, который сможешь использовать в своем портфолио или для устройства на работу.

именной
сертификат

По завершении обучения получишь именной сертификат о прохождении курса, подтверждающий полученные знания и навыки. Сертификат высылается в электронном виде.

Форматы участия

Figma Start
Самостоятельное прохождение онлайн-курса.
Старт в любой момент
  • Обучение в личном кабинете начинается на следующий день после оплаты
  • 21 видеоурок с доступом на время обучения плюс один дополнительный месяц. Новые уроки открываются каждые два дня
  • Конспект к каждому видеоуроку. Конспекты остаются у тебя навсегда
  • Тесты к урокам
  • Сертификат о прохождении курса
Регистрация недоступна
Figma Expert Figma Expert
  • Обучение в личном кабинете начинается с даты старта потока, указанной на странице курса
  • 21 видеоурок с доступом на время обучения плюс один дополнительный месяц. Новые уроки открываются каждые два дня
  • Конспект к каждому видеоуроку. Конспекты остаются у тебя навсегда
  • Тесты к урокам
  • Сертификат о прохождении курса
  • Проверка всех домашних заданий куратором с обратной связью в личном кабинете. Для выполнения заданий необходимы навыки работы в графическом редакторе
  • Доступ в закрытый телеграм-чат потока с куратором, где можно задавать вопросы и общаться с группой потока
Регистрация недоступна
Вопросы и ответы
Подойдет ли мне курс?
Курс подойдет как начинающим, так и практикующим веб-дизайнерам. Далеко не каждый практикующий веб-дизайнер может создавать Ui kit, эффективно работать с компонентами, вариантами или дизайн-токенами. Вся эта информация будет максимально полезна как начинающим веб-дизайнерам, так и тем, у кого уже есть опыт работы в этом направлении.
Какие знания и навыки я получу?
Освоишь Figma и будешь эффективно использовать инструменты редактора. Научишься создавать интерактивные прототипы веб-сайтов и Ui kit. Разберешься в bootstrap, атомарном дизайне, компонентах, вариантах и Auto Layout. Поймешь, что такое дизайн-токены и как их применять в работе.
Как проходит обучение?
Доступ к курсу предоставляется в личном кабинете на собственной платформе школы. Там же, после старта обучения, будут постепенно открываться все видеоуроки, каждые два дня — новый урок. После просмотра урока необходимо пройти тест и, если нужно, выполнить домашнее задание. При обучении в формате потока куратор проверяет домашнее задание, отправляет на него фидбек, а также отвечает на любые возникшие вопросы. После прохождения курса получаешь именной сертификат в электронном виде.
Сколько времени мне нужно будет уделять обучению?
Все зависит только от вас. В среднем пользователи платформы уделяют обучению от 3 до 5 часов в неделю. Проходить обучение можно в удобном для себя темпе. 
Какими знаниями надо обладать для участия в курсе?
Данный курс рассказывает обо всех инструментах и возможностях Figma с нуля. Все что нужно для старта — компьютер и Figma. При этом выполнение домашнего задания не является обязательным условием для получения сертификата школы, как в самостоятельном формате участия, так и в формате потока. Чтобы получить сертификат, необходимо посмотреть все видеоуроки и выполнить необходимые тесты.
На сколько времени выдается доступ к курсу?
Доступ к материалам курса выдается на время обучения плюс один дополнительный месяц, чтобы закончить курс, если не успеваешь, либо повторить пройденный материал.
Получайте полезную информацию, будьте вдохновленными. Следите за нами в Instagram и Facebook
По любым вопросам пишите на почту info@skillwant.com
© SKILLWANT 2022
Designed with by Bravants
Просматривая этот сайт, вы принимаете условия использования файлов cookies. Политика конфиденциальности
{"isShowOnlySelfie":false,"isShowOnlyStreams":true,"plannedStreams":0}