FiGMA

Раскройте свой потенциал в дизайне сайтов и приложений

Чему мы научимся

Модуль 1: Введение в профессию веб-дизайнер 💪
• Что такое веб-дизайн и чем он отличается от графического и комуникационного в 2025 году
• Роли веб-дизайнера: UX, UI, адаптивность, продукт
• Современные тренды и хорошие примеры сайтов
• Обзор инструментов: Figma, Photoshop, Tilda [1-3 урока]
• База знаний хорошего дизайнера разбор: пространства, акцентов, форм, типографики, цвета, композиции. [1-3 урока]
Практика: Регистрация в Figma, создание первого мини проекта

Модуль 2: Основы UX-дизайна ☝️
• Поведение пользователя на сайте
• Цели сайта: информационный, лендинг, интернет-магазин и др.
• Карта пути пользователя (User Journey Map)
• Создание wireframes (прототип сайта)
Практика: Создание простого прототипа (черно-белого макета)

Модуль 3: Основы UI-дизайна 🌿
• Цвет, шрифт, контраст, иерархия
• Гриды, отступы, визуальный баланс
• Кнопки, формы, иконки, интерфейсные элементы
• Создание компонентов для интерактивного макета
Практика: Разработка UI-кита (создание интерфейсных компонентов)

Модуль 4: Работа с Figma 🏄‍♂️
• Интерфейс, фреймы, компоненты, автолэйаут
• Прототипирование, взаимодействие, интерактив
• Работа в команде
Практика: Создание лендинга в Figma

Модуль 5: Адаптивный дизайн 🗿
• Разрешения экранов, брейкпоинты
• Мобильный first vs Desktop first
• Адаптация макетов в Figma
Практика: Дизайн под мобильную и десктоп-версию одного сайта

Модуль 6: Типографика и визуальный стиль 😊
• Работа с шрифтами, выбор гарнитур
• Создание текстовой и визуальной иерархии
• Стилизация: минимализм, неоморфизм, brutalism
Практика: Подбор шрифтов и цветовой палитры для проекта

Модуль 7: Дизайн в действии — проектирование лендинга 😵
• Структура лендинга: Hero, CTA, УТП, отзывы, портфолио
• Поведение пользователя на лендинге
• Точки вовлечения
Практика: Создание лендинга для вымышленного продукта

Модуль 8: Основы HTML/CSS (для дизайнеров) 😑
• Как устроен сайт изнутри: структура HTML и стили CSS
• Как дизайнер может понимать верстку
• Передача макетов разработчику
Практика: Пример верстки простого блока по макету

Модуль 9: Работа с анимацией и интерактивом 🤾‍♂️
• Типы анимаций: микровзаимодействия, плавные переходы
• Принципы хорошей анимации
• Примеры в Figma, Тильда
Практика: Создание прототипа с анимацией в Figma

Модуль 10: Основы портфолио и личного бренда 🍿
• Что должно быть в портфолио веб-дизайнера
• Как оформить кейс
• Где искать заказы: фриланс, студии, агентства
Практика: Оформление первого кейса и портфолио на Behance / Tilda

Модуль 11: Финальный проект 🏅
• Самостоятельная работа над сайтом на выбор (лендинг / информ сайт / интернет магазин)
• Презентация работы
• Разбор и фидбек от меня
Итог: Полноценный макет сайта в портфолио

Модуль 12: Работа с нейросетями для дизайнера 🥃
• Подборка AI-инструментов для дизайнеров — chat gpt, gemini, runway, krea, recraft
• Создание фото / видео контента
• Работа с изображениями, дорисовки, кадрирования, удаление фона(обтравка)
• Чек-лист «Когда использовать ИИ, а когда — нет»
Итог: Ускоряем работу в 5 раз с помощью нейросетей

Предварительная программа обучения

Профессия Настоящего

Создание и разработка дизайна приложений – это актуальная и востребованная профессия