Что изучаем

Курс соединяет три навыка в один процесс: проектирование в Figma, сборку с помощью нейросетей и тестирование. Слушатели осваивают Figma на уровне компонентов, автолейаута и дизайн-системы, учатся ставить задачу сервисам вайбкодинга и собирать по макету работающий прототип, а затем проверяют его на пользователях.Работа идёт над одним сквозным проектом — от макета до опубликованного прототипа, проверенного на людях.В основе — знания, которые не устареют вместе с инструментами: интерфейсные паттерны, компонентный подход, юзабилити-тестирование. Видео с этими основами отмечены звёздочкой ★.

Контекст

От дизайнера всё чаще ждут не только макетов, но и работающих прототипов, которые можно показать пользователям и команде. — Спрос на умение работать с ИИ-инструментами разработки за два года вырос в семь раз (McKinsey). — В России 41% дизайнеров уже участвуют в разработке.Появились сервисы, которые собирают интерфейс по текстовому описанию, — это называют вайбкодингом. Но инструмент не заменяет основу: без понимания паттернов и проверки на людях результат получается быстрым, но слабым.

Для кого

— Начинающие дизайнеры, 20–27 лет, у которых работа заканчивается на макете. — Дизайнеры с опытом, 25–35 лет, которые хотят собирать прототипы без разработчика. — Продакт-менеджеры и маркетологи, 25–40 лет, которые хотят проверять идеи на работающем прототипе.

Пререквизиты

— Знать: базовые элементы интерфейса на уровне пользователя: экран, кнопка, форма, меню. — Уметь: уверенно пользоваться компьютером и веб-сервисами. Опыт в программировании не нужен. — Иметь: ноутбук, аккаунт в Figma и в 1–2 сервисах вайбкодинга (Lovable, Bolt, v0 или Figma Make). На старте хватит бесплатных тарифов, для финальной сборки может понадобиться платный тариф одного сервиса.

Продолжительность и формат

1 модуль, 8 недель, полностью онлайн. — Каждая тема — 2–4 видео по 10–30 минут, презентация, домашнее задание и консультация. — Прототипы публикуются на общем учебном хостинге. — Всего около 104 академических часов, из них около 64 — самостоятельная работа. — Материалы: стартовая дизайн-система в Figma, шаблоны запросов для нейросетей, протокол юзабилити-теста, чек-лист публикации прототипа.Маршрут Figma → темы 1–4: паттерны, компоненты, дизайн-система, макет проекта. Вайбкодинг → темы 5–6: постановка задачи и сборка прототипа. Тест → темы 7–8: юзабилити-тест, доработка, защита.

Тематический план

Figma 1. ★ Паттерны интерфейса. Навигация, формы, состояния экранов. Разбор продуктов. 2. ★ Figma. Фреймы, автолейаут, компоненты и варианты. 3. Дизайн-система. Стили, переменные, библиотека компонентов. 4. Макет проекта. Сценарии и ключевые экраны.Вайбкодинг 5. Сервисы вайбкодинга. Обзор, сравнение, постановка задачи по макету. 6. Сборка прототипа. От макета к работающему интерфейсу, проверка и исправление ошибок.Тест 7. ★ Юзабилити-тест. Сценарий теста, проведение, анализ результатов. 8. Доработка и публикация. Правки по тесту, публикация прототипа, защита проекта.

После курса слушатели смогут

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

Задания (элементы контроля)

Каждое задание проверяет один результат. 1. Три разбора интерфейсов: паттерны навигации и форм, 4 состояния экрана, 3 проблемы. 2. Библиотека компонентов: 10+ компонентов с вариантами, стили цвета и текста. 3. Макет ключевых экранов: 5+ экранов на компонентах, сценарий «от входа до цели». 4. Прототип по ссылке: собран нейросетью, совпадает с макетом, журнал из 5+ исправленных ошибок. 5. Отчёт о тесте: 5 пользователей, проблемы по критичности, список правок. 6. Защита проекта: доработанный прототип, «до/после» по итогам теста.

Итоговый проект

Проект для портфолио: макеты в Figma, работающий прототип, отчёт о тестировании и доработанная версия. Защита проходит онлайн, 15 минут.Критерии оценки: макет построен на компонентах; прототип работает и соответствует макету; тест проведён по протоколу; доработки следуют из результатов теста; слушатель отделяет свои решения от работы инструмента.Оценка по формуле Школы дизайна: задания × 0,4 + итоговый проект × 0,6 + дополнительные баллы.

Пример проекта

Будет добавлен по итогам пилотного потока.