Модуль 1. UX 

Занятие 1. Введение в UX
  > Знакомство
  > Краткое содержание курса
  > Формат занятий, тема проекта потока
  > Знакомство с преподавателями курса
  > Знакомство со студентами
  > Введение в UX
  > Рассказ о профессии UX дизайнера, культура профессии
  > Что такое UX
  > Структура UX работ
  > Место UXD в IT-отрасли
  > Понятия юзабилити, эффективность, продуктивность, удовлетворенность
  > Виды интерфейсов
  > “Магия” в интерфейсах (удачные примеры облегчения взаимодействия)
  > Домашнее задание

Занятие 2. Старт проекта, с чего начинается UX

  > С чего начинается UX
  > Подготовка к беседе с представителем заказчика
  > Беседа как метод сбора данных, отличие от других методов
  > Изучение целей и задач бизнеса
  > Презентация домашних заданий
  > Домашнее задание

Занятие 3. Планирование проекта. UX исследования

  > Планирование процесса проектирования
  > Понятие UCD
  > Изучение предметной области
  > Анализ аналогов
  > Насмотренность
  > Презентация домашних заданий
  > Домашнее задание

Занятие 4. UX исследования

  > Работа с экспертами
  > Исследование пользователей
  > Проблемное и глубинное исследование
  > Эмпатия
  > Рекрутинг респондентов
  > Презентация домашних заданий
  > Практика: планирование интервью
  > Домашнее задание

Занятие 5. UX исследования

  > Методы сбора информации: интервью, опрос, контент-анализ и другие
  > Выбор метода сбора информации
  > Систематизация и интерпретация полученных в исследованиях данных
  > Понятие “Кейс”
  > Элементы интерфейсов
  > Design tools: Figma
  > Презентация домашних заданий
  > Домашнее задание

Занятие 6. Аналитика пользователей

  > Метод персонажей
  > Метод профилей пользователей
  > Карты эмпатии
  > Понятие Flow
  > Презентация домашних заданий
  > Домашнее задание

Занятие 7. Сценарии

  > Создание сценариев пользователя
  > User Stories
  > User и Customer Journey Map
  > Ожидания пользователей
  > Дизайн как решение поставленной задачи.
  > Концептуальные сценарии
  > Концептуальное проектирование решений
  > Использование метафор привычной жизни
  > “Метод волшебной палочки”
  > Информационная архитектура
  > Презентация домашних заданий
  > Домашнее задание

Занятие 8. Базис проектирования процессов взаимодействия

  > Понятие интерфейс
  > Отличие UX от UI
  > Состав блоков, расположение, соотношение
  > Техника “сушки” интерфейса
  > Проектирование на основе паттернов
  > Participatory design
  > Инструменты для прототипирования
  > Use Cases
  > Написание сценариев взаимодействия (методика)
  > Презентация домашних заданий
  > Домашнее задание

Занятие 9. Тонкости проектирования взаимодействия

  > Детальное проектирование
  > Золотые правила UXD
  > Способы управления вниманием пользователей
  > Содержание блоков
  > Метод карточной сортировки
  > Переходы
  > Акцентирование
  > Элементы CTA
  > Цветовое кодирование
  > Ясность, приветливость и обаяние интерфейса
  > Эвристики Нильсона и Молича
  > Презентация домашних заданий
  > Домашнее задание

Занятие 10. Написание спецификации на интерфейс. Как измерить UX, тестирование интерфейсов

  > Написание спецификации на интерфейс
  > Как измерить UX
  > Разработка сценариев тестирования
  > UX опросники
  > Другие методологии тестирования интерфейсов
  > Презентация домашних заданий
  > Практика: детальное проектирование
  > Домашнее задание

Занятие 11. Презентация проектов

  > Презентация проектов
  > Подведение итогов модуля
  > Ответы на вопросы
  > Куда развиваться дальше, если развиваться в UX. Реалии рынка
  > Типы UX специалистов
  > Варианты трудоустройства
  > Важные детали сотрудничества на фрилансе
  > Полезная литература

Модуль 2. UI

Занятие 1. Основы визуального дизайна

  > Краткое знакомство с проектами участников, результатами 1-го модуля
  > Базовые элементы дизайна
  > Цвет
  > Дизайн-концепция
  > Домашнее задание: изучить список полезных ресурсов/лекций/книг для вдохновения. Подготовить мудборд, дизайн-концепцию и цветовую схему для своего проекта

Занятие 2. Типографика

  > Шрифтовые традиции
  > Текст как базовый элемент вёрстки
  > Виды шрифтов
  > Интерлиньяж, кегль, поля, отступы и модульность
  > Технические возможности программ. Какой инструмент выбрать?
  > Знакомство с Figma, Sketch, Adobe XD
  > Подбор шрифтовых пар
  > Вёрстка своего проекта
  > Домашнее задание: продолжаем работу над проектом

Занятие 3. Основы работы с макетом

  > Закон Фиттса, теория близости, визуальная структура
  > Примитивы вёрстки
  > Принцип модульности
  > Якорные объекты
  > Чередование ритма
  > Собираем свою страницу
  > Как работать с сеткой в 12 колонок
  > Домашнее задание: продолжить собирать страницу

Занятие 4. Поведение интерфейса

  > Основные элементы контента
  > Как показать состояние интерфейса
  > Как оформить ссылки
  > Как сделать хорошую кнопку
  > Домашнее задание: нарисовать нужные элементы контента в разных состояниях

Занятие 5. Векторная графика в UI

  > Растровая и векторная графика
  > Иконки и пиктограммы
  > Размеры в вебе
  > Сетки и гайдлайны
  > Экспорт иконок. SVG формат
  > Домашнее задание: сет из 7 иконок

Занятие 6. Навигация и структура

  > Виды навигации
  > Информационная архитектура сайта
  > Интерфейс интернет-магазина
  > Удобная регистрация
  > Домашнее задание: навигация по своему проекту

Занятие 7. Адаптация под Mobile

  > Концепция Mobile first
  > Резиновый дизайн, респонсив и адаптив
  > Популярные сетки для адаптива
  > Разработка сета из нескольких разрешений

Занятие 8. Передача проекта в вёрстку

  > Учитываем: состояния кнопок и форм, слайдеры, всплывающие окна
  > Передача графики и иконок
  > Как взаимодействовать с разработчиком? Zeplin
  > Домашнее задание: подготовить архив для передачи разработчику

Занятие 9. Собрать страницу без вёрстки и программирования

  > Что такое визивиг-редакторы
  > Обзор инструментов: Tilda, Webflow, Readymag и другие
  > Примеры сайтов на Tilda
  > Оживляем свой проект с помощью Tilda
  > Домашнее задание: подготовить проект и презентацию заказчику

Занятия 10-11. Работа над проектами

Занятия 12. Презентации проектов заказчику

  > Презентация и разбор макетов
  > Подготовка портфолио 
  > Как попасть на работу в компанию мечты?

Модуль 3. Основы фронт-енд разработки для дизайнеров

Занятие 1. Введение (Git, VS Code, HTML)

  > Краткое знакомство с проектами участников, результатами модуля 1-2.
  > Основы работы с системой контроля версий на примере git (установка, основные команды) + Github Desktop 
  > Знакомство с VS Code
  > Знакомство с HTML 
  > Структура страницы
  > Основные теги

Занятие 2. CSS

  > Знакомство с CSS 
  > Подключение, Селекторы, Свойства
  > БЭМ
  > Позиционирование элементов

Занятие 3. Адаптив, препроцессоры, Flexbox, CSS Grid

  > Виды вёрстки (фиксированная, адаптивная, резиновая) 
  > Flexbox
  > CSS Grid
  > Знакомимся с препроцессорами (SASS)

Занятие 4. Элементы управления

  > Знакомимся с основными элементами управления
  > Разбираем принципы работы самых популярных элементов на примере элементов Bootstrap

Занятие 5. Практическое занятие

  > Выбираем макет для вёрстки (либо свой, либо берём на просторах интернета)
  > Рассматриваем варианты экспорта (в Zeplin и в Figma)
  > Разбираем все практические вопросы
  > Pixel Perfect
  > Разбираем возникающие вопросы

Занятие 6. Основы JavaScript

  > Очень коротко о Node.js
  > Переменные и типы данных
  > Функции
  > Работа с DOM
  > События

Занятие 7. Практическое занятие

  > Применяем знания, полученные на предыдущем занятии и делаем свою реализацию нескольких элементов управления
  > Разбираем возникающие вопросы

Занятие 8. Финальная презентация курсовых проектов

  > Презентации проектов 
  > Разбираем возникающие вопросы
  > Подготовка к собеседованию