Как мы проектируем интерфейсы нескольких приложений в рамках единого продукта.

1. Унификация взаимодействия
Как мы проектируем интерфейсы нескольких приложений
в рамках единого продукта.

2. Кто я
Никита Ефимов
Lead UX Architect
nikita.efimov@ncloudtech.ru

3. План доклада
• Что из себя представляет дизайн-отдел
• Как мы работаем с командами разработки
• Как мы проектируем интерфейсы
• Чем руководствуемся в своей работе и к чему
стремимся

4. Зачем это рассказываю
• Поделиться своим опытом
• Чтобы вы поделились своим (если он похож)

5. Наша команда
CD – Creative Director
DTL – Design Team Lead
UXA – UX Architect
PD – Product Designer
BD – Brand Designer
Итого: 10

6. Как мы работаем

7. Как мы работаем

8. Как мы работаем
DTL

9. Как мы работаем
PD PD
PDPD
UXA

10. UXA vs PD
UXA PD
• Аналитика
• Концепт на все платформы
• Интерфейсные решения
конкретной платформы
могут заменять/дополнять друг друга

11. Два этапа работы
UX UI

12. Принципы работы
1. Анализ исходной задачиAnalyze
Explore
Refine
Build
Defend
Own
Learn
2. Поиск решения
3. Ревью и выбор лучшего наиболее подходящего
4. Детальная проработка
5. Защита решения
6. Ответственность за качество
7. Обучение на ошибках

13. Принципы работы
Gather
Synthesize
Communicate
Make
1. Выяснить всё,
что можем
2. Собрать воедино
3. Сделать
4. Донести до
всех результаты

14. Выдвинул гипотезу, зафиксировал,
протестировал… Романтика!

15. Analyze
• “Докапываемся” до пользовательской проблемы
• Понимаем пользователей
• Выясняем ограничения/возможности
• Анализ текущего поведения пользователей
• Анализ решения аналогов
• Сразу подключаем всех заинтересованных Product’ов

16. Что на выходе
• Структурированный анализ
Feature Canvas: идея, проблемы, пользователи, текущее поведение,
ограничения/возможности, задачи и др.
• Пользовательские истории
В формате Job Story
• Возможны исследования
Проверить своё понимание или закрыть белые пятна

17. Пример исследования
• Исходная гипотеза
• Условия тестирования
• С помощью чего?
• Кто нужен?
• Вводная
• Метрики
• Результаты тестирования

18. Explore + Refine
• Прорабатываем несколько концептов (не погружаемся в
детали)
• Унификация и кроссплатформенность
• Внутреннее ревью (совместный поиск решения)
• Презентация концепта всем Product Owner'ам
+ Формулируем интерфейсные гипотезы
Если мы <что-то сделаем в интерфейсе>,
тогда <пользователи получат ценность>,
потому что <у них есть такие-то проблемы/потребности>.
Мы поймем, что достигли успеха, когда <метрики>

19. Что на выходе
• Один или несколько концептов
• Интерактивный прототип или “мультик”
• Возможны исследования
ЮТ с помощью прототипа или оценка ожиданий с помощью статики

20. Build + Defend
• Подключаем QA из команд для помощи с edge-кейсами
(отклонения от сценариев)
• Детальное прорабатываем интерфейсное решение
• микровзаимодействие
• анимация
• пустые состояния
• обработка отображения проблем
• Прорабатываем интерфейсные тексты
• Защищаем своё решение (рассказываем истории)
• Качественная декомпозиция по фазам реализации (при
необходимости)

21. Что на выходе
• Описание концепта в деталях
Разбиваем по сценариям
• Проработанные тексты
С учётом локализаций

22. Own + Learn
• Ревью графической реализации
Как было “отрисовано”
• Ревью планирования
Как PO запланировал реализацию
• Ревью реализации
Как в итоге получилось

23. Как отслеживаем
• Участие в demo
• Ревью реализованных историй
• “Eating your own dog food”
• Обратная связь и тестирование пилотных внедрений
• Исследуем, как в принципе люди работают

24. UX-стратегия(v1.0)
• Human-Driven Design
Знаем все о наших пользователях
• Test-Driven Design
“Где пруфы, сынок?”
• Consistent Experience
Унифицированное взаимодействие

25. Human-Driven Design
• Постоянно изучаем пользователей, развиваем к ним
эмпатию
• Распространяем знания о пользователях среди всех
команд разработки
• Активно вовлекаем команды разработки в создание
интерфейсов и обсуждение результатов
• Решаем проблемы пользователей (и даём им доп.
ценность), а не придумываем фичи

26. Test-Driven Design
• Любое наше решение – это гипотеза о том, что
пользователю будет хорошо
• Сначала проектируем эксперимент, затем уже сам
интерфейс
• Постоянное тестирование как конкретных гипотез, так
и цельного опыта взаимодействия
• Все решения принимаются на основе метрик (как
количественных, так и качественных)

27. Consistent Experience
• Последовательность в интерфейсе, контенте,
паттернах взаимодействия
• Последовательность во всех точках контакта
пользователя с продуктом
• Видим целостную картину взаимодействия
пользователя с продуктом (в рамках нескольких приложений)
• Понимаем наше место в рабочей среде человека, чтобы
гармонично в неё встроиться

28. Процесс внутри команды

29. Процесс разработки

30. Вся компания
Зона заражения UX

31. Спасибо!