Кто такой дизайнер Figma?
Дизайнер Figma – это дизайнер, который работает в популярном графическом редакторе Figma, который используется для дизайна сайтов, интернет-магазинов, мобильных приложений и т. д.
Что делают дизайнеры Figma и чем занимаются?
Обязанности на примере одной из вакансий:
- Разработка концепции дизайна и интерфейса сайтов.
- Разработка прототипов.
- Разработка детальных макетов страниц, интерфейсов, модулей, отдельных элементов.
- Создание графических элементов для сайтов.
- Работа в команде.
Что должен знать и уметь дизайнер Figma
Требования к дизайнерам Figma:
- Профессионально работать в Figma
- Готовить адаптивные макеты
- Добавлять интерактив в прототипы
- Создавать компоненты и библиотеки стилей
- Работать над проектом в команде
- Передавать макет в разработку
Востребованность и зарплаты дизайнеров Figma
На сайте поиска работы в данный момент открыто 2 283 вакансии, с каждым месяцем спрос на дизайнеров 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 руб. – 13
- от 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 Kit, использовать плагины и компоненты. Повысите скорость своей работы и освободите время для креативных задач.
Чему вы научитесь:
- Профессионально работать в Figma
Разберётесь в интерфейсе и настройках программы. Научитесь работать с фигурами, слоями и внутренними редакторами. - Готовить адаптивные макеты
Сможете создавать прототипы с разной степенью детализации и адаптировать их под любые устройства. - Добавлять интерактив в прототипы
Освоите базовую анимацию. Сможете наглядно показать заказчику, как клиенты будут пользоваться продуктом. - Создавать компоненты и библиотеки стилей
Научитесь объединять шрифты и цвета в отдельные группы, чтобы сохранять единый визуальный стиль в многостраничных макетах. - Работать над проектом в команде
Освоите продвинутые инструменты, чтобы лучше планировать работу, быстро вносить правки и согласовывать макеты. - Передавать макет в разработку
Научитесь наводить порядок в слоях и артбордах. Сможете грамотно показать разработчикам технические аспекты и коды компонентов.
Программа
Вас ждут онлайн-лекции и практические задания на основе реальных кейсов.
8 тематических модулей, 48 онлайн-уроков
- Знакомство с Figma
Разберётесь в интерфейсе и базовых настройках программы. Научитесь использовать геометрические фигуры, слои и текстовые поля. Соберёте свой первый прототип. - Иконки, иллюстрации и картинки
Узнаете, как создавать собственные иконки и обрабатывать изображения, используя внутренние инструменты Figma. Сможете делать дизайн-макеты с нуля, не используя сторонние редакторы. - Компоненты
Узнаете, как создавать компоненты и пользоваться панелью настроек. Научитесь делать интерактивные прототипы и показывать заказчику, как люди будут пользоваться будущим сайтом. - Библиотеки компонентов и общие стили
Сможете создавать библиотеки стилей и UI Kit, чтобы стандартизировать элементы интерфейса. Научитесь верстать аккуратные макеты с помощью модульных сеток. - Auto Layout и Variants
Поймёте, как объединить макеты в единую систему с помощью функции Variants. Сможете создавать и адаптировать под разные устройства сложные элементы интерфейса. - Сложные многостраничные документы
Научитесь работать с базовыми экранами и создавать дерево страниц. Освоите бета-версию функции Branches. Поймёте, как организовать работу команды над разными версиями одного макета. - Дополнительные возможности и сообщество авторов
Узнаете, какие плагины помогут вам быстро создавать драфтовые проекты и работать с правками. Научитесь добавлять анимацию в прототипы. - Подготовка макета для разработчиков
Сможете показать разработчику технические аспекты проекта и код компонентов. Научитесь оптимизировать работу команды с помощью плагина Figma Jam.
2 место. Курс «Figma» — irs.academy
https://irs.academy/kurs_po_figma
Стоимость: 19 700 ₽
После окончания курса вы сможете:
- Эффективно использовать инструменты Figma
- Создать приложение, сайт и т.д.
- Находить заказчиков и продуктивно взаимодействовать с ними
- Зарабатывать фрилансом из любой точки мира
- Получить интересную работу в престижной компании.
Программа курса по Figma:
Урок № 1 — Знакомство с Figma
Фигма как современный инструмент разработки интерфейсов. Основы работы в данной программе, ее преимущество для дизайнера.
Урок № 2 — Возможности Figma. Инструментарий программы
Изучение всех особенностей и свойств инструментов Figma.
Урок № 3 — Компоненты и прототипирование
Познаем все нюансы и скрытые фишки программы, а также рассмотрим возможности крутого прототипирования интерфейса.
Урок № 4 — Бог Фи
Тайные знания применяем в практике, создаем интерфейс приложения в Фигме.
Урок № 5 — Дизайн сайта
На пятом уроке мы поговорим об этапах создания сайта и их взаимосвязи.
Урок № 6 — Закрепляющий урок. Создаем дизайн своего приложения
На шестом уроке — практика по созданию веб-приложения при помощи Figma.
По окончанию обучения вы получите сертификат, подтверждающий, что вы прослушали 6 уроков онлайн-курса по Figma.
3 место.Курс «Figma» — SKVOT
https://skvot.io/ru/course/figma-soft-thinking
Стоимость: нет информации
За 11 занятий ты освоишь каждый клик в Figma, научишься проектировать интерфейсы, работать с сетками, стилями и компонентами. В рамках курса создашь кликабельный прототип приложения с анимацией и интерактивными кнопками. Каждое занятие — новая продуктовая задача, новый вызов, практика и фидбек.
Программа:
- ФУНКЦИОНАЛ FIGMA. ВСТУПЛЕНИЕ
- Интерфейс
- Новый проект vs FigJam
- Фреймы и слои
- Группы и выравнивание
- Фигуры и цвета
- Работа с изображениями
- ФУНКЦИОНАЛ FIGMA. КУЛЬМИНАЦИЯ
- Работа с текстом и шрифтами
- Pen tool и векторные сети
- Иконки
- Эффекты, маски и объединение
- ФУНКЦИОНАЛ FIGMA. РАЗВЯЗКА
- Режим презентации. Mirror App
- Какие файлы можно открывать в Figma
- Контроль версий
- Плагины
- Комьюнити
- МОДУЛЬНЫЕ СЕТКИ
- Разные виды сеток и их применение
- Горизонтальный ритм в макете
- Вложенные сетки
- Адаптивный дизайн: создаем систему сеток для браузера, планшета и телефона
- Привязка контента к сетке
- AUTO LAYOUT, ИЛИ КАК Я ЖИЛ РАНЬШЕ
- Что такое Auto Layout
- Создание и настройки Auto Layout. Кнопка
- Вложенные Auto Layout. Форма авторизации
- Адаптивная страница с модульной сеткой и Auto Layout
- СТИЛИ И КОМПОНЕНТЫ
- Как стили помогают в работе дизайнера
- Стили для цвета, текста, эффектов и сеток
- Группировка и шеринг стилей
- Компоненты и их переменные. Свопы
- Как с помощью компонентов ускорить работу
- ДИНАМИЧЕСКИЕ КОМПОНЕНТЫ
- Объединение компонентов в группы
- Варианты
- Вложенные компоненты
- Командные библиотеки и дизайн системы
- СОЗДАНИЕ КЛИКАБЕЛЬНОГО ПРОТОТИПА
- Скролл в прототипах
- Фиксированные элементы
- Триггеры, действия и анимация
- Оверлеи и поп-апы
- Просмотр и шеринг
- АНИМАЦИЯ И ИНТЕРАКТИВНЫЕ КОМПОНЕНТЫ
- Гифы в прототипе
- Интерактивные компоненты
- Смарт-анимация переходов между экранами
- Оверлеи и поп-апы
- СТРУКТУРА FIGMA
- Команды
- Проекты
- Файлы
- Обложки для файлов
- Виды доступа
- ПЕРЕГОВОРКА
- Говорим о различных подходах к дизайну и структурированию работы в Figma с приглашенными лекторами. Учимся думать критически, а не просто повторять туториалы.
Курс «Figma для дизайнеров» — Айтилогия
https://itlogia.ru/figma
Стоимость: 22 100 ₽
Чему вы научитесь:
- Уверенно работать с любым инструментом
Освоите все инструменты и возможности Figma, шорткаты, работу со слоями. Сможете создавать уникальную графику и иконки любой сложности в FIgma. - Выстраивать удобнее рабочий процесс
Узнаете, как организовать и автоматизировать работу в Figma, чтобы сократить время на внесение изменений, правок и на рутинные действия. А также о вспомогательных фишках и инструментах. - Создавать прототипы, быстро адаптировать макеты
Научитесь настраивать артборды и быстро создавать адаптивные макеты. Сможете проектировать интерфейсы любой сложности и объёма. - Создавать собственные дизайн-системы и библиотеки
Научитесь создавать собственные библиотеки компонентов и дизайн-системы, применять это в ваших проектах и тем самым ускорять работу - Создавать кликабельные прототипы
Научитесь создавать кликабельные прототипы, окна pop-up, горизонтальную и вертикальную прокрутку блоков за пределы экрана, настраивать hover-эффекты. Познакомитесь с Figma Animate и Smart Animate. - Работать в 2-3 раза быстрее и эффективнее
Благодаря полученным знаниям и навыкам работы в Figma, вы сможете брать больше проектов, потому что научитесь выполнять их в 2-3 раза быстрее и так же быстро вносить изменения.
Программа курса
МОДУЛЬ 1. Введение в курс
Познакомитесь с основателем Айтилогии и автором курса Ольгой Черновой, а также узнаете больше о том, как будет проходить обучение на курсе.
МОДУЛЬ 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 Mirror.
МОДУЛЬ 8. Smart Animate
Вы изучите Smart Animate в Figma и научитесь анимировать ваши дизайн-макеты.
МОДУЛЬ 9. Подведём итоги
Подытожим всё, чему вы научились в Figma за этот курс! И скажем, какие вы молодцы ?
Курс « Figma» — Pentaschool
https://pentaschool.ru/program/figma
Стоимость: 19 000 ₽
По итогам этого курса вы научитесь:
- Работать со всеми основными инструментами Figma
- Подготавливать мудборды для клиентов
- Разрабатывать с нуля дизайн лендингов, многостраничных сайтов и мобильных приложений
- Создавать простую анимацию интерфейсов
- Подготавливать техническое задание для разработчиков
- Разрабатывать кликабельные прототипы сайтов и мобильных приложений.
Программа:
- Figma с нуля. Базовый уровень. Основы дизайна интерфейсов
Вы познакомитесь с инструментами Figma, научитесь работать со слоями, изображениями, текстом и модульной сеткой. Вы узнаете, как настраивать компоненты, изучите принципы создания мудбордов, а также попробуете работать с эффектами. - Уровень 2. Дизайн веб-интерфейсов
Вы перейдёте к созданию многостраничных сайтов, научитесь делать разные типы меню, познакомитесь с горизонтальной, вертикальной и нестандартной навигацией. Вы узнаете, как наполнять сайт контентом, изучите принципы юзабилити, познакомитесь с возможностями плагинов и подготовите проект для портфолио. - Figma Mobile. Дизайн мобильных приложений
Вы узнаете, как пользоваться гайдами iOS и Android, научитесь собирать основные экраны мобильных приложений в Figma, попробуете свои силы в редизайне уже существующих приложений.
По итогам обучения вы получите официальные документы о вашей подготовке.
Курс «Figma для UI/UX дизайнера» — Центр компьютерного обучения «Специалист» при МГТУ им.Н.Э.Баумана
https://www.specialist.ru/course/figma
Стоимость: 16 150 ₽ — 19 990 ₽
Вы научитесь:
- выстраивать работу по циклу web-разработки;
- создавать дизайн сайта для десктопа;
- планировать адаптивный макет сайта для различных устройств;
- работать с инструментом Ограничители в Figma;
- экспортировать макет из Figma, представлять информацию для верстальщиков и программистов;
- использовать плагины, компоненты, стили и общие библиотеки;
- создавать интерактивные макеты с помощью приложений Axure;
- основам командной работы в Figma.
Программа курса:
Модуль 1. Figma основы работы (4 ак. ч.)
- Цикл web-разработки.
- Роль дизайнера, место Figma на всех этапах разработки.
- Преимущества Figma.
- Установка Figma.
- Интерфейс
- Манипуляция с объектами
- Frame и slice tool
- Векторные примитивы
- Работа с вектором и пером
- Слои и маски
- Текст
- Цвет, градиенты, изображения
- Сетки и направляющие
- Стили
- Простое прототипирование макета
- Лабораторная работа: Создание элементов страниц
- Домашняя работа
Модуль 2. Создаем дизайна сайта для десктопа (8 ак. ч.)
- Сетки дизайна для многоколоночной верстки, типовые схемы дизайна
- Размещение графической и текстовой информации
- Поддержка файлов, типы файлов
- Работа с графическими элементами
- Форматирование текста, создание и использование шаблонов
- Лабораторная работа: Создание шаблонов страниц
- Домашняя работа
Модуль 3. Создаем дизайн сайта для планшетов и смартфонов (8 ак. ч.)
- Constraints и адаптивность
- Принцип Mobile First
- Планирование адаптируемого макета для разных устройств
- Адаптивность и ограничители
- Лабораторная работа: Создание шаблонов страниц
- Домашняя работа
Модуль 4. Интеграция и экспорт, дополнительные возможности (4 ак. ч.)
- Создание UI-kit
- Форматы экспорта, настройка элементов для экспорта
- Представление информации для верстальщиков и программистов
- Возможности командной работы в Figma
- Плагины, компоненты, стили и общие библиотеки
- Использование приложений Axure для создания интерактивных макетов.
Курс «Эффективный сайт с нуля в Figma» — УрГЭУ Multimedia
https://arena.usue.ru/kursy/novinki/figma/
Стоимость: 9 900 ₽
Figma это программа нового поколения для разработки интерфейсов программ, веб-сайтов и мобильных приложений.
Программа курса:
- Вводная часть. Основные понятия веб-дизайна:
Зачем нужен сайт? Виды сайтов и цель. Концепция сайта. Работа с позиционированием. Роль веб-дизайнера в бизнесе. - Принципы веб-дизайна. Макет сайта. Пользовательский опыт:
Работа с цветом при разном позиционировании сайта. Айдентика. Основные элементы сайта. Визуал элементов в разных стилях. Определение UI/UX. Как сделать сайт интуитивно понятным. - Интерфейс и знакомство с программой:
Основы работы в Figma Возможности и инструментарий графического редактора. Подготовка собственного проекта по ТЗ. - Композиция макета сайта. Работа с фигурами и изображениями:
Обзор инструментов для создания форм. Изображения. Как подбирать? Где искать? Импорт файлов. Вспомогательные элементы. Фреймы, гриды, сетка. Прототипирование страницы. - Основы типографики:
Работа с текстом и смарт гайдами. Виды шрифтов, правила верстки текста, юзабилити и типографика. Выбор релевантных шрифтов для проекта, верстка текста сайта. - Создание адаптивных версий и завершение работы с макетом:
Работа с экспортом. Права доступа к макетам. Figma Mirror для мобильных устройств. Адаптивный дизайн. - Сдача проектов:
Презентация проектов. «Разбор полетов». Комментарии к работам.
Курс «Веб-дизайн и дизайн интерфейсов в Figma» — Breezzly
https://breezzly.ru/catalog/design-interfeisov-v-figma
Стоимость: 2 000 ₽
Что узнаете на курсе:
Сначала вы освоитесь в Figma, а затем возьметесь за дизайн настоящих проектов многоэкранных систем, таких как: сайты, мобильные и веб-приложения. Вас ждет практика по основам веб-дизайна, а также практика дизайна интерфейсов (UI-дизайн) приложений на основе UX-исследований. За время курса вы выполните серию проектов по дизайну сайтов и приложений, освоите систему дизайна, станете смелее в экспериментах и воплощении собственных идей!
Чему научитесь:
- Уверенно работать в Figma с фигурами, цветом, шрифтами, изображениями и модульной сеткой
- Выстраивать рабочий процесс и организовывать работу по дизайну сайтов и приложений в Figma
- Создавать прототипы для устройств с разным разрешением
- Реализовывать интерфейсы для разных платформ и вытачивать эстетику
- Создавать компоненты, работать с эффектами
- Настраивать анимацию с помощью Smart Animate
- Применять результаты UX-исследований для создания дизайна.
Программа:
- Проект 1. Веб-сайт студии интерьера с характером — организация работы и дебют
10 уроков - Проект 2. Приложение для смарт-часов по аренде электроскутеров — от UX-исследований к продукту
7 уроков - Проект 3. Мобильное приложение для ухода за домашними джунглями — редизайн и бренд-концепция на основе аналитики и данных
14 уроков - Проект 4. Сервис по доставке впечатлений на дом – создание веб-интерфейса в фирменном стиле на компонентах Google Material Design
11 уроков - Дополнительный проект. Коммуникационный дизайн: фирстиль и айдентика для digital-бренда по шагам от исследований до реализации.
Курс «Основы 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 на русском языке. Обучение Фигме вы можете начать с любого урока, каждый из которых раскрывает одну или несколько функций программы.
- Дизайн в Figma главной страницы строительной компании
Разработка адаптивной версии дизайна главной страницы - Дизайн и верстка первого экрана из figma в html
Дизайн и верстка первого экрана с нуля (Изучите Gulp, html, css, js) - Сетка в фигме, направляющие и линейки в Figma
Работа с сеткой, линейками и направляющими в Figma. - Ре-брендинг компании от логотипа до дизайна сайта
Полный курс по ре-брендингу компании от логотипа до сайта - Ошибки веб-дизайнеров
Основные ошибки, которые допускают веб-дизайнеры в своем развитии - Обзор программы Figma (Фигма)
Обзор основных инструмент в программе Figma - Дизайн многостраничного сайта компании
Сделаем ре-дизайн сайта компании, занимающейся бытовым ремонтом. - Дизайна главной страницы интернет-магазина. Урок №2.
Во втором уроке я отрисую макет главной страницы интернет-магазина. - Дизайна главной страницы интернет-магазина. Урок №1.
В данном уроке мы разработаем прототип будущего дизайна интернет-магазина.
Курс «Figma» — Figma education
https://www.figma.com/education/
Стоимость: бесплатно
Начните с трех шагов:
Легко начать разработку и сотрудничество с образовательным планом Figma.
- Зарегистрируйтесь на Figma
Создайте свою учетную запись Figma, используя свой адрес электронной почты. Домен электронной почты вашего учреждения предпочтителен, но не обязателен. - Пройдите проверку для получения образования
Подтвердите свой статус образования по адресу figma.com/education/apply. - Создайте свою команду
Создайте команду с образовательным планом, чтобы бесплатно получить все преимущества нашего профессионального плана.
Курс «Figma» — Tilda school
https://tilda.school/figma-free-course
Стоимость: бесплатно
За 13 кратких и простых уроков вы разберетесь с основными моментами работы в Фигме и переносом дизайна в Тильду.
Курс «Figma» — Академия IT
https://academiait.ru/course/kurs-figma/
Стоимость: бесплатно
Уроки:
- Интерфейс.
- Манипуляция с объектами
- Frame & Slice tool
- Векторные объекты
- Работа с кривыми и пером.
- Слои и маски.
- Текст.
- Цвет.
- Сетки и направляющие.
- Стили.
- Constraits
- Компоненты.
- Выравнивание и умное выделение.
- Прототипирование.
- Интеграция и экспорт.
Курс «Figma. Уроки для начинающих с нуля на русском» — figma.center
https://figma.center/kurs-po-figma-uroki-dlya-nachinayushhih-s-nulya-na-russkom/
Стоимость: бесплатно
Структура курса и доступные уроки:
- Где скачать и как установить программу Figma на компьютер?
- Как пользоваться Figma? Обзор программы за 20 минут.
- Frame — подробный разбор инструмента.
Курс «Figma для Веб дизайнера — с нуля до профессионала» — beONmax
https://beonmax.com/courses/figma/
Стоимость: бесплатно
Figma — это графический редактор, который в корне изменил сам подход к работе дизайнера, упростил и ускорил ее, позволил наладить командную работу над проектами и быстрее получать желаемый результат.
Чему Вы научитесь:
- Внутренний и внешний интерфейс программы
- Инструменты Figma
- Frame — очень важная часть. Фрейм — это основа программы.
- Компоненты
- Contsraints (Ограничения/привязки)
- Система сеток и направляющих в Figma
- Плагины
- Прототипирование
- Стили
- Атомарный дизайн
- Основы своей библиотеки компонентов.
На практике создадите макеты мобильных приложений с применением полученных знаний, используя свою библиотеку компонентов. Также мы сделаем кликабельные прототипы этих приложений.
Программа обучения включает видео уроки по изучению Figma с нуля. Благодаря практическим урокам и заданиям, Вы сможете закрепить полученные знания по основам Фигма для эффективного применения и дальнейшего развития в области дизайна и веб-дизайна.
- ВВЕДЕНИЕ — О КУРСЕ FIGMA ДЛЯ ВЕБ ДИЗАЙНЕРА — С НУЛЯ ДО ПРОФЕССИОНАЛА
- ОСНОВЫ FIGMA
- ИНСТРУМЕНТЫ FIGMA
- ПРОФЕССИОНАЛЬНЫЕ ИНСТРУМЕНТЫ FIGMA
- СОЗДАНИЕ СВОЕЙ БИБЛИОТЕКИ КОМПОНЕНТОВ
- ПРАКТИКА РАБОТЫ В FIGMA. СОЗДАЁМ МАКЕТ ПРИЛОЖЕНИЯ
- ПРОТОТИПИРОВАНИЕ В FIGMA
- ПРАКТИКА РАБОТЫ В FIGMA — 2. СОЗДАЁМ МАКЕТ ПРИЛОЖЕНИЯ
- ЗАВЕРШЕНИЕ КУРСА — ПОЛУЧЕНИЕ СЕРТИФИКАТА.
Курс «Figma. Начальный уровень» — GeekBrains
https://gb.ru/courses/1210
Стоимость: бесплатно
Этот курс оригинален и полностью повторяет материал наших платных программ обучения. Вы получаете тот же материал, что и наши студенты, включая домашнее задание в некоторых видеоуроках. Мы рекомендуем использовать его для саморефлексии и проверки знаний тогда, когда вам это удобно. Проверка выполненного задания преподавателем не предусматривается.
Программа:
Урок 1. Onboarding: вводный урок. UI Components: Swatch Library
Что такое Figma: цели, возможности Примеры макетов. How-to, паттерны взаимодействия с данным функционалом. Инструменты: пипетка, подбор цветов, цветовая паллитра, градиенты, использование Swatch lib для примитивов.
Урок 2. UI Components: Text styles
Как создавать текстовый слой; как создать свои текстовые стили, которые будут повторяться в интерфейсе; как разделить их на группы, иерархию
Урок 3. UI Components: Buttons
Навык работы с примитивами, соедение слоев в группы и фреймы, архитектура хранения компонентов
Урок 4. UI Components: Constrains
Адаптивность элементов под разные размеры экрана.
Урок 5. UI Components: Навигация
Создание элементов навигации.
Курс «36 уроков для новичков по Figma» — Infogra
https://infogra.ru/lessons/36-urokov-dlya-novichkov-po-figma
Стоимость: бесплатно
Собрали в одной подборке множество полезных уроков для тех, кто хочет освоить Фигму или перейти на нее с других редакторов. В подборке есть как уроки по освоению интерфейса самой программы, так и по созданию дизайна цифрового продукта.
- Интерфейс
- Манипуляция с объектами
- Frame & Slice tool
- Векторные объекты
- Работа с кривыми и пером
- Слои и маски
- Текст
- Цвет
- Сетки и направляющие
- Стили
- Constraints
- Компоненты
- Выравнивание и умное выделение
- Прототипирование
- Интеграция и экспорт
- Обзор интерфейса: аккаунт, история версий, мультипросмотр макета
- Обзор меню и предпочтений
- Инструменты и калькулятор
- Панель слоев и массовое
- Модульная сетка в Фигме
- Привязки (constraints) в Figma
- Компоненты в Фигме #1 — Простые примеры. Когда использовать?
- Компоненты в Фигме #2 — Сложные примеры. Ломаем, костылим ?
- Компоненты в Фигме #3 — Рокировка
- Компоненты в Фигме #4 — Иконки и адаптив
- Компоненты в Фигме #5 — Адаптив через дубликат макета
- Выравнивания (align) в Figma, Tidy Up, упаковка и дистрибьты
- Текст в Figma
- Цвет, градиенты, изображения в Figma
- Обводка и эффекты: тени, блюры, бордеры в Figma
- Командная библиотека компонентов в Figma
- Прототипы в Figma и умные анимации (smart animate)
- Панель кода и экспорт
- Ссылка на проект в Фигме (share Figma)
- Как установить, включить плагины в Figma | ? Plugins
- Auto Layout в Figma ? (стеки в Фигме).
Курс «Основы Figma» — Нетология
https://netology.ru/programs/osnovy-figma
Стоимость: бесплатно
Во время обучения вы выполните 10 заданий и получите необходимую базу для работы в Figma. Макеты сайта, рекламные изображения для соцсетей — всё это может стать частью вашего портфолио.
Научитесь работать с ключевыми инструментами Figma:
- Шейпами
- Сетками и направляющими
- Текстом
- Масками
- Компонентами
- Стилями
- Инструментами прототипирования
- Эффектами
- Интеграцией растровых изображений
- Цветом и градиентами.
Программа курса:
5,5 часов теории, 8 часов практики
- Введение в Figma
Разберём интерфейс графического редактора и необходимые настройки перед началом работы - Рекламный баннер
Изучим шейпы, научимся строить сетку и работать с текстом и пространством на примере баннера - Работа с интерфейсом
Поговорим об основах UI/UX-дизайна, узнаем, как и с чем работает дизайнер интерфейсов - Лендинг
Узнаете, какие задачи решает дизайнер при разработке сайта, и создадите макет лендинга - Адаптивный дизайн
Разберётесь, как подготовить макет к жизни, и узнаете про состояния элементов и работу с адаптивностью.