разработка сайта лизинговой компании. простые советы для сложных задач 2013 (1)
Usability&UX
1. Улучшение сайтов и
usability
Зачем нужна симпатия клиентов
и как ее добиться
2. От Usability
к UX
Usability – удобство
использования
User Experience (UX)-‐‑ опыт
взаимодействия как
«ощущение и реакция
человека, вследствие
использования»
О чем эта презентация
2
User Experience
Usability
3. Human Centered
Design Age
Начало 2009г. Стал доступен переработанный
вариант стандарта ISO 9241-‐‑210:
«Ergonomics of human-‐‑system interaction. Part 210.
Human-‐‑centred design for interactive systems».
О чем эта презентация
3
5. План презентации
• О чем эта презентация об этом уже поговорили ;)
• Зачем добиваться симпатии
• Как добиться симпатии
• Эффективный продукт
• Создаем ощущение
5
7. • Клиент привыкает к удобству
• Испытывает благодарность за заботу
• Переносит чувства от сайта на компанию и
продукт, т. е. повышается лояльность.
• Клиенту проще достичь целей,
повышается конверсия = деньги!
7
Зачем добиваться симпатии
8. Usability ROI
0
10
20
30
40
50
Зачем добиваться симпатии
8
• Оценка уровня ROI
воспользовавшихся
юзабилити-‐‑услугами.
• Опрос проводился
агентством E-‐‑
consultancy в 2007
году.
ROI -‐‑ Окупаемость инвестиций
По презентации Дмитрия Сатина
10. UX – это модно
Совсем скоро про заботу о людях будут говорить
все значимые игроки рынка, давайте будем
в числе первых.
10
Зачем добиваться симпатии
11. KPI UX = конверсия
• Каждое решение вызвано целями бизнеса
• Любое изменение влияет на эффективность
• Эффективность каждого решения замеряема в
клиентах, заявках, деньгах...
11
KPI -‐‑ ключевые показатели эффективности
UX – опыт взаимодействия
Зачем добиваться симпатии
12. Не нужно бороться
ценой
Борьба ценой убивает рынок и
приводит
к вырожденной аудитории.
Формирование ощущений – способ
завоевать клиентов без снижения цены.
12
Зачем добиваться симпатии
13. Добиваться симпатии
клиентов ради достижения
целей бизнеса
Итак, зачем добиваться
симпатии людей?
13
Зачем добиваться симпатии
14. От потребности к
удовольствию
Как добиться этой самой симпатии?
14
15. Он знает как
делать свою
работу с
удовольствием
Мы должны помочь людям
чувствовать себя так же
Как добиться симпатии
15
26. Какие цели, чем занимается,
сколько лет, как зовут, как
выглядит, как отдыхает, любимые
сайты
Создание персонажей
26
Не нужно описывать реальных людей, нужно
выявить характерные паттерны
Эффективный продукт
27. Почему ЦА
не подходит?
Нужно
• Определить цели человека
• Вжиться в него
• Понять ограничения
27
Эффективный продукт
32. Юрий Вдовиченко
Город: Вологда
Возраст: 32
Семейное положение и дети:
женат, дочь 5 лет
Образование: автослесарь IV
разряда
Хобби: рыбалка, дача, хоккей
32
Эффективный продукт
33. Юрий Вдовиченко
Деятельность: собственный бизнес –
продажа расходников для
автосервиса
Цели: выход на новый уровень
сервисов, расширение
ассортимента
Часто используемые сайты:
gmail.com, yandex.ru, lenta.ru
33
Эффективный продукт
34. Юрий Вдовиченко
Место взаимодействия: офис, дом
Устройства: Ipad 2 / Ноутбук Sony
Vaio Z
Платформа: iOS / Windows 7
Разрешение экрана: 1024x768 /
1366x768
Браузер: Sagari / Google Chrome
34
Эффективный продукт
35. Элла Тимофеевна
Город: Новосибирск
Возраст: 60
Семейное положение и дети:
замужем, 2е детей, 3е внуков
Образование: педагог начальных
классов
Хобби: дача, внуки, сериалы
35
Эффективный продукт
36. 36
Элла Тимофеевна
Деятельность: наемный директор в
магазине канцтоваров
Цели: повышение прибыли за счет
продажи более дорогих товаров
Часто используемые сайты: mail.ru,
yandex.ru
Эффективный продукт
37. 37
Элла Тимофеевна
Место взаимодействия: офис
Устройства: стационарный
компьютер
Платформа: Windows XP
Разрешение экрана: 1280х768
Браузер: IE7
Эффективный продукт
38. Ольга Галыгина
Город: Нижний Новгород
Возраст: 25
Семейное положение и дети: не
замужем, детей нет
Образование: международный
менеджмент
Хобби: кафе, фото, шопинг
38
Эффективный продукт
39. Ольга Галыгина
Деятельность: менеджер по
закупкам в сети магазинов
инструмента
Цели: расширение ассортимента
средствами защиты
Часто используемые сайты:
yandex.ru, vkontakte.ru, facebook.ru,
lookatme.ru
39
Эффективный продукт
40. Ольга Галыгина
Место взаимодействия: офис
Устройства: Ноутбук Acer Aspire
5560
Платформа: Windows 7
Разрешение экрана: 1366x768
Браузер: Opera 10
40
Эффективный продукт
41. Вика Ремизова
Город: Самара
Возраст: 36
Семейное положение и дети:
замужем, сын 2 года
Образование: школа
Хобби: шопинг, кино, друзья
41
Эффективный продукт
42. Вика Ремизова
Деятельность: администратор в
стоматологии
Цели: регулярный заказ расходных
материалов
Часто используемые сайты: mail.ru,
odnoklassniki.ru
42
Эффективный продукт
43. Вика Ремизова
Место взаимодействия: офис
Устройства: стационарный
компьютер
Платформа: Windows XP
Разрешение экрана: 1024x768
Браузер: IE 7
43
Эффективный продукт
44. Основные персонажи
• Выпишите все варианты персонажей без
детализации
• Объедините персонажи с пересекающимися
данными
• Персонажей должно быть 1-‐‑5
• Больше? Сокращайте или делайте несколько
сайтов.
44
Эффективный продукт
45. Ключевой персонаж
В случае дилеров 3М:
• Принимающий финансовые решения
• Готовящий информацию для ЛПФР
• Часто взаимодействующий с сайтом
Разрабатывайте для ключевого персонажа, но
учитывайте интересы всех.
45
Эффективный продукт
47. Определение целей
• Оценить рентабельность закупок
• Выбрать дилера
• Обеспечить необходимые поставки
• Расширять и модифицировать ассортимент
• Увеличивать прибыль
47
Эффективный продукт
49. 1. Выбор дилера
• Переход на главную страницу из Яндекса по
запросу «дилер 3М»
• Каталог продукции – группа товаров – товар 1,
товар 2
• Преимущества
• Условия сотрудничества
• Контакты
49
Эффективный продукт
50. 2. Периодические
заказы
• Переход в личный кабинет из закладок
• Шаблон заявки
• Заполнение заявки
• Отправка
50
Эффективный продукт
51. Определение
контекста
Мы уже знаем устройства, которыми она
пользуется. Возможные варианты места:
Офис, 1 час, средняя концентрация
Офис, 10 минут, большая концентрация
Дом, 4 часа, низкая концентрация
51
Эффективный продукт
52. Тестирование
требований
Задайте реальным клиентам несколько вопросов:
• Как они приходят на сайт
• Какая информация их интересует больше всего
• Что их раздражает, расстраивает
• Какие чувства вызывает у них сайт
52
Эффективный продукт
53. Креатив и стратегия
• Основаны на полном
понимании аудитории
• Отталкиваются от ее
целей и это легко
проверить
• Точно знают зачем
человек приходит на
сайт и куда его вести
53
Эффективный продукт
56. Тестирование
карты сайта
• Учтены все сценарии
• Один раздел только в одном месте
• Логичное распределение разделов / подразделов
• Разделы названы так, как привык видеть человек
56
Эффективный продукт
57. Прототип
• Понимаем, что получим в итоге
• Можем протестировать
• Легко исправить (в 100 раз дешевле)
57
Эффективный продукт
61. Экспертная оценка
Главная страница:
• Чем сайт является?
• Что в нем содержится?
• Что на нем можно делать?
• Почему я должен быть именно на этом
сайте?
61
Эффективный продукт
63. Возьмите дизайн, отодвиньте на вытянутую
руку, не всматривайтесь слишком внимательно,
постарайтесь как можно быстрее найти
элементы >>
Экспертная оценка
63
Эффективный продукт
64. • Логотип
• Название страницы
• Разделы и подразделы
• Локальная навигация
• Индикатор местоположения
• Поиск
Попробуйте найти
в дизайне:
64
Эффективный продукт
65. Тестирование
на людях
• Пригласить человека
• Подготовить вопросы
• Записать на камеру
• Показать тестирование команде
65
Эффективный продукт
66. Тестирование на
людях
• Тестировать сайт, а не человека
• Ориентироваться на действия больше,
чем на слова
• Просить мыслить вслух
66
Эффективный продукт
67. По итогам
тестирования
Выявить проблемы и найти решения.
Типичные проблемы:
• Не понятно, что это за сайт
• Не получается найти знакомые слова
• Слишком много всего
• Не обращайте внимание на комментарии
по дизайну!
67
Эффективный продукт
68. По итогам
тестирования
Победа быстро и дешево!
• Используйте неожиданные находки
• Вносите простые исправления где это возможно
• Избегайте добавлять описание и инструкции
68
Сократите текст вдвое, а потом еще вдвое
(не касается SEO текста)
Эффективный продукт
70. Техническое описание
Описание всех идеи и функций, которые
содержаться в прототипе.
Технические требования, безопасность,
обеспечение функционирования.
70
Эффективный продукт
71. Дизайн
• Концепция рисуется параллельно с прототипом
• Концепция рисуется вслед за прототипом
71
Эффективный продукт
72. Тестирование дизайна
Те же этапы:
• Экспертная оценка
• Тестирование на людях
• Сплит (a/b) тестирование
72
Эффективный продукт
73. Внесение исправлений
в дизайн
• Ориентируйтесь на персонажи и ТО
• Насколько дизайн отвечает требованиям
• Наймите артдиректора, если есть сомнения
73
Эффективный продукт
74. Тестирование верстки
• Проверить работу в разных браузерах и разных
разрешениях
• Проверить на соответствие ТО
• Проверить информативность элементов (кнопки
должны визуально нажиматься, ссылки менять
цвет и тд)
74
Эффективный продукт
76. 76
Эффективный продукт
Видео о связи user experience с работой продукта
hƒp://youtu.be/X_sV2M4qhz4
Смотрим видео
Как корректность
работы влияет на UX