Мы используем cookie для стабильной работы сервиса. Подробнее

Веб дизайн в Figma Продвинутый уровень | Создание UI KIT в FIGMA

ФорматОнлайн
Длительность5-6
Объём5 занятий
По окончанииStepik
О курсе

Подробнее

Привет 👋 И сразу к делу. Это не просто курс по дизайну, это курс по созданию современного дизайн-продукта. Далеко не каждый практикующий дизайнер может похвастаться умением создавать такие сложные системы, как UI KIT и профессиональной работой с компонентами. Проходя уроки курса мы постепенно, шаг за шагом будем создавать свой продукт. От созданий базовых стилей текста и цвета, подбора правильного контраста и до готового UI KIT в котором все элементы расширяемы и связаны между собой. ✅ 80% моих студентов еще во время обучения окупают этот курс.  На курсе мы учимся создавать UI KIT, который можно сразу продавать на маркетплейсах. Создай несколько крутых UI KIT вместе со мной и получи пассивный заработок. ✅ Мы на практике получаем знания и с сразу же их применяем. В курсе есть максимально эффективные домашние задания. Студент не просто смотрит на то, что делает преподаватель, а включается в процесс, ведь некоторые элементы нужно создавать самостоятельно. Автор дает четкие инструкции по домашним заданиям, которые нужно выполнять. Студент их выполняет и после этого получает решение по дз от автора. Это самый эффективный способ обучения в онлайн формате на сегодняшний день. Студент постоянно находится в тонусе и практикуется. Важнее практики в нашем деле нет ничего. Весь процесс обучения происходит в Figma. Нас ничего не будет отвлекать. Мы будем пользоваться полезными плагинами и сочетаниями горячих клавиш. Узнаем крутой метод быстрого переименования слоев и объектов при помощи регулярных выражений. Это в 100 раз ускоряет рутинную работу. Не говоря уж о супер полезных для повседневной работы плагинах. После курса студент будет работать в программе как настоящий гуру фигмы По ходу курса мы в совершенстве изучим такие сложные темы как: компоненты, варианты, auto layout, стили и научимся грамотно применять свои знания.   🔥 Курс по FIGMA в подарок Если даже ты не знаешь программу или хочешь освежить знания, то в подарок ты получишь курс по FIGMA совершенно бесплатно.  Отдельно хочу отметить, что по итогу у студента будет не просто очередной дизайн-кейс по выдуманному заданию, а настоящий продукт, который может приносить создателю прибыть и которым могут пользоваться другие дизайнеры. Это реальная работа, которую можно "потрогать", а главное продать. 🥷 Пару слов обо мне Занимаюсь дизайном с 2017 года и в совершенстве владею FIGMA. Я самый популярный русскоязычный преподаватель по дизайну на Udemy. Обучил более 8000 учеников, а более 98% из них поставили курсу высшую оценку. 
Требования

Что нужно для старта

  • Никаких предварительных знаний не требуется, даже если ты открыл FIGMA в первый раз , на курсе представлен блок по изучению основных функция FIGMA с нуля.
Результат

Что вы получите

  • Научитесь создавать UI KIT
  • Узнаете, как устроен UI KIT изнутри
  • Продумывание архитектуры проекта
  • Углубленная работа со сложными компонентами
  • Правильный нейминг элементов
  • Грамотная работа со стилями
  • Работа с вариантами
  • Работа с плагинами
  • Работа с hot key
  • Научитесь профессионально работать в Figma
  • Научитесь мыслить, как профессионал
  • Научитесь работать со сложными системами
Аудитория

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

  • Для начинающих и опытных веб-дизайнеров, для тех кто хочет освоить новый способ заработка не выходя из FIGMA.
Содержание

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

5 занятий
№ТемаЧто внутри
01О чем этот курс

- Вступление
- Как проходить курс. Организационный урок

02Создаем стили для UI Kit

- О чем этот модуль
- Стили для текстов
- Почему именно такие значения для стилей текста?
- Стиль нейтрального цвета
- Логика подбора стилей для главного цвета (Main Color)
- Создаем стили главного цвета
- Доработка цвета. Работа с цветовой моделью HSV
- Практика 01 Работа с плагинами для студента
- Проверяем контраст Главного цвета
- Функциональные цвета
- Ускоряем работу с помощью регулярных выражений
- Создание Layout
- Стили Эффектов
- Добавление пака иконок в UiKit
- Практика 02. Грамотная работа с иконками для UI KIT

03Создаем основные элементы Ui Kit

- О чем этот модуль
- Создание тегов(чипсы,бейджи)
- Создаем Аккордеоны
- Подробнее по Аккордеонам
- Создание основного стека кнопок
- Создание дополнительных состояний и стилей кнопок
- Создаем CheckBox
- Практика 03. Создание Радио кнопок
- Создаем модальные окна
- Создание окон уведомления (Notification)
- Практика 04. Создание переключателей (Switch)
- Практика 05. Создание поля ввода текста Textarea
- Разбираем домашнее задание по полям ввода текста. О Слоях
- Добавление функционала к полям ввода
- Создание Dropdown Menu
- Дополнение блока Dropdown
- Блок Select
- Дополняем блок Select
- Практика 06. Создание блока "Рейтинг"
- Создаем Табы
- Создаем блок Вертикальное Меню
- Создание блока Горизонтальное меню
- Практика 07. Создание второстепенных menu item
- Решение задачи по созданию второстепенных пунктов меню
- Создание инпутов
- Создание ячеек для таблиц. Часть 1
- Создание ячеек для таблиц. Часть 2

04Выкладываем наш Ui Kit В Community Figma

- Практика 08. Документация
- Превью для Ui Kit
- Регистрация в community в качестве автора
- Публикация своего продукта

05Курс по Figma 2022

- Установка Figma
- Простейшие фигуры(Квадрат)
- Работа с цветом
- Работа с изображениями
- Эффекты
- Группа
- Фрейм
- Комьюнити
- Плагины
- Работа с текстом
- Обновление стилей 2023
- Стили
- Настройка constraints
- Обновление Auto Layout 2022
- Auto Layout
- Практика 08. Auto Layout Часть 2
- Компоненты. Часть 1
- Компоненты. Часть 2
- Компоненты. Часть 3
- Компоненты. Часть 4
- Варианты

01О чем этот курс

- Вступление
- Как проходить курс. Организационный урок

02Создаем стили для UI Kit

- О чем этот модуль
- Стили для текстов
- Почему именно такие значения для стилей текста?
- Стиль нейтрального цвета
- Логика подбора стилей для главного цвета (Main Color)
- Создаем стили главного цвета
- Доработка цвета. Работа с цветовой моделью HSV
- Практика 01 Работа с плагинами для студента
- Проверяем контраст Главного цвета
- Функциональные цвета
- Ускоряем работу с помощью регулярных выражений
- Создание Layout
- Стили Эффектов
- Добавление пака иконок в UiKit
- Практика 02. Грамотная работа с иконками для UI KIT

03Создаем основные элементы Ui Kit

- О чем этот модуль
- Создание тегов(чипсы,бейджи)
- Создаем Аккордеоны
- Подробнее по Аккордеонам
- Создание основного стека кнопок
- Создание дополнительных состояний и стилей кнопок
- Создаем CheckBox
- Практика 03. Создание Радио кнопок
- Создаем модальные окна
- Создание окон уведомления (Notification)
- Практика 04. Создание переключателей (Switch)
- Практика 05. Создание поля ввода текста Textarea
- Разбираем домашнее задание по полям ввода текста. О Слоях
- Добавление функционала к полям ввода
- Создание Dropdown Menu
- Дополнение блока Dropdown
- Блок Select
- Дополняем блок Select
- Практика 06. Создание блока "Рейтинг"
- Создаем Табы
- Создаем блок Вертикальное Меню
- Создание блока Горизонтальное меню
- Практика 07. Создание второстепенных menu item
- Решение задачи по созданию второстепенных пунктов меню
- Создание инпутов
- Создание ячеек для таблиц. Часть 1
- Создание ячеек для таблиц. Часть 2

04Выкладываем наш Ui Kit В Community Figma

- Практика 08. Документация
- Превью для Ui Kit
- Регистрация в community в качестве автора
- Публикация своего продукта

05Курс по Figma 2022

- Установка Figma
- Простейшие фигуры(Квадрат)
- Работа с цветом
- Работа с изображениями
- Эффекты
- Группа
- Фрейм
- Комьюнити
- Плагины
- Работа с текстом
- Обновление стилей 2023
- Стили
- Настройка constraints
- Обновление Auto Layout 2022
- Auto Layout
- Практика 08. Auto Layout Часть 2
- Компоненты. Часть 1
- Компоненты. Часть 2
- Компоненты. Часть 3
- Компоненты. Часть 4
- Варианты

Документ после выпуска

Stepik

Организатор

Автор курса

StepikStepik
Stepik — образовательная платформа и конструктор онлайн-курсов. Мы разрабатываем алгоритмы адаптивного обучения, сотрудничаем с авторами MOOC, помогаем в проведении олимпиад и программ переподготовки. Наша цель — сделать образование открытым и удобным. Stepik — широко известная российская образовательная платформа, основанная в 2013 году. На Stepik зарегистрировано более миллиона пользователей из России и стран СНГ. В настоящее время на Stepik представлены несколько тысяч учебных курсов на самые разные темы.
Подробнее об авторе
Мнения учеников

Отзывы о курсе

Оставьте отзыв

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

Напишите ваш коментарий, не менее 30 символов

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

Оставьте заявку

Консультант ответит на вопросы о курсе «Веб дизайн в Figma Продвинутый уровень | Создание UI KIT в FIGMA» и поможет разобраться в деталях обучения.

Комментарий ...

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

Направления:UX-дизайнFigma

Информация обновлена 17 августа 2026 г.

Продолжить выбор

Похожие курсы

Онлайн-курс Figma с нуля
Онлайн-курс Figma с нуля

Практический онлайн-интенсив поможет визуализировать любые идеи в Figma. Научитесь создавать самые разные дизайн-проекты — макет сайта, креативы для соцсетей, элементы для айденти…

Онлайн
15 900 ₽
Веб-дизайн с нуля до профессионала Figma. Программа из 2 курсов
4-5 часов в неделю
Веб-дизайн с нуля до профессионала Figma. Программа из 2 курсов

Тарифы: Эта программа — для тех, кто хочет освоить востребованную профессию веб-дизайнера с нуля или прокачать свои навыки до профессионального уровня. Обучение охватывает все клю…

Онлайн1 занятий
3 990 ₽
Веб-дизайн в Figma
−31%2 месяца
Веб-дизайн в Figma

Компании ищут дизайнеров, которые уверенно работают в Figma и создают понятные, адаптивные интерфейсы. Курс помогает развить именно такие практические навыки, которые востребованы…

Онлайн
48 400 ₽−31%
33 400 ₽от 2 784 ₽/мес на 36 мес.
Начать без затрат

Бесплатные курсы

Figma 2024 год
Бесплатно45 академических часов
Figma 2024 год

Автор записал новый курс по Figma. Базовые функции. Идеальный вариант почувствовать себя дизайнером. Курс даст базовые понимания работы с Figma.Преподаватель - Никита Лудин * Курс…

Онлайн1 занятий
Видеоуроки
Бесплатно
Бесплатный курс по Figma с нуля. UI/UX дизайн для новичков
Бесплатно1-2 часа в день
Бесплатный курс по Figma с нуля. UI/UX дизайн для новичков

Курс создан в самой последней версии Figma На этом курсе вы научитесь работать с базовыми инструментами для создания качественного дизайна сайтов и интерфейсов. Курс представлен в…

Онлайн4 занятий
Бесплатно
Дизайн мобильного приложения в Figma
Бесплатно15 академических часов
Дизайн мобильного приложения в Figma

Создаем дизайн мобильного приложения в FigmaПреподаватель: Рома Райт* Курс является бесплатным и в нем не предусмотрены ответы преподавателя на Ваши вопросы.Интересующие Вас вопро…

Онлайн1 занятий
Видеоуроки
Бесплатно
Figma для технической ниши. Дизайн сайта
Бесплатно15 академических часов
Figma для технической ниши. Дизайн сайта

Сейчас большинство специалистов, создающих виртуальный контент выбирают именно Figma, и вот почему.Основное преимущество сервиса — это широта его возможностей:Прототипирование инт…

Онлайн1 занятий
Видеоуроки
Бесплатно
Основы компьютерного дизайна
Бесплатно
Основы компьютерного дизайна

В курсе рассматриваются свойства зрительного восприятия человека, основы работы с цветом и цветовые модели, виды контраста, психология восприятия цветов и шрифтов, основы построен…

Онлайн15 занятий
Бесплатно