Презентация для стартапов в рамках Moscow Startup Day - 2014

1. Проектирование
пользовательского опыта и тренды
в интерактивных коммуникациях.
Рекомендации для стартапов
Михаил Галушко
Презентация для Moscow Startup Day - 2014

2. Немного обо мне
Михаил Галушко
Занимаюсь проектированием пользовательских интерфейсов
• Бизнес-аудит
• Юзабилити-экспертиза
• Пользовательский опыт
• Информационная архитектура
• Проектирование взаимодействия
• Интерактивные прототипы
• Контент-стратегия
• Концепция развития
• Консультационная поддержка
galushko.ru

3. Темы к обсуждению
• Роль трендов в интерактивных коммуникациях
• Организация процессов проектирования
• Применение практик проектирования на примере
стартапа
• Рекомендуемая литература

4. Роль трендов
в интерактивных коммуникациях

5. • Cрок жизни тренда: 2-3 года
• Сайты стартапов традиционно используют
наиболее актуальные тренды
• Классический бизнес развивает свои сайты
ориентируясь на опыт стартапов

6. Примеры трендов

7. Large Hero Areas – большое графическое
или видео-изображение при входе на сайт

8. Плоский дизайн и простые цветовые схемы –
сплошные цвета и никакого скевоморфизма

9. UX-ориентированная навигация –
качественный пользовательский опыт
определяет все решения на сайте

10. Эксперименты и инновации в навигации – отказ от шаблонных решений
и сценариев в пользу «вау-эффекта»

11. Легкость и простота восприятия контента

12. Унификация обычной и мобильной версий – весь контент всегда
доступен для всех пользователей независимо от устройства

13. www.awwwards.com
все актуальные тренды здесь

14. • Тренды мешают развивать узнаваемость
• Коммуникационная эффективность тренда
зачастую противоречит бизнес-эффективности
• Применение трендов требует тестирования

15. Сайт Virgin America как пример использования
актуальных трендов

16. Практика
применения трендов

17. Три версии анкеты
V H T

18. Общие показатели
Страница Трафик Конверсия (%)
V 280 10
H 453 7,73
T 377 6,37
P-value 0,006

19. Общие показатели
10
7,5
5
2,5
0
Конверсия
10%
7,7%
H
V
6,37%
T

20. Ошибки
Страница
Процент возникновения
ошибок
V 11,91%
H 24,72%
T 32%
Основные ошибки на форме H возникали на поле ФИО.
Пользователи не проходили валидацию, т.к. пытались вводить теряли либо Фамилию либо Отчество.

21. Конкретизация ошибок
на формах
Ошибка Почта Доход Стаж более
года
Более 4
месяцев ФИО Телефон Даю
согласие Возраст
V 19 35 43 21 6 5 14 7
H 49 26 14 16 19 13 - -
T 27 27 14 13 18 10 - -
Общее 95 88 71 50 43 28 14 7
Обилие ошибок на форме H вызвано тем, что ошибка срабатывает тогда, когда пользователь снимает
фокус с поля. А учитывая, что многие пользователи пробегаются по полям перед тем как заполнить, то
пользователь получает большой спектр ошибок.

22. Распределение внимания
H T

23. Почему проиграла
версия T?
На странице T у нас есть сценарий, при котором в момент взаимодействия мы
отказываем пользователям в кредите. Таких пользователей получилось 85.
Идеальный способ для повышения качества входящих лидов.

24. Где мы теряли
пользователей?

25. Где мы теряли
пользователей?

26. Где мы теряли
пользователей?

27. Приняли решение
объединить версии V и H

29. Что мы поняли по итогам тестирования:
• Трендовая версия показала отличное вовлечение
пользователей
• Трендовая версия давала наиболее качественную
аудиторию
• Когда важнее количество заявок, а не их
качество, трендовая версия проиграла
классическим решениям

30. Процессы проектирования
с ориентацией на пользователя

31. Как это работает
в агентствах

32. Бизнес-аудит
• Собирается вся доступная информация о проекте
и стоящих перед ним задачах.
• Интервьюирование руководителей направлений в
компании заказчика
• Сбор и анализ информационно-аналитических
материалов, презентаций заказчика, статистика и
т.п.
• Изучение открытых источников по теме

33. Стратегия
• Формулируются коммуникационные и бизнес-
цели (или операционные цели) будущего сайта
или сервиса
• Конструируются инструменты, которые будут
применяться для достижения установленных
целей
• В итоге появляется концепция продукта

34. Аналитика
• Прорабатываются особенности целевой
аудитории (персонажей)
• Проектируются сценарии взаимодействия
• Готовится вся необходимая документация,
которой будут руководствоваться в дальнейшем
проектировщики и разработчики

35. Проектирование и дизайн
• Разработка концептуальных прототипов и
концепции дизайн
• Тестирование концепции
• Детальное проектирование
• Дизайн, верстка и разработка

36. Практика проектирования
на примере проекта mainbox.com

37. • Есть складские площади в Америке
• Есть возможность регистрации виртуальных
почтовых адресов
• Есть возможность организовать авиадоставку

38. Как из этих вводных
сделать прибыльный
интернет-бизнес?

39. • Сайты конкурентов выглядели так, словно были
сделаны 10 лет назад.
• Мы предложили ориентироваться на наиболее
актуальные тренды на тот момент.

40. • Конкуренты имели невнятную ценовую политику с
массой дополнительных условий
• Мы все упростили: 19 долларов за килограмм,
все остальное опции

41. • Процесс получения заказа и последующей
доставки у конкурентов не был понятен и
прозрачен
• Мы разработали весь бизнес-процесс, каждая
стадия которого отображалась в личном
кабинете пользователя

42. Пример проектирования бизнес-процесса

43. Проработка деталей
(одна из версий)

44. Разработка прототипов
и спецификаций

45. Разработка дизайна
и программирование

46. • Сайт сразу показал высокую конверсию в
регистрации
• Высокая доля повторного использования сервиса
• Немалую роль сыграла поддержка
пользователей в онлайн-каналах и быстрый ответ
на их запросы
• Этот бизнес существует уже 2 года и продолжает
развиваться

47. Рекомендуемая литература
по проектированию для стартапов

48. • Marcin Treder UX Design for Startups
• Jeff Gothelf, Josh Seiden Lean UX
• 50 User Experience Best Practices by Above the
Fold

49. • Алан Купер Психбольница в руках пациентов
• Алан Купер об интерфейсе. Основы проектирования
взаимодействия
• Мальком Гладуэлл Переломный момент Как
незначительные изменения приводят к глобальным
переменам
• Робин Вильямс Дизайн для недизайнеров
• Дон Бек, Крис Кован Спиральная динамика. Управляя
ценностями, лидерством и изменениями в XXI веке

50. Cпасибо за внимание