1. iDM 15.oct.2014

2. Intro / цели

3. ..мало проектировать интерфейсы,
мало проектировать взаимодействие,
мало делать какой-то продукт, систему,
а необходимо проектировать опыт
пользователя как единое целое

4. Виктор Ерофеев
• Разработка софта, с 2000 года
• Более 150 систем и проектов
• (IT)-директор
CG Projects Group
• uxspb / profsoux
• Microsoft MVP 2007-2014
Client Application Dev

5. Agenda - часть раз (про UX)
про терминологию
• Что такое UX и зачем вам вообще это надо
• Про «дизайн» и «дизайнеров»
про теорию
• Как делать продукт, чтобы не переделывать
• Естественные чит-коды в проектировании
Перекур!

6. Agenda – часть два (бизнес)
про бизнес и value
• Где лежат деньги (и зачем для этого UX)
про методики и подходы
• Разные уровни проектирования
• За что хвататься первым (engagement)
• Как не облажаться в очевидных вещах
• Где еще лежат деньги (облажаться дешевле)
Перекур!
• Дискуссия с выжившими

7. «UX наоборот»

8. i. Что такое UX
и зачем вам это надо
Сабж?

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

10. user experience
to experience (smth)

11. user experience
проектирование
̴ взаимодействия
̴ опыта, эмоций, ощущений
̴ практической отдачи
̴ эффективности в решении задач
̴ самих задач пользователя
̴ сценариев его работы

12. Зачем вам это надо:

13. Зачем вам это надо:
1. Взаимодействия без
experience не бывает
2. Если нельзя предотвратить –
надо возглавить

14. Где experience
• User Interface / UX
• Customer experience
• Customer relations + sales
• Issue management
• В эстетике, логике, сценариях
• В голове пользователя (!)

15. - Что такое UX
и зачем вам это надо?

16. i. Про «дизайн»
и «дизайнеров»
Чем занимается дизайнер

17. Жосская правда:
- в СНГ дизайнер красит кнопки

18. search: ux

19. Отличие UX от UI - ?
experience / interface
UI: объект
UX: процесс

20. designer
design (n.)

21. дизайнер != designer
дизайнер = иллюстратор
designer = проектировщик
Промышленный дизайн –
инженерная дисциплина

23. appearance
interaction
business logic
use cases

24. appearance
interaction
business logic
use cases
UI
UX

25. Задачи UX-проектировщика
- какие должны быть возможности
- как пользователь пользуется
- что при этом чувствует
- какие сценарии реализует
- с чем/как взаимодействует

26. appearance
interaction
interaction
business logic
use cases
appearance
appearance
appearance

27. - Чем занимается
UX-проектировщик?

28. iii. Как делать, чтобы не
переделывать
Да, это про кейсы

29. Постановка задачи
- какая есть у пользователя
потребность?
- как мы можем ее закрыть
- что нам от него нужно
- как он будет себя вести

30. use case
кто (ролевая модель)
делает что (функция)
когда / в какой момент времени
с каким результатом (value +/-)

32. то же самое текстом
• Клиент
– заказать еду
– сьесть
– оплатить
• Официант
– принять заказ
– подать заказ
– принять деньги
• Повар
– принять заказ
– приготовить еду
– передать заказ
• Кассир
– принять деньги
– провести платеж

33. решение проблемы человека
- пожрать
customer needs
- заказать билет
- обработать фотку
- записаться к врачу
- посмотреть отзывы
Заинтересованные лица, цели, задачи, требования

34. customer needs
решение проблемы человека
- пожрать провести вечер
- заказать билет подобрать маршрут
- обработать фотку иметь что показать
- записаться к врачу взять справку
- посмотреть отзывы купить и не пожалеть
«чтобы не переделывать»

35. - пожрать провести вечер
- заказать билет подобрать маршрут
- обработать фотку иметь что показать
что важно, а что нет
какой функционал в приоритете
какие у нас ниша и преимущества
как улучшить

36. - как собрать кейсы:
что для этого нужно?

37. iiii. Как проектировать
Мы вроде знаем задачи и функции,
а получается отстой

38. let’s
get
physical

39. «удобно»
- быстро
- с минимальными затратами
- с минимальными силами/вниманием
- с положительной эмоцией
- решает реальную потребность

40. «удобно»
- предсказуемо, знакомо
- просто / непосредственно
- без дополнительных абстракций
- функционально / продумано

41. Как быть?
а) думать ux engineer
б) тестировать ux lab

42. Эргономика
HCI
• Антропометрическая совместимость — учёт размеров тела человека
(антропометрии), возможности обзора внешнего пространства,
положения оператора при работе.
• Сенсомоторная совместимость — учёт скорости моторных операций
человека и его сенсорных реакций на различные виды
раздражителей.
• Энергетическая совместимость — учёт силовых возможностей
человека при определении усилий, прилагаемых к органам
управления.
• Психофизиологическая совместимость — учёт реакции человека на
цвет, цветовую гамму, частотный диапазон подаваемых сигналов,
форму и другие эстетические параметры машины.

43. задачи по вниманию
• Внимание ограничено
– количество элементов
– взаимосвязи
– связный контекст
• Внимание рассеяно
– выделить главное
– разделить статус
и действия
• Внимание / время
– нотификации
– сбор данных заранее
– дайджесты
• Нечеткое восприятие
– использовать мета-
контролы, схемы
• Локус внимания
– выделять суть

47. - в чем основной cheat?

48. бизнес:
кейсы, потребности и роли

49. курите на здоровье!
cgvictor / cg@cg.net.ru

50. v. Где лежит бабло
И почему UX для этого важен

51. Откуда берется бабло - ?
(и можно ли не думать про UX)
value

52. Какой бывает value
• Решение проблемы, задачи
• Улучшение порядка вещей, QoL
• Удовольствие / удовлетворение
• Социалка – статус, соцпруф
Value может стоить $$$

53. Субъективность оценки
!=
Деньги общие, а профит частный

54. Value +++
когда оценка возрастает
• Своевременность (операции)
• Полнота, over deliver
• Уникальность
• Удача (limited time offer)
• Ikea Effect
• Декларируемая стоимость (D&G)
• Владение, loss aversion

55. UX, бизнес-кейсы:
Игра с ненулевой суммой
Value → (inter)Action → Value+
Успех = «получил больше чем вложил»

56. black magic
тратит время
тратит внимание
тратит деньги
получает решение
экономит время
получает эмоцию
получает статус
получает ресурс
added value
тратит ресурс
получает деньги

57. Баланс игры
Затраты
• Внимание
• Время
• Деньги
• Память (RAM)
• Контекст (T-shift)
• Связи / interop
• Физика
Приобретения
• Время
• Эмоция
• Соцпруф
• Деньги
• Уверенность
• Награда

58. 0. Реклама / вовлечение / регистрация
1. First time experience
2. Первые решенные задачи
3. Инструмент
4. Troubleshooting, поддержка
0. Кейсы выхода / возврата (tesla)
0. Вовлечение других
Σ

59. - где лежит бабло?
взаимодействие создает
(персональную) ценность

60. 0. Разные уровни проектирования

61. Разные уровни UX-проектирования
Ситуационный дизайн
Тактический дизайн
Стратегический дизайн
решить задачу
максимально просто
единообразие, консистентность
взаимодействия, визуальный язык,
расширяемость, кривая обучения
«just works», образ-аналогия,
модели, скеоморф, работа с
брендом, customer story & lifestyle

62. vi. За что хвататься первым
Приоритеты
и engagement map

63. 80/20
↓↓↓
20% улучшения, 80% профита

64. Что пилить?
а) Частотный подход
то, что чаще
всего используется
1000 просмотров списка
800 «найти актуальные»
100 правок
90 правка последних пяти
10 созданий нового
5 удалений, 15 поисков

65. Что пилить?
б) Engagement map / user journey
то, что понадобится
в первую очередь
- выбор направлений, дат
- выбор стыковок-маршрутов-цен
- оплата и печать данных
- комменты? отзывы?
- настройка фотки в профиле?
FTE & inline tips

66. выбрать?
Частотный
• есть типовой набор
операций
• есть KPI / метрики
эффективности
• нагрузка на внимание
неравномерная
скорость операций
Engagement
• есть длинные
сценарии
• воронка продаж
• предполагается
(само)обучение
пользователей
MVP→+→++→FFP

67. -?

68. vii. Как не облажаться
в очевидных вещах
кейсы и потребности

69. Как быть?
а) думать ux engineer
б) тестировать ux lab

70. «- застегни ширинку, закрой рот
и разуй, наконец, глаза»
сицилийская семейная поговорка

71. Что работает (практика)
• Смотреть на задачи пользователей
• Смотреть на конкурентов
• Пробовать, на людях и себе (dogfood)
• Упрощать («не делать», 80/20)
• Быстро исправлять
• Собирать истории (от power users)
• Задавать неудобные вопросы
• Моделить, скетчить, прототипить

72. Что не работает
• Спрашивать пользователей
– хочешь спросить – проверь (gladwell)
• Стоять над душой
• Красивые картинки без логики
– «нанять крутого рисовальщика» тоже нет
• «Подгонка под ответ»-ы стейкхолдеров
– см. про кейсы и customer needs
• ?? A/B (good vs evil), focus groups, аудиты итп

73. + спросить профессионала
ugly coyote

74. viii. Как облажаться
дешевле
сабж

75. time to market
«О, сколько нам открытий чудных»
• minimal value product
• без продукта вообще
• первая копейка
• первая жалоба
• первое пожелание

76. Прототипы
• Модель дешевле прототипа
• Прототип дешевле prod-скетча
• Скетч дешевле full feature-а

77. Фрейминг
Сильное колдунство ↑
• Фишка продукта (beta, ctp, techprev, nightly)
• Группа пользователей (power users, devmode)
• Другая ниша
Ограничивайте риски
+ добавляйте value

78. Underpromise, overdeliver
про обещания и лишние фичи

79. Проектировать только по кейсам / UJm,
кейсы только по собственным исследованиям

80. “
- Чем спрашивать
у темноты «кто здесь?»,
лучше выстрелить,
перезарядить и еще
раз выстрелить.
Ошибайтесь быстрее

81. Виктор Ерофеев
cgvictor / cg.net.ru