Продуктовый дизайнер

Каково быть продуктовым дизайнером (8 тем・8 часов)

• Это бесплатная вводная часть: попробуете себя в роли продуктового дизайнера и поймёте, хотите ли развиваться в этом направлении
• UX/UI-дизайн Figma CJM Продуктовое мышление Карьера
• О профессии: Кто такой продуктовый дизайнер, карьера на стыке IT, дизайна и бизнеса
• Дизайн и продукт: Продуктовые и проектные компании, продуктовое мышление, продуктовая команда
• Дизайн и исследования: Сигналы и продуктовые гипотезы, цели и виды исследований, как применить их результаты, взаимодействие с UX-исследователями
• Дизайн и… дизайн: Промышленный и цифровой дизайн, знакомство с Figma, UI-кит, компонентный подход, взаимодействие с дизайнерами интерфейсов
• Дизайн и разработка: Что такое код, взаимодействие с разработчиками
• Дизайн и маркетинг: Коммуникационный дизайн, карта пользовательских путешествий, взаимодействие с маркетологами
• Дизайн и аналитика: Влияние дизайна на бизнес, как измерять результаты изменений в дизайне, веб-аналитика, взаимодействие с аналитиками
• Как учиться: Для кого этот курс, как он устроен, примеры работ выпускников, помощь с поиском работы
• Увидите, что делает продуктовый дизайнер на каждом этапе работы над продуктом. Поймёте, что нужно знать и уметь, чтобы вести продукт к успеху

1. Введение в прототипирование (1 проект・2 недели)

• Сделаете первые шаги в Figma, познакомитесь с метриками и узнаете, как дизайн связан с эффективностью цифровых продуктов.
• Figma Пиратские метрики Визуальный вес Доминанта Сетки Expoze Лендинг
• Анатомия лендинга и метрики: Что такое лендинг, виды лендингов, из чего складывается лендинг: первый экран, информация о продукте, форма, хедер и футер
• Базовые инструменты Figma: Введение в Figma, работа с макетом
• Композиция 1.0: Композиция в дизайне, как она влияет на метрики, на что опираться, продумывая композицию
• Сетки 1.0: Знакомство и работа с сетками
• Тепловые карты: Что такое тепловые карты, их виды
• С помощью тепловых карт проанализируете проблему с конверсией на лендинге и сделаете его редизайн

1. Компонентный подход в Figma (1 проект・2 недели)

• Узнаете, как связать ключевые бизнес-метрики с метриками дизайн-задачи. Изучите текстовые и цветовые приёмы в интерфейсном дизайне, закрепите навыки в Figma.
• Notion Story Mapping Компоненты UI-кит Экранная инфографика Интерфейсные стили Цветовые сочетания Дизайн дашбордов
• Бэклог: Что такое бэклог, связь метрик и задач
• Figma 1.0: Стили в Figma, введение в Auto Layout
• Компоненты 1.0: Компонентный подход, UI-кит
• Вёрстка текста: Система типографики и отступов, шрифт, стили заголовков, текстовые и интерфейсные стили, библиотека стилей в Figma, вёрстка
• Цвет: Знакомство с понятием цвета, работа с палитрами, подбор цветовых сочетаний
• Проанализируете метрики продукта, найдёте ошибку в дашборде и сделаете его редизайн

1. Анимация прототипов в Figma (1 проект・2 недели)

• Знакомство с кодом: научитесь готовить документацию для передачи макета в разработку. А ещё освоите способы анимации в Figma.
• Коммуникация со стейкхолдерами Анимация Прототипирование HTML и CSS
• Кликабельный прототип: Введение в кликабельные прототипы, анимация прототипа
• Передача макета в разработку: Знакомство с документацией, подготовка макета для разработчика
• Введение в HTML и CSS: Фронтенд и бэкенд, связь HTML и CSS, инструменты разработчика, анимация в коде
• Создадите анимированный прототип приложения и передадите макет разработчикам

1. Пользовательские портреты и сценарии (1 проект・2 недели)

• Научитесь проводить исследования, чтобы лучше понимать поведение пользователей и влиять на их действия в интерфейсе.
• User Story Фреймворк «Персона» Интервью
• Бизнес-требования и пользовательские истории: Постановка задачи, портрет пользователя, пользовательские истории
• Качественные исследования: интервью: Подготовка, проведение и анализ результатов
• Пользовательские сценарии: Знакомство с пользовательскими сценариями, их анализ и дополнение
• Проведёте интервью с пользователями интернет-магазина и создадите новый сценарий их действий

1. Разработка лендинга под репозиционирование бизнеса (1 проект・2 недели)

• Коммуникационная сфера работы дизайнера: узнаете, как с помощью визуальных приёмов транслировать аудитории нужные смыслы и влиять на эффективность цифровых продуктов.
• Целевая аудитория Референсы Мудборд Консистентность Ритмичность композиции Шрифты и лицензии
• Позиционирование продукта: Связь позиционирования и дизайна, работа над лендингом
• Лендинг и работа с изображениями: Поиск и подбор консистентных дизайну изображений, авторские права
• Продвинутая композиция: Основные правила композиции, статика, динамика, ритмичность, работа с пустым пространством
• Основы типографики: Что такое типографика, анатомия текста, как подобрать шрифт
• С нуля разработаете дизайн лендинга для нового позиционирования продукта

1. Маркетинг в продуктовом дизайне (1 проект・3 недели)

• Продолжите изучать визуальную коммуникацию и ещё больше углубитесь в связь между дизайном продукта и бизнесом.
• Lean Canvas Брендбук Аргументация дизайн-решений Мобильные приложения
• Мобильные приложения: Насмотренность в мобильных интерфейсах, мобильные гайдлайны
• Бизнес и визуальный дизайн: Бизнес-модели, работа с брендбуком
• Как работать с адаптивностью: Адаптивный дизайн, адаптивный макет в Figma, сетки 2.0
• Как презентовать свою работу: Аргументация решений, презентация кейсов, видеопитч
• Разработаете интерфейс мобильного приложения и дизайн лендинга в 2 версиях: для десктопа и для смартфона, презентуете работу стейкхолдерам

1. Улучшение этапа CJM через Userflow (1 проект・2 недели)

• Научитесь строить гипотезы на основе аналитики и проверять их с помощью быстрых исследований. Углубитесь в Figma, чтобы повысить скорость и качество создания дизайн-макетов.
• Customer Journey Map Users Flow Miro Google Analytics Коридорные исследования Auto Layout Дизайн-система
• Анализ пути пользователя: Знакомство с CJM, аналитика и CJM
• Прототипирование и его детали: Знакомство с дизайн-системами, Auto Layout в компонентах и персональный вклад в дизайн-систему
• Кликабельный прототип 2.0: Эвристики и паттерны юзабилити, связь детальности прототипов и точности тестирования
• Коридорные исследования: Теория коридорных исследований, как их проводить
• Создадите прототип и протестируете его с помощью коридорного исследования, на основе полученных данных улучшите дизайн-макеты

1. Улучшение этапа CJM в коде (1 проект・3 недели)

• Выйдете за рамки Figma и немного потренируетесь с кодом.
• GitHub Pages Vercel Яндекс Метрики
• Вёрстка 2.0: Библиотека компонентов разработки, как быстро собрать интерфейс из веб-компонентов
• Релиз проекта: Интернет и системы версионирования, работа с GitHub, установка веб-аналитики
• Сверстаете страницу продукта в HTML и CSS, установите на неё Яндекс Метрику

1. Дизайн новой фичи существующего продукта (1 проект・2 недели)

• Узнаете, как анализировать юнит-экономику проекта. Поймёте связь гипотез и метрик. Научитесь собирать данные в новой предметной области.
• Юнит-экономика LTV CAC Функциональность variants
• Самостоятельное погружение в задачу: Юнит-экономика 1.0, продуктовые гипотезы и метрики, предметная область продукта
• Кликабельный прототип 3.0: Создание UI-кита, функциональность variants в Figma
• Проанализируете юнит-экономику, разработаете новую фичу для страницы оплаты, соберёте полноценный UI-кит

1. Сигнал и формулирование гипотез (1 проект・2 недели)

• Начнёте изучение полного цикла продуктовой разработки, начиная с формулирования гипотез
• Коммуникация в команде Фреймворк DACI Product-market fit Техники мозгового штурма
• Цикл продуктовой разработки: Коммуникация в команде, продуктовый цикл и продуктовый менеджмент
• Сбор информации: Сигналы для построения гипотез, поиск проблемной области по внешним сигналам, Product-market fit, иерархия целей в компании
• Формулирование продуктовых гипотез: Генерация и гигиена продуктовых гипотез
• Проанализируете задачу заказчика, сформулируете гипотезы по улучшению CJM в проблемной области

1. Скоринг и валидация (1 проект・2 недели)

• Сформируете бэклог и превратите гипотезы из предыдущего спринта в задачи.
• Модель ICE Методы MoSCoW Скоринг Груминг Демо Ревью Ретроспектива
• Формирование историй и их скоринг: Конструирование историй из гипотез, методы скоринга и приоритизации задач
• Наполнение и оценка задач: Отбор задач для груминга, оценка трудоёмкости задачи, финальная формулировка задачи
• Подготовите отчёт по исследованиям в продукте, выберете гипотезу для работы и презентуете её стейкхолдерам

1. Прототипирование (1 проект・2 недели)

• Перейдёте от гипотез к дизайну, узнаете, как собирать информацию внутри бизнеса. Разберёте 2 больших источника данных: бизнес-модели и финмодели.
• Бриф Вайрфреймы Material design HIG
• Анализ требований бизнеса: Сбор информации внутри бизнеса
• Пользовательские сценарии и вайрфреймы: Создание пользовательского сценария с нуля, что такое вайрфрейм и как его сделать
• Дизайн-системы: Структура полноценной дизайн-системы, Material design и HIG, применение принципов дизайн-систем при проектировании
• Продумаете новые пользовательские сценарии в продукте, отрисуете вайрфреймы новых экранов и создадите сложные кликабельные прототипы

1. Валидация и улучшение продукта (1 проект・2 недели)

• Погрузитесь в следующий этап цикла — тестирование. Узнаете, что такое юзабилити и почему это ключевой фактор качества дизайна интерфейса.
• Принципы Дитера Рамса Принципы HCD Юзабилити-тестирование Вебвизор
• Принципы юзабилити: Юзабилити и бизнес, юзабилити и доступность
• Юзабилити-тестирование: Подходы к юзабилити-тестированию и его проведение
• Проведёте юзабилити-тестирование прототипов и доработаете их по его результатам

1. Передача макетов в разработку (1 проект・2 недели)

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

1. Итоговый проект (Самостоятельно・4 недели)

• Этот проект станет главным в вашем портфолио и отразит весь цикл продуктовой разработки. На первом этапе вы рассмотрите существующие в экосистеме направления, продуктовое видение компании, общую маркетинговую стратегию, UI-кит и действующие дизайн-решения. Затем выберете продукт внутри экосистемы, исследуете его бизнес-модель, ключевые метрики, целевую аудиторию и части CJM. Проведёте качественные исследования аудитории и юзабилити-тестирование новой фичи. Разработаете продуктовые гипотезы, сверстаете анимированные прототипы, протестируете и улучшите их. Презентуете результаты своей работы, а также дорожную карту дальнейшего развития продукта в рамках экосистемы.

Карьерный центр (от 5 недель)

• Поиск работы: При поддержке наших HR-специалистов изучите стратегии поиска работы и узнаете о тонкостях выбора компании-работодателя, подготовите портфолио, напишете резюме и сопроводительные письма.

Дополнительно・по желанию

• Бонусные модули: Если захотите, сможете изучить ещё 3 темы: основы коммуникационного дизайна, личность бренда и look and feel. Эти знания помогут вашему профессиональному росту.

С наставниками

• Воркшопы для отработки ключевых навыков