1. как построить сайт для пользователей, а не для себя
User eXperience design

2. Определение
Юзабилити является степенью эффективности,
продуктивности и удовлетворенности, с которой
продукт может использоваться определѐнными
пользователями для достижения определѐнных задач
в определѐнном контексте.
ГОСТ ISO 9241-11

3. Кто такие UX-спецы?
- Не программисты: программисты подписывают у заказчика
непонятное ему ТЗ, выполняют работу, заказчик берется за
голову, программисты показывают ему подпись на ТЗ.
- Не дизайнеры: дизайнеры ориентируются на чувство вкуса, а
не измерения, торопятся «сделать красиво» вместо вникания в
бизнес клиента, дизайнеры не готовы обосновывать.
- Не маркетологи: маркетологи сфокусированы на привлечении,
забывая про удержание, прячутся за общим, вместо фокусирования
на конкретном, часто занимаются копированием конкурентов,
вместо решения потребностей.

4. Айсберг Юзабилити:
Из чего состоит работа по проектированию взаимодействия?
10% Внешний вид: макет, цвета,
изображения.
30% Функциональность: меню, кнопки,
управление.
60% Цели и задачи пользователя:
действия, навигация, объекты и
взаимодействие между ними, жизненный
опыт, ожидания.

5. Как принято создавать веб-продукт?
Традиционный подход
ДИЗАЙН ПРОГРАММИРОВАНИЕ
1 2

6. Почему традиционный подход
плох?
При создании любого продукта допускаются ошибки.
Традиционный подход в сотню раз повышает цену их
исправления:
ЦЕНА ИСПРАВЛЕНИЯ ОШИБОК НА РАЗНЫХ
ЭТАПАХ:
Стоимость исправления
ошибки минимальна

7. Как же правильно
создавать веб-
продукт?

8. Как мы создаем веб-
продукты?
Современный подход
ДИЗАЙН ПРОГРАММИРОВАНИЕ
2 3
ПРОЕКТИРОВАНИЕ
1

9. Как же правильно создавать продукт?
Начинаем с цели и стратегии

10. Цель и стратегия
Все начинается с цели. Сначала мы решаем что хотим
сделать, а потом — как это можно реализовать.
• В процессе работы над проектом, мы узнаем много новых нюансов и
подробностей. Поэтому менять цель и стратегию — это нормально.
• На начальном уровне мы не увлекаемся деталями.
• Забываем про технические ограничения.
• Думаем о том, зачем пришел пользователь.

11. Цель и стратегия
Разрабатываем пользовательские сценарии. Как будут
развиваться события внутри нашего проекта?
• Думаем, как улучшить существующий у пользователя опыт решения
проблемы?
• Выделяем самые жизнеспособные идеи. Эскизы, раскадровки.
• Выбираем решения, на которые будем опираться

12. Изучаем своего пользователя и его среду
Цель и стратегия

13. Изучаем путь пользователя
Цель и стратегия

14. Наблюдаем
Цель и стратегия
Как задумал дизайнер Как решили пользователи

15. Переводим наработки в
прототипы
ВЫБОР
ШАБЛОНОВ
СОЗДАНИЕ
ШАБЛОНОВ
ОПИСАНИЕ
ВЗАИМОДЕЙСТВИЯ

16. Переводим наработки в
прототипы
Пользователи всегда имеют устоявшиеся привычки и
ожидания от дизайна, элементов интерфейса и
взаимодействия. Мы вычисляем их и используем.

17. Переводим наработки в
прототипы
Также мы знаем, как повысить доверие пользователей,
привлечь их внимание, подтолкнуть сделать первый шаг, а
значит – повысить конверсию.

18. К чему мы стремимся?
Результат работы программиста Результат работы UX-специалистов
Стараемся максимально сократить и упростить взаимодействие
пользователя с интерфейсом, чтобы эффективней погрузить его
в общение с предоставляемым сервисом.

19. Один мастер подбора
тарифа заменил 5 страниц с
описаниями деталей
тарифов
Примеры прототипов

20. Примеры прототипов
Интерактивный прототип - http://projects.newstrategies.ua/UX/MSD/

21. Примеры прототипов
Интерактивный прототип - http://projects.newstrategies.ua/UX/Danone/

22. Примеры прототипов

23. Финальный этап – визуальный
дизайн