Дизайнер Figma: кто это, обязанности, зарплаты и как им стать в 2023 году. Обзор профессии.

Кто такой дизайнер Figma?

Дизайнер Figma — дизайнер, работающий в популярном графическом редакторе Figma, который используется для оформления сайтов, интернет-магазинов, мобильных приложений и т д

Что делают дизайнеры Figma и чем занимаются?

Обязанности, например, на одной из вакантных должностей:

• Разработка концепции дизайна и интерфейса для сайтов.
• Разработка прототипов.
• Разработка детальных макетов страниц, интерфейсов, модулей, отдельных элементов.
• Создание графических элементов для сайтов.
• Командная работа.

Что должен знать и уметь дизайнер Figma

Требования к дизайнерам Figma:

• Профессионально работает в Figma
• Подготовьте адаптивные макеты
• Добавляйте прототипы в интерактивном режиме
• Создание компонентов и библиотек стилей
• Работа над проектом в команде
• Отправить макет в разработку

Востребованность и зарплаты дизайнеров Figma

Сейчас на сайте поиска работы 2283 вакансии и спрос на дизайнеров Figma растет с каждым месяцем.

Количество вакансий дизайнера Figma с указанной зарплатой по всей России:

• от 80 000 руб. — 541
• от 145 000 руб. — 267
• от 210 000 руб. — 112
• от 275 000 руб. — 55
• от 345 000 руб. — 27

Вакансии с указанным уровнем дохода в Москве:

• от 85 000 руб. — 258
• от 155 000 руб. — 116
• от 225 000 руб. — 50
• от 295 000 руб. — 24
• от 365 000 руб. — 8

Вакансии с указанным уровнем дохода в Санкт-Петербурге:

• от 80 000 руб. — 95
• от 135 000 руб. — 51
• от 190 000 руб. — 29
• от 240 000 руб. — 1. 3
• от 295 000 руб. — 7

Как стать дизайнером Figma и где учиться?

Возможности обучения дизайнера Figma с нуля:

• Самостоятельное обучение — всевозможные видео на YouTube, книги, форумы, туториалы и т д. Плюсы — дешево или очень доступно. Недостатки — нет последовательности, самообучение может быть малоэффективным, приобретенные навыки могут не потребоваться работодателю;
• Онлайн обучение. Вы можете пройти курс на одной из образовательных платформ. Такие курсы рассчитаны на людей без специальной подготовки, поэтому подойдут большинству людей. Обычно упор в онлайн-обучении делается на практику — это позволяет быстро пополнить портфолио и устроиться на работу сразу после обучения.

Ниже представлен обзор 15+ лучших онлайн-курсов.

15+ лучших курсов для обучения дизайнера Figma: подробный обзор

1 место. Курс «Figma с нуля до PRO» — Skillbox

https://skillbox.ru/course/figma-null-pro/

Стоимость: рассрочка на 6 месяцев — 4 796 ₽/мес

• Продолжительность 8 недель
• Лайфхаки от профессиональных дизайнеров
• Обучение в процессе работы
• Доступ к курсу навсегда.

Figma — это инструмент, который выбирают веб-дизайнеры и UX-дизайнеры по всему миру. С его помощью вы сможете быстро создавать интерактивные прототипы будущих сайтов, сервисов и приложений. И даже макет в Figma могут редактировать несколько человек одновременно — это идеальный инструмент для командной работы.

Для кого этот курс:

• Новичкам в веб-дизайне
  Изучайте Figma с нуля. Научитесь использовать сочетания клавиш для быстрой работы. Добавьте в свое резюме полезный навык, который оценят работодатели.
• Веб-дизайнеры без опыта работы с Figma
  Узнайте, как создать UI-кит, использовать плагины и компоненты. Увеличьте скорость своей работы и освободите время для творческих задач.

Чему вы хотите научиться:

1. Профессионально работает в Figma
   Разобраться с интерфейсом и настройками программы. Научитесь работать с фигурами, слоями и внутренними редакторами.
2. Подготовьте адаптивные макеты
   Вы сможете создавать прототипы с разной степенью детализации и адаптировать их под любое устройство.
3. Добавляйте прототипы в интерактивном режиме
   Изучите базовую анимацию. Вы можете визуально показать клиенту, как клиенты будут использовать продукт.
4. Создание компонентов и библиотек стилей
   Узнайте, как сгруппировать шрифты и цвета в отдельные группы, чтобы сохранить единый визуальный стиль в многостраничных макетах.
5. Работа над проектом в команде
   Изучите расширенные инструменты, чтобы лучше планировать свою работу, быстро вносить изменения и координировать макеты.
6. Отправить макет в разработку
   Узнайте, как организовать слои и монтажные области. Вы сможете грамотно показать разработчикам технические аспекты и коды компонентов.

Программа

Вас ждут онлайн-лекции и практические задания на реальных кейсах.
8 тематических модулей, 48 онлайн-уроков

1. Введение в Фигму
   Разобраться с интерфейсом и основными настройками программы. Научитесь использовать геометрические фигуры, слои и текстовые поля. Соберите свой первый прототип.
2. Иконки, иллюстрации и картинки
   Узнайте, как создавать собственные значки и управлять изображениями с помощью внутренних инструментов Figma. Вы сможете создавать дизайн-макеты с нуля, не используя сторонние редакторы.
3. Компоненты
   Узнайте, как создавать компоненты и использовать панель настроек. Научитесь создавать интерактивные прототипы и покажите клиенту, как люди будут использовать будущий сайт.
4. Библиотеки компонентов и общие стили
   Вы сможете создавать библиотеки стилей и наборы пользовательского интерфейса для стандартизации элементов интерфейса. Узнайте, как создавать аккуратные макеты с помощью модульных сеток.
5. Автоматическая настройка и параметры
   Узнайте, как объединить макеты в единую систему с помощью функции «Варианты». Вы сможете создавать и настраивать сложные элементы интерфейса для разных устройств.
6. Сложные документы с несколькими страницами
   Узнайте, как работать с основными экранами и создавать дерево страниц. Изучите бета-версию функции «Ветви». Вы поймете, как организовать работу команды над разными версиями одной и той же верстки.
7. Дополнительные возможности и сообщество авторов
   Узнайте, какие плагины помогут вам быстро создавать проекты и работать над правками. Узнайте, как добавить анимацию в прототипы.
8. Подготовка макета для разработчиков
   Вы можете показать разработчику технические аспекты проекта и код компонентов. Узнайте, как оптимизировать работу команды с помощью плагина Figma Jam.

2 место. Курс «Figma» — irs.academy

https://irs.academy/kurs_po_figma

Цена: 19 700 ₽

После прохождения курса вы сможете:

• Используйте инструменты Figma эффективно
• Создать приложение, сайт и т.д.
• Находите клиентов и продуктивно взаимодействуйте с ними
• Фрилансеры из любой точки мира
• Получить интересную работу в престижной компании.

Программа курса Фигма:

Урок №1 — Знакомство с Figma
Figma как современный инструмент разработки интерфейсов. Основы работы в этой программе, ее польза для дизайнера.

Урок №2 — Возможности Figma. Инструментарий программы
Изучите все функции и особенности инструментов Figma.

Урок №3 — Компоненты и прототипирование
Узнаем все нюансы и скрытые возможности программы, а также рассмотрим возможности крутых прототипов интерфейса.

Урок №4 — Бог Фи
Используем секретные знания на практике, создаем интерфейс приложения в Figma.

Урок № 5 — Дизайн веб-сайта
В пятом уроке мы поговорим об этапах создания сайта и их взаимосвязи.

Урок №6 — Урок подкрепления. Создаем дизайн нашего приложения
В шестом уроке — практика создания веб-приложения с помощью Figma.

В конце обучения вы получите сертификат, подтверждающий, что вы прошли 6 уроков онлайн-курса Figma.

3 место.Курс «Figma» — SKVOT

https://skvot.io/ru/course/figma-soft-thinking

Стоимость: нет информации

За 11 уроков вы освоите каждый клик в Figma, научитесь проектировать интерфейсы, работать с сетками, стилями и компонентами. В рамках курса вы создадите интерактивный прототип приложения с анимацией и интерактивными кнопками. Каждый урок — это новое продуктовое задание, новый вызов, практика и обратная связь.

Программа:

1. ФУНКЦИОНАЛЬНОСТЬ ФИГМА. ВВЕДЕНИЕ

• Интерфейс
• Новый проект против FigJam
• Фреймы и слои
• Группы и выравнивание
• Формы и цвета
• Работа с изображениями

1. ФУНКЦИОНАЛЬНОСТЬ ФИГМА. КУЛЬМИНАЦИЯ

• Работа с текстом и шрифтами
• Инструмент «Перо» и векторная сетка
• Иконки
• Эффекты, маски и слияние

1. ФУНКЦИОНАЛЬНОСТЬ ФИГМА осуждение

• Режим презентации. Зеркальное приложение
• Какие файлы можно открыть в Figma
• Контроль версий
• Плагины
• Общество

1. МОДУЛЬНЫЕ БЛЮДА

• Различные типы сеток и их применение
• Горизонтальный ритм в макете
• Вложенные сетки
• Отзывчивый дизайн: создание сетки для браузера, планшета и телефона
• Подключить контент к сетке

1. АВТОПЛАНИРОВКА, ИЛИ КАК Я РАНЬШЕ ЖИЛ

• Что такое автомакет
• Создание и настройка Auto Layout. Кнопка
• Вложенные автоматические макеты. Форма авторизации
• Адаптивный сайт с модульной сеткой и автоматической версткой

1. СТИЛЬ И КОМПОНЕНТЫ

• Как стили помогают дизайнеру
• Стили для цветов, текста, эффектов и сеток
• Группировка и совместное использование стилей
• Компоненты и их переменные. Изменять
• Как использовать компоненты для ускорения работы

1. ДИНАМИЧЕСКИЕ КОМПОНЕНТЫ

• Объедините компоненты в группы
• Альтернативы
• Вложенные компоненты
• Библиотеки команд и проектирование системы

1. Создайте кликабельный прототип

• Просмотреть прототипы
• Фиксированные элементы
• Триггеры, действия и анимация
• Оверлеи и всплывающие окна
• Просматривайте и делитесь

1. АНИМАЦИЯ И ИНТЕРАКТИВНЫЕ КОМПОНЕНТЫ

• GIF в прототипе
• Интерактивные компоненты
• Умная анимация переходов между экранами
• Оверлеи и всплывающие окна

1. СТРУКТУРА ФИГМА

• Слой
• Проекты
• Файлы
• Обложки для файлов
• Типы доступа

1. РАЗГОВАРИВАТЬ

• Мы говорим о разных подходах к проектированию и структурированию работы в Figma с приглашенными лекторами. Мы учимся мыслить критически, а не просто повторять уроки.

Курс «Figma для дизайнеров» — Айтилогия

https://itlogia.ru/figma

Цена: 22 100 ₽

Чему вы хотите научиться:

• Безопасность с любым инструментом
  Освойте все инструменты и функции Figma, ярлыки, работу со слоями. В Figma вы сможете создавать уникальную графику и иконки любой сложности.
• Создайте более практичный рабочий процесс
  Узнайте, как организовать и автоматизировать свою работу в Figma, чтобы сократить время, необходимое для внесения изменений, правок и рутинных задач. А также о вспомогательных фишках и инструментах.
• Создавайте прототипы, быстро настраивайте макеты
  Узнайте, как настраивать монтажные области и быстро создавать адаптивные макеты. Вы можете проектировать интерфейсы любой сложности и объема.
• Создавайте свои собственные дизайн-системы и библиотеки
  Узнайте, как создавать собственные библиотеки компонентов и дизайн-системы, применять их в своих проектах и ​​ускорять работу
• Создавайте кликабельные прототипы
  Научитесь создавать кликабельные прототипы, всплывающие окна, горизонтальную и вертикальную прокрутку закадровых блоков, настраивать эффекты наведения. Познакомьтесь с Figma Animate и Smart Animate.
• Работайте в 2-3 раза быстрее и эффективнее
  Благодаря полученным знаниям и навыкам в Figma вы сможете браться за большее количество проектов, ведь вы научитесь выполнять их в 2-3 раза быстрее и так же быстро вносить изменения.

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

МОДУЛЬ 1. Введение в курс
Познакомьтесь с основателем ITology и автором курса Ольгой Черновой и узнайте больше о том, как следует преподавать курс.

МОДУЛЬ 2. Введение в Figma: обзор интерфейса и функций
Познакомьтесь с возможностями Figma. Установите программу и настройте ее самостоятельно. Управление рабочими зонами и функциями в организации рабочей зоны. Вы узнаете о командах и сообществе, как экспортировать проекты и делиться ими с коллегами, командами и клиентами. Выполните контрольную задачу по модулю.

МОДУЛЬ 3. Инструменты в Figma. Работа с графикой
Ознакомьтесь и научитесь правильно работать со всеми инструментами программы. Вы сможете использовать их как по отдельности, так и в сочетании друг с другом. Узнайте о 20+ полезных фишках для работы в Figma, которые ускорят вашу работу и сделают ее более удобной. Узнайте, как создавать значки в Figma и создайте свой собственный набор значков. Создайте 2 концепции дизайна в Figma, используя инструменты и эффекты, которые вы изучили.

МОДУЛЬ 4. Профессиональный инструмент для работы в Figma
Научитесь работать с сеткой и системой управления. Узнайте, как создавать и настраивать компоненты, работать с вариантами, корректно работать с ограничениями и ограничениями, ускорять и упрощать работу с контейнерными функциями, стилями и другими профессиональными инструментами в Figma. Узнайте, как использовать сообщество и плагины Figma, и научитесь проектировать за 1 час.

МОДУЛЬ 5. Дизайн-система и библиотека компонентов в Figma
Узнайте, как создать дизайн-систему и собственную библиотеку компонентов в Figma. Узнайте, как правильно организовать свое рабочее пространство с ними. Создайте дизайн-систему и библиотеку компонентов для собственного проекта. Вы узнаете, как правильно организовать работу с разработчиками.

МОДУЛЬ 6. Кликабельный прототип в Figma. Анимация
Научитесь создавать прототипы и дизайн-макеты в Figma, профессионально работайте с панелью Prototype. Узнайте, как использовать профессиональные инструменты Figma в сочетании друг с другом, что позволит вам работать более четко и быстро, а также быстро редактировать свой проект и вносить изменения и дополнения. Вы научитесь правильно, быстро и практично работать с режимом отображения прототипа. Научитесь применять дизайн-систему и библиотеку компонентов к вашему проекту и редактировать их. Вы сможете правильно демонстрировать прототипы клиентам и коллегам. Узнайте, как создавать кликабельные прототипы с различными эффектами и настройками перехода с помощью Prototype. Освойте Figma Animate и научитесь создавать дизайнерскую анимацию.

МОДУЛЬ 7. Быстрый адаптивный дизайн в Figma
Узнайте, как быстро адаптировать свой дизайн к устройствам с любым разрешением. Создавайте адаптивные макеты для своего проекта. Познакомьтесь с зеркалом Figma.

МОДУЛЬ 8. Умная анимация
Вы изучите Smart Animate в Figma и узнаете, как анимировать макеты дизайна.

МОДУЛЬ 9. Резюме
Давайте обобщим все, что вы узнали в Figma в этом курсе! И скажем, какой ты хороший ?

Курс « Figma» — Pentaschool

https://pentaschool.ru/program/figma

Цена: 19 000 ₽

К концу этого курса вы узнаете:

• Работа со всеми основными инструментами Figma
• Создание мудбордов для клиентов
• Дизайн с нуля лендингов, многостраничных сайтов и мобильных приложений
• Создавайте простые анимации интерфейса
• Подготовить техническое задание для разработчиков
• Разрабатывайте кликабельные веб-страницы и прототипы мобильных приложений.

Программа:

1. Фигма с нуля. Базовый уровень. Основы дизайна интерфейса
   Вы познакомитесь с инструментами Figma, научитесь работать со слоями, изображениями, текстом и модульной сеткой. Вы научитесь настраивать компоненты, научитесь создавать мудборды, а также попробуете работать с эффектами.
2. Уровень 2. Дизайн веб-интерфейса
   Вы перейдете к созданию многостраничных веб-сайтов, научитесь создавать различные типы меню, познакомитесь с горизонтальной, вертикальной и нестандартной навигацией. Вы научитесь наполнять страницу контентом, узнаете принципы юзабилити, познакомитесь с возможностями плагинов и подготовите проект для портфолио.
3. Фигма Мобайл. Дизайн мобильных приложений
   Вы научитесь пользоваться гайдами для iOS и Android, научитесь собирать основные экраны мобильных приложений в Figma, попробуете свои силы в редизайне существующих приложений.

По окончании обучения вы получите официальные документы о вашем обучении.

Курс «Figma для UI/UX дизайнера» — Центр компьютерного обучения «Специалист» при МГТУ им.Н.Э.Баумана

https://www.specialist.ru/course/figma

Цена: 16 150 ₽ — 19 990 ₽

Ты выучишь:

• построить работу цикла веб-разработки;
• создание дизайнов десктопных сайтов;
• планирование адаптивного макета сайта для разных устройств;
• работа с инструментом Constraints в Figma;
• экспортировать макет из Figma, предоставлять информацию верстальщикам и программистам;
• использовать плагины, компоненты, стили и общие библиотеки;
• создавать интерактивные модели с помощью приложений Axure;
• основы командной работы в Figma.

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

Модуль 1. Основы Figma (4 часа.)

• Цикл веб-разработки.
• Роль дизайнера, место для Figma на всех этапах разработки.
• Преимущества Фигмы
• Установка фигмы.
• Интерфейс
• Манипуляции с объектами
• Инструмент с рамой и диском
• Векторные примитивы
• Работа с вектором и пером
• Слои и швы
• Текст
• Цвет, градиенты, изображения
• Сетки и направляющие
• Стили
• Простое макетирование макета
• Лабораторная работа: Создание элементов страницы
• Домашнее задание

Модуль 2. Дизайн настольного веб-сайта (8 часов.)

• Дизайн сетки для многоколоночных макетов, типовые схемы дизайна
• Размещение графической и текстовой информации
• Поддержка файлов, типы файлов
• Работа с графическими элементами
• Форматируйте текст, создавайте и используйте шаблоны
• Лабораторная работа: Создание шаблонов страниц
• Домашнее задание

Модуль 3. Дизайн сайта для планшетов и смартфонов (8 часов.)

• Ограничения и адаптивность
• Принцип Mobile First
• Спланируйте адаптируемый макет для разных устройств
• Адаптивность и ограничения
• Лабораторная работа: Создание шаблонов страниц
• Домашнее задание

Модуль 4: Интеграция и экспорт, дополнительные функции (4 часа.)

• Создать набор пользовательского интерфейса
• Форматы экспорта, настройка элементов для экспорта
• Презентация информации для верстальщиков и программистов
• Возможности командной работы в Figma
• Плагины, компоненты, стили и общие библиотеки
• Использование приложений Axure для создания интерактивных моделей.

Курс «Эффективный сайт с нуля в Figma» — УрГЭУ Multimedia

https://arena.usue.ru/kursy/novinki/figma/

Цена: 9 900 ₽

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

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

1. Вводная часть. Основные концепции веб-дизайна:
   Зачем вам нужен сайт? Типы сайтов и цели. Концепция веб-сайта. Позиционная работа. Роль веб-дизайнера в бизнесе.
2. Принципы веб-дизайна. Макет страницы. Пользовательский опыт:
   Работа с цветами в разных местах сайта. Личность. Основные элементы сайта. Визуальные элементы в разных стилях. Определение UI/UX. Как сделать сайт интуитивно понятным.
3. Интерфейс и знание программы:
   Основы работы в Figma Возможности и инструменты графического редактора. Подготовка собственного проекта согласно ТЗ.
4. Состав макета сайта. Работа с фигурами и изображениями:
   Обзор инструментов для создания форм. Картинки. Как выбрать? Где искать? Импорт файлов. Вспомогательные элементы. Рамки, сетки, сетки. Прототип страницы.
5. Основы типографики:
   Работа с текстом и умными направляющими. Типы шрифтов, правила оформления текста, юзабилити и типографика. Подбор актуальных шрифтов для проекта, верстка текста страницы.
6. Создание адаптивных версий и завершение настройки:
   Работает с экспортом. Разрешения макета. Зеркало Figma для мобильных устройств. Адаптивный дизайн.
7. Сдача проектов:
   Презентация проектов. «Разбор полетов». Комментарии к работам.

Курс «Веб-дизайн и дизайн интерфейсов в Figma» — Breezzly

https://breezzly.ru/catalog/design-interfeisov-v-figma

Цена: 2000 ₽

Чему вы научитесь на курсе:

Сначала вы освоитесь в Figma, а затем возьметесь за проектирование реальных проектов многоэкранных систем, таких как веб-сайты, мобильные и веб-приложения. У вас будет практика в основах веб-дизайна, а также практика в дизайне интерфейсов (дизайн пользовательского интерфейса) приложений на основе исследований UX. В ходе курса вы выполните множество проектов по дизайну веб-сайтов и приложений, освоите систему дизайна, станете смелее в экспериментах и ​​реализации собственных идей!

Чему вы хотите научиться:

1. Безопасно на Figma с формами, цветами, шрифтами, изображениями и модульной сеткой
2. Выстроить рабочий процесс и организовать работу с дизайном сайтов и приложений в Figma
3. Создание прототипов для устройств с разным разрешением
4. Внедрение интерфейсов для разных платформ и полировка эстетики
5. Создание компонентов, работа с эффектами
6. Настройте анимацию с помощью Smart Animate
7. Используйте результаты исследования UX для дизайна.

Программа:

• Проект 1. Домашняя страница студии дизайна интерьера с персонажем — организация работы и дебют
  10 уроков
• Проект 2. Приложение SmartWatch для проката электросамокатов — от исследования UX к продукту
  7 уроков
• Проект 3. Мобильное приложение для ухода за джунглями дома — редизайн и концепция бренда на основе анализа и данных
  14 уроков
• Проект 4. Сервис доставки впечатлений на дом — создание веб-интерфейса в фирменном стиле на основе компонентов Google Material Design
  11 уроков
• Дополнительный проект. Коммуникационный дизайн: фирменный стиль и айдентика цифрового бренда на этапах от исследования до внедрения.

Курс «Основы Figma» — Contented

https://live.contented.ru/figma-free-course

Стоимость: бесплатно

Figma — графический онлайн-редактор для создания баннеров, прототипов сайтов и интерфейсов приложений. С него начинается путь к графике, UX/UI и веб-дизайну.

На курсе:

• Изучите основы Figma
• Отточите свои дизайнерские навыки
• Создать иконку и баннер
• Получите обратную связь по домашнему заданию
• Узнайте о работе дизайнера на вебинаре
• Вы начнете прямой путь к дизайну.

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

Шаг 1: Обучение

• Понимание интерфейса Figma;
• Научиться работать с фреймами и сетками;
• Изучите принципы работы с текстом;
• Создавайте геометрические баннеры и иконки.

Шаг 2: Заключительный вебинар

Расскажем:

• Как войти в профессию и преуспеть в ней.
• Как обстоят дела с вакансиями и сколько получают эти специалисты
• Как проходит день дизайнера
• Проверьте свою домашнюю работу и дайте обратную связь в прямом эфире.
• Мы наградим автора лучшей работы секретным призом; Все, кто пришел на вебинар, получат подарки в размере 24 000 рублей.

Курс «Figma» — Figma info

https://figma.info/blog/lessons/

Стоимость: бесплатно

Учебники по фигме:
В этой категории вы найдете туториалы по Figma на русском языке. Начать изучение Figma можно с любого урока, каждый из которых раскрывает одну или несколько возможностей программы.

1. Дизайн в Figma главной страницы строительной компании
   Разработка адаптивной версии дизайна главной страницы
2. Дизайн и верстка первого экрана с figma на html
   Дизайн и верстка первого экрана с нуля (Learn Gulp, html, css, js)
3. Сетки в Figma, направляющие и линейки в Figma
   Работайте с сеткой, линейками и направляющими в Figma.
4. Ребрендинг компании с логотипа на веб-дизайн
   Полный курс по ребрендингу компании с логотипа на сайт
5. Ошибка в веб-дизайнере
   Самые важные ошибки, которые допускают веб-дизайнеры в разработке
6. Обзор программы Figma (Фигма)
   Обзор основных инструментов в Figma
7. Дизайн многостраничного корпоративного сайта
   Хотим сделать редизайн сайта ремонтной компании.
8. Дизайн главной страницы интернет-магазина. Урок №2.
   На втором уроке я буду рисовать макет главной страницы интернет-магазина.
9. Дизайн главной страницы интернет-магазина. Урок 1
   В этом уроке мы разработаем прототип будущего дизайна интернет-магазина.

Курс «Figma» — Figma education

https://www.figma.com/education/

Стоимость: бесплатно

Начните с трех шагов:

Начать разработку и сотрудничество с Figma Education Plan легко.

1. Зарегистрироваться на Фигме
   Создайте учетную запись Figma, используя свой адрес электронной почты. Домен электронной почты учреждения предпочтителен, но не обязателен.
2. Пройти тест на образование
   Подтвердите свое образование на странице figma.com/education/apply.
3. Создайте свою команду
   Включите образовательный план, чтобы бесплатно пользоваться всеми преимуществами нашего профессионального плана.

Курс «Figma» — Tilda school

https://tilda.school/figma-free-course

Стоимость: бесплатно

За 13 коротких и простых уроков вы поймете основы работы в Figma и переноса дизайнов на Тильду.

Курс «Figma» — Академия IT

https://academiait.ru/course/kurs-figma/

Стоимость: бесплатно

Уроки:

1. Интерфейс.
2. Манипуляции с объектами
3. Инструмент с рамой и диском
4. Векторные объекты
5. Работа с кривыми и пером.
6. Слои и швы.
7. Текст.
8. Цвет.
9. Сетки и направляющие.
10. Стили.
11. Ограничения
12. Компоненты.
13. Творчество и разумный выбор.
14. Прототипирование.
15. Интеграция и экспорт.

Курс «Figma. Уроки для начинающих с нуля на русском» — figma.center

https://figma.center/kurs-po-figma-uroki-dlya-nachinayushhih-s-nulya-na-russkom/

Стоимость: бесплатно

 Структура курса и доступные уроки:

1. Где можно скачать и как установить программу Figma на компьютер?
2. Как использовать Фигму? Обзор программы за 20 минут.
3. Framework — подробный разбор инструмента.

Курс «Figma для Веб дизайнера — с нуля до профессионала» — beONmax

https://beonmax.com/courses/figma/

Стоимость: бесплатно

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

Чему вы хотите научиться:

• Внутренний и внешний интерфейс программы
• Инструменты Фигмы
• Каркас – очень важная деталь. Фреймворк является основой программы.
• Компоненты
• Ограничения (Ограничения/привязки)
• Сетка и система управления в Figma
• Плагины
• Прототипирование
• Стили
• Атомный дизайн
• Основы вашей библиотеки компонентов.

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

Учебник включает в себя видеоуроки по изучению Figma с нуля. Благодаря практическим урокам и упражнениям вы сможете закрепить свои знания основ Figma для эффективного применения и дальнейшего развития в дизайне и веб-дизайне.

• ВВЕДЕНИЕ — О КУРСЕ ВЕБ-ДИЗАЙНА FIGMA — С НУЛЯ ДО ПРОФЕССИОНАЛА
• ОСНОВНАЯ ФИГМА
• ИНСТРУМЕНТЫ ФИГМА
• ПРОФЕССИОНАЛЬНЫЕ ИНСТРУМЕНТЫ FIGMA
• СОЗДАЙТЕ СВОЮ БИБЛИОТЕКУ КОМПОНЕНТОВ
• ПРАКТИКА РАБОТЫ В FIGMA. СОЗДАЙТЕ ПРИЛОЖЕНИЕ
• ПРОТОТИПИРОВАНИЕ В FIGMA
• ПРАКТИКА РАБОТЫ В FIGMA — 2. СОЗДАЙТЕ ПРИЛОЖЕНИЕ
• ЗАВЕРШЕНИЕ КУРСА — ПОЛУЧЕНИЕ СЕРТИФИКАТА.

Курс «Figma. Начальный уровень» — GeekBrains

https://gb.ru/courses/1210

Стоимость: бесплатно

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

Программа:

Урок 1. Онбординг: вводный урок. Компоненты пользовательского интерфейса: библиотека образцов
Что такое Figma: цели, возможности Примеры верстки. How-to, паттерны взаимодействия с этим функционалом. Инструменты: пипетка, палитра цветов, цветовая палитра, градиенты, использование Swatch lib для примитивов.

Урок 2
Как создать текстовый слой; как создать свои стили текста, которые будут повторяться в интерфейсе; как разделить их на группы, иерархия

Урок 3
Навык работы с примитивами, соединение слоев в группы и фреймы, архитектура хранения компонентов

Урок 4
Отзывчивые элементы для разных размеров экрана.

Урок 5. Компоненты пользовательского интерфейса: навигация
Создание элементов навигации.

Курс «36 уроков для новичков по Figma» — Infogra

https://infogra.ru/lessons/36-urokov-dlya-novichkov-po-figma

Стоимость: бесплатно

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

1. Интерфейс
2. Манипуляции с объектами
3. Инструмент с рамой и диском
4. Векторные объекты
5. Работа с кривыми и пером
6. Слои и швы
7. Текст
8. Цвет
9. Сетки и направляющие
10. Стили
11. Ограничения
12. Компоненты
13. Творчество и разумный выбор
14. Прототипирование
15. Интеграция и экспорт
16. Обзор интерфейса: учетная запись, история версий, раскладка multiview
17. Обзор меню и предпочтений
18. Инструменты и калькулятор
19. Сделать панель и массу
20. Модульная сетка в Figma
21. Привязки (ограничения) в Figma
22. Компоненты в Figma #1 — Простые примеры. Когда следует использовать?
23. Компоненты в Figma #2 — сложные примеры. Ломаем, костыляем ?
24. Компоненты Figma #3 — Рокировка
25. Компоненты Figma #4 — Иконки и адаптивность
26. Компоненты в Figma #5 — Адаптивный через дублированный макет
27. Выравнивание в Figma, Очистка, упаковка и раздача
28. Текст в Фигме
29. Цвет, градиенты, изображения в Figma
30. Обводка и эффекты: тени, размытие, края в Figma
31. Библиотека командных компонентов в Figma
32. Прототипы в Figma и умные анимации (smart animate)
33. Панель кода и экспорт
34. Ссылка на проект в Figma (часть Figma)
35. Как установить, активировать плагины в Figma | ? плагины
36. Автоматическая верстка в Figma? (стеки в Figma).

Курс «Основы Figma» — Нетология

https://netology.ru/programs/osnovy-figma

Стоимость: бесплатно

За время обучения вы выполните 10 заданий и получите необходимую базу для работы в Figma. Макеты сайтов, промо-изображения для социальных сетей — все это может стать частью вашего портфолио.

Научитесь работать с основными инструментами Figma:

• Формы
• Сетки и направляющие
• Текст
• Маски
• Компоненты
• Стили
• Инструменты для прототипирования
• Последствия
• Интеграция растровых изображений
• Цвет и градиенты.

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

5,5 часов теории, 8 часов практики

1. Введение в Фигму
   Разберем интерфейс графического редактора и необходимые настройки перед началом работы
2. Рекламный баннер
   Изучим фигуры, научимся строить сетку и работать с текстом и пространством на примере баннера
3. Работа с интерфейсом
   Поговорим об основах UI/UX дизайна, узнаем, как и с чем работает дизайнер интерфейсов
4. Посадка
   Узнайте, какие задачи решает дизайнер при разработке сайта и создании макета лендинга
5. Адаптивный дизайн
   Вы поймете, как подготовить макет к жизни, узнаете о состояниях элементов и поработаете с адаптивностью.