Проектирование интерфейсов

Санкт-Петербург, весна 2017

Описание

Основная цель курса — дать студентам базовые знания проектирования интерфейсов для формирования понимания процесса создания интерфейсов и его места в разработке ПО. После освоения базовых знаний подробно изучить нюансы и основные аспекты разработки хороших интерфейсов и особенности интерфейсов для различных платформ. Глубокое погружение направлено на формирование навыков создания качественных интерфейсов с целью применения полученных знаний на практике.

Каждому студенту в течение семестра в качестве домашнего задания предлагается спроектировать интерфейс и сделать дизайн приложения для любой платформы. Цель семестрового проекта — попробовать на практике основные этапы дизайн процесса и применить полученные знания на лекциях. Проект может пересекаться с заданиями по другим дисциплинам разработки ПО или быть личным проектом студента с уже существующим интерфейсом, который нужно переработать. Также тема проекта может быть выбрана специально для курса, и интерфейс разработан с нуля.

Структура курса

HCI и Interaction design: User Interface и User Experience

  • Основные этапы работы над дизайн-проектом;
  • Подходы к проектированию. User-centered design, activity-centered design, data-driven design. Артефакты и способы проектирования;
  • Прототипирование интерфейсов. Виды и набор инструментов;
  • Психофизиология интерфейсов. Когнитивное сознательное и бессознательное. Ментальные модели;
  • Виды интерфейсов и гайдлайны для популярных платформ: Web (Material Design, Flat 2.0, IBM Design), Desktop, Mobile (iOS/Android), Tablets, VR, AR, Responsive и Adaptive интерфейсы. Паттерны поведения пользователей;
  • Альтернативные методы ввода информации. Accessibility. Shortcuts. Принципы платформ Windows, Mac OS, Web. Локализация и персонализация интерфейсов;
  • Интерактивность и анимация в интерфейсах. 12 принципов анимации по Диснею. Основы motion дизайна;
  • Принципы хороших интерфейсов. Закон Фиттса. Теория близости. Информационный стиль;

Исследования и оценка интерфейса

  • Качественные методы исследований. Best practices интервью, опросов, анкетирования и др. видов исследований. Анализ конкурентов/рынка;
  • Дизайн мышление и эмпатия. Эмоциональный дизайн по Норману. Виды и определение целей пользователя;
  • Современные подходы и лаборатории Usability тестирования. A/B тестирование;
  • Методы оценки интерфейсов. Эвристический анализ Нильсена;

Внедрение дизайна в разработку

  • Современные процессы и инструментарий. Atomic design. BEM. Разработка через UI Kit;
  • Спецификация интерфейсов. Версионность. Использование UML, ICONIX, BPMN нотаций;
  • Прототипирование кодом (Bootstrap, Polymer). Способы дизайна без дизайнера;

Дополнительно может быть включено в курс

  • Оформление и инструментарий презентации интерфейсов;
  • Основы digital графического дизайна: Модульные сетки. Правила композиции. Теория цвета. Типографика и шрифт. Flat иллюстрация.

Требования к зачету

Курс оценивается по системе зачет/незачет. Зачет выставляется за сделанный в течение семестра проект и его презентацию.

Проект состоит из 5 частей: исследование, пользователи и функциональность, прототип, дизайн-концепция и спецификация. На сдачу каждой части дается 2 недели. Если не сдать часть проекта до дедлайна следующей части, то можно не получить зачет за курс.

Презентация проекта проводится на последнем занятии и не влияет на выставление зачета. Цель презентации — придать работе над проектом завершенность и поделиться своими успехами с другими студентами курса.

Преподаватели

Список лекций

1. Введение
Обзор
  • Понятие интерфейса
  • Понятия HCI, Interaction design, UX/UI design
  • Проектирование интерфейсов в процессе разработки ПО
  • Основные этапы работы над дизайн-проектом
О курсе
  • Цель и план курса
  • Домашний дизайн-проект
2. Исследование, анализ
Виды исследований
  • Зачем и когда проводить исследование. Результат исследования
  • Цели исследования
  • Виды первичного исследования
  • Виды вторичного исследования
  • Анализ конкурентов. Сбор референсов. Мудборд
Первичные методы исследований
  • Интервью
  • Остановились на опросах (больше не успели)
3. Оценка и аналитика интерфейса
Первичные методы исследований
  • Анкетирование
  • Наблюдение
  • Юзабилити тестирование
  • Eye tracking
Анализ
  • Анализ статистики
  • Эвристический анализ Нильсена
10. Принципы хороших интерфейсов. Анимация

На паре я показывал примеры 10 принципов анимации, которые в PDF не посмотреть. Поэтому выложил презентацию с моими пометками к слайду. Пропустившим можно посмотреть 12 принципов анимации Диснея