Выразительный Javascript. Руководство для тех, кто плохо знаком с uxисследованиями и хочет лучше понять их роль в создании продукта
 Скачать 6.02 Mb.
|
|
РИС. 8.5. группировка находок в разрезе шести составляющих пользовательского опыта Если вы испробуете этот метод, то обнаружите, что какие-то пун- кты можно отнести к разным категориям, и это вполне ожи- даемо. Однако, чтобы извлечь максимальную пользу из этого упражнения, я хотел бы предложить вам определить, какой из шести компонентов наиболее важен для вас как для дизай- нера в каждом конкретном случае. Может быть, основная про- блема связана с визуальными аспектами? Или аспектами взаимо- действия? Не слишком ли сложная терминология используется? Правильную ли систему координат вы задали? Предлагаете ли вы пользователям адекватные инструменты для решения их про- межуточных задач на пути к главной цели? Не разочаровыва- ете ли их в том или ином смысле? Шаг 3. Выявляйте тенденции и сегментируйте аудиторию В третьей части этой книги мы поговорим о сегментировании аудитории. Если вы стремитесь обнаружить тенденции, общие для представителей различных групп, то найдете общие и различ- ные черты среди находок, относящихся к тем или иным группам. Это даст ценную информацию, которая позволит вам определить дальнейшие направления разработки дизайна продуктов и услуг. Ожидает, что в поиске предусмотрена функция всплыва- ющих подсказок Обеспокоен: «Что, если кресло за 5000 долларов повредят во время доставки?» Не может найти опцию «Посмотреть позже» Не может найти корзину Ожидает, что щелчок по обложке книги выведет на экран ее содержание Предпочитает, чтобы отзывы о продукте сортиро- вались по уровню популярности Кажется, не может найти иконку воспроизведения превью к фильму Вводит в строку поиска «кресло Eames Lounge Chair», когда его просят найти кресло Навигация Память Эмоции Язык Принятие решений Визуальное восприятие Хочет, чтобы его костюмы соот- ветствовали его статусу (первый вице-президент) 118 | глава 8 Классификация находок по шести составляющим пользователь- ского опыта поможет также управлять процессом совершенство- вания продукта. Вы можете сообщить информацию по принятию решений своему эксперту по UI (пользовательскому интерфейсу), информацию по визуальному восприятию / вниманию — графиче- скому дизайнеру и т. п. В конечном счете ваши пользователи полу- чат лучший пользовательский опыт. В следующих главах я приведу несколько примеров из практики участников реального исследования в области электронной ком- мерции, которое я проводил. Мне хотелось бы добиться того, чтобы вы научились выделять интересную информацию и факты из общей массы данных, а также задумались над некоторыми нюан- сами проведенного анализа. Упражнение В онлайн-курсах по шести составляющим пользовательского опыта я предлагаю участникам небольшой массив реальных дан- ных, полученных от участников предыдущих исследований (правда, в несколько обобщенном виде, чтобы не выдавать коммерческих тайн). На рис. 8.8−8.12 приведены записи, сделанные участниками иссле- дования в области электронной коммерции. Их попросили принять решение о покупке того или иного товара: выбрать для просмо- тра понравившийся фильм или найти и купить какой-либо товар. Фокус в исследовании сделан именно на поиске и выборе продукта (оформление заказа предметом исследования не являлось). Далее приведены записки о тех находках, которые были сделаны в про- цессе контекстных интервью. Проблема. Пожалуйста, распределите каждую из этих записок в соответствующую категорию на рис. 8.7 (визуальное восприя- тие, навигация и т. д.). Если у вас возникли затруднения, обрати- тесь к рис. 8.6. Пользовательские исследования: контекстнЫе интервью | 119 Внимание / Визуальное восприятие Принятие решений Навигация Память Язык Эмоции Что они чувствуют в данный момент? Каковы их глобальные цели в жизни, на основе которых ставятся цели и формируются страхи? На какой прежний пользова- тельский опыт они опираются? К каким категориям они относят разные понятия? Что привлекло их внимание? Что они ищут? Чего они пытаются добиться? Какая информация им нужна, чтобы принять решение? Понимают ли они, где находятся? Насколько успешно, с их точки зрения, они ориентируются на сайте? Какими терминами они оперируют? Насколько сложна терминология, которую они используют? РИС. 8.6. Шесть составляющих пользовательского опыта Если вы считаете, что ту или иную записку следует поместить в две или три категории, то это возможно, но старайтесь ограничиваться одной наиболее важной. Что вы узнали о том, каким образом мыс- лит каждый индивидуум? Можно ли выявить какие-либо общие тенденции среди участников? Участник __________________________________________________________ Принятие решений Язык Эмоции Память Навигация Визуальное восприятие РИС. 8.7. к какой из шести составляющих пользовательского опыта вы отнесете каждую находку? 120 | глава 8 Ожидает, что в поиске предусмотрена функция всплываю- щих подсказок Обеспокоен: «Что, если кресло за 5000 долларов повредят во время доставки?» Предпочитает, чтобы отзывы о продукте сортиро- вались по уровню популярности Ожидает, что щелчок по иконке книги выведет на экран ее содержание Кажется, не может найти иконку воспроизведения превью к фильму Не может найти опцию «Посмотреть позже» Не может найти корзину Вводит в строку поиска «кресло Eames Lounge Chair», когда его просят найти кресло Хочет, чтобы его костюмы соответствовали его статусу (первый вице-президент) РИС. 8.8. находки участника 1 Беспокоится о том, что опять потерпит неудачу. Хотел бы знать политику возврата продукта, прежде чем оформлять заказ Не может выяснить, как увеличить изображение продукта Кликнул по эм- блеме магазина. Не может понять, как вернуться к результатам поиска Хочет немед- ленно выяснить, принимает ли этот сайт оплату через PayPal Ввел в строку поиска «аккумуляторная двухскоростная дрель Dewalt на 20 вольт» Говорит, что отзывы покупателей — это ерунда, магазины их подделывают. «Я им не доверяю!» Хочет получить возможность сравнить продукты по всем параме- трам, прежде чем принять решение Не заметил опцию «Вернуться к результатам поиска». Ищет кнопку «Вернуться на предыдущую страницу» РИС. 8.9. находки участника 2 Ожидает увидеть рейтинги фильмов по версии сайта Rotten Tomatoes Ожидает, что после клика по названию фильма запускает- ся превью, а не сам фильм Хотел бы найти удобный способ купить фильм с ноутбука и посмотреть его на телевизоре Хотел бы знать, в каком разреше- нии воспроизво- дится фильм: 1080p или 4K UHD Анонсы фильмов кажутся трудными для восприя- тия — слишком многословными Хотел бы отсорти- ровать результаты по категории «Нуар» Не понимает, какие фильмы доступны для просмотра членам клуба РИС. 8.10. находки участника 3 Пользовательские исследования: контекстнЫе интервью | 121 Нажимает кнопку «Назад» и каждый раз возвраща- ется на главную страницу Не уверен, безопасно ли оплачивать покупки кредитной картой на этом сайте. «Я могу позвонить по поводу моего заказа?» Опасается купить что-нибудь случайно Нервничает. «Мой внук обычно помогает мне сделать это» Не может понять, как получить полноразмерное изображение продукта Попытался кликнуть на название про- дукта на странице продуктов. Ничего не произошло Хочет сказать вслух, что ищет, — «как с моим маленьким телефонным другом» (Siri) Не может найти, где оплатить покупку Домашняя страница выглядит пугающе загруженной. «Это перебор!» Вводит в строку поиска «игрушка», чтобы найти све- тящийся в темноте фрисби. Ничего не может найти РИС. 8.11. находки участника 4 Ожидает увидеть рейтинги филь- мов по версии сайта Rotten Tomatoes Ожидает, что после клика по названию фильма запу- скается превью, а не сам фильм Хотел бы найти удобный способ купить фильм с ноутбука и посмотреть его на телевизоре Хотел бы знать, в каком разрешении воспроизводится фильм: 1080p или 4K UHD Анонсы фильмов кажутся трудными для восприя- тия — слишком многословными Хотел бы отсорти- ровать результаты по категории «Нуар» Не понимает, какие фильмы доступны для просмотра членам клуба РИС. 8.12. находки участника 5 В следующих главах мы еще вернемся к пяти участникам и по мере необходимости будем использовать отдельные блоки этих данных, чтобы на конкретных примерах проиллюстрировать некоторые аспекты рассматриваемой темы и помочь вам в освоении навыков анализа данных в различных ситуациях. Вам не терпится выполнить это упражнение до конца и поделиться результатами с друзьями? Отлично! Загрузите эти записи в формате для Apple Keynote или Microsoft PowerPoint — так вы можете отпра- вить сделанное упражнение кому угодно ( bit.ly/six-minds-exercise ). Практические рекомендации — Отдавайте предпочтение наблюдению за работой сотрудников непосредственно на их рабочих местах, а не просто интервью- ированию: когда люди находятся внутри ситуации, всплывает гораздо больше важных деталей. — Наблюдайте за тем, как люди выполняют те или иные задачи, а не просто обсуждают, что следует сделать: контекстные воспо- минания и подсознательное поведение проявляются ярче в этом случае. — Попытайтесь выявить представления об окружающей среде, лежащие в основе их поведения: попытка встать на точку зрения потребителей помогает выявить болевые точки и те вопросы, в которых вы можете им помочь. — Оценивайте наблюдаемое поведение сотрудников, а не просто то, что они говорят по тому или иному поводу. Как часто они проверяют свои мобильные телефоны? Как часто они пользу- ются бумажными или электронными версиями документов? Рекомендованная литература Chipchase J. The Anthropology of Mobile Phones. bit.ly/2Uy9J1A. Chipchase J., Lee P., Maurer B. Mobile Money: Afghanistan // Innovations: Technology, Governance, Globalization. 2011. Vol. 6. N. 2. P. 13–33. The Field Guide to Human-Centered Design. www.designkit.org/resources/1. визуальное восПриятие: вЫ на меня смотрите? | 123 Глава 9 Визуальное восприятие: вы на меня смотрите? Мы обсудили, как следует проводить контекстные интервью и наблюдать за взаимодействием людей с продуктами и услугами. Я бы хотел, чтобы вы задумались о том, каким образом в процессе этих интервью можно получить ценную информацию о каждом из шести компонентов пользовательского опыта. Обсуждение этого вопроса хотелось бы начать с визуального вос- приятия и внимания (см. рис. 9.1). С точки зрения этого аспекта нам следует получить ответы на следующие вопросы. — Куда смотрят наши пользователи? На чем сфокусирован их взгляд? Что привлекает их внимание? Можно ли на этом осно- вании судить о том, что они ищут и почему? — Находят ли наши пользователи то, что ищут? Если нет, то почему? Какие проблемы помешали им найти искомое? Визуальное восприятие / внимание РИС. 9.1. визуальное восприятие и визуальное внимание в затылочной коре головного мозга 124 | глава 9 — Как с помощью дизайна можно привлечь внимание наших поль- зователей к тому, что они ищут? Мы поговорим не только о том, куда смотрят покупатели и что они надеются там увидеть, но и о том, каким образом эта информация позволяет судить о визуальных явлениях, привлекающих их вни- мание. Мы выясним, удается ли потребителям найти то, что они надеются найти, с чем они сравнивают ваш продукт и какие цели они перед собой ставят. Куда они смотрят? Айтрекинг может сказать многое, но не все Когда речь заходит о совершенствовании интерфейсов или услуг, мы обычно начинаем с того, куда смотрят участники наших экс- периментов. Если мы говорим об интерфейсе, то на какой участок монитора смотрят участники? Или на что они обращают внимание, работая с приложением? Устройства для айтрекинга и цифровые тепловые карты очень полезны на этом этапе анализа. Они помогут точно установить, на что именно смотрят участники. Это позволяет правильно раз- местить контент на страницах сайта. Но далеко не всегда стоит отслеживать направление взгляда, если можно применить старые добрые методы наблюдения вроде тех, о которых мы говорили в предыдущей главе. Проводя контекстное интервью, я стараюсь разместиться под углом примерно 90 граду- сов относительно участника (так, чтобы держаться слегка позади и не отвлекать его от работы, как показано на рис. 9.2). Для этого есть несколько причин: Людям слегка неудобно разговаривать со мной, оглядываясь назад. Это означает, что главным образом они смотрят на монитор или на то, с чем работают, а не на меня (одновременно позволяя мне лучше рассмотреть, что они делают, по каким иконкам кли- кают и т. п.). визуальное восПриятие: вЫ на меня смотрите? | 125 РИС. 9.2. Проведение контекстного интервью Мне хорошо видно, на что они смотрят. Конечно, не со стопроцент- ной точностью, но я вижу, смотрят ли они на верхний или на ниж- ний край экрана или, скажем, на лист бумаги рядом с монитором. Чтобы проанализировать, к чему прикованы глаза участников, давайте посмотрим на рис. 9.3. На картинке слева показаны четыре пары часов, и под каждой из них — две кнопки. Хотя вы с первого взгляда определяете, что это именно кнопки, их визуальные характеристики и масштабы не позволяют судить, какая из них — кнопка «Купить», а какая — «Сохранить для сравнения». Последняя должна быть второстепен- ной, но при таком дизайне страницы она привлекает столько же внимания, сколько и кнопка «Купить». Эту проблему следует решать совместно с графическим дизайнером. 126 | глава 9 Неочевидно, что здесь главное, а что второсте- пенное Главные элементы теряются на пло- щади монитора Неочевидно, что здесь главное, а что второсте- пенное Главные элементы теряются на пло- щади монитора РИС. 9.3. к чему прикованы взгляд и внимание участника, когда он смотрит на изображение На картинке справа кнопки недостаточно контрастны, чтобы при- влечь к себе внимание, они теряются на общем фоне, а значит, их легко не заметить. Деловая ситуация: служба безопасности Проблема. Хотя большинство моих примеров связано с цифро- выми интерфейсами, дизайнерам продуктов и услуг стоит смотреть на вопросы привлечения внимания более широко. В этом случае визуальное восПриятие: вЫ на меня смотрите? | 127 я работал с группой сотрудников, на которых лежит колоссальная ответственность: они обеспечивают безопасность в крупном фут- больном клубе (в том числе на большом стадионе). Я обнаружил, что их внимание рассеивается между большим количеством объ- ектов. В клубе имеется множество различных систем и инструмен- тов обеспечения безопасности (сигналов тревоги, звонков и прочих звуковых сигналов), и в обязанности службы безопасности входит их постоянный контроль. — Сотни камер, количество которых постоянно растет. — Специальные камеры, направленные на проблемные места (например, дверь, через которую люди просачиваются в задние ряды кресел). — Рации, по которым пешие патрули постоянно передают информацию. — Электронная почта. — Текстовые сообщения. — Переговоры местной полиции (обеспечивающие постоянную коммуникацию). — Бесконтактные магнитные замки (которые постоянно пищат). — Система радиовещания. — Пожарная сигнализация. — Тревожные системы в лифтах. — Электрические сигнальные системы. — Кабельная сеть передачи новостей. — Телефонные узлы. 128 | глава 9 Если вы удивляетесь, как сотрудникам службы безопасно- сти удается выполнять свою работу в столь сложной и насы- щенной информацией среде, то вы не одиноки — я тоже пора- жен и не совсем уверен, что эти шумные системы помогают им в работе больше, чем мешают. Это прекрасный пример рабо- чей обстановки, требующей распределенного внимания, при- чем отвлекающих факторов здесь куда больше, чем в типич- ном опенспейсе (в котором, как многие считают, трудно сосредоточиться). Рекомендации. При таком количестве визуальных и звуковых отвлекающих факторов важно выделять наиболее важный из них в каждый конкретный момент. Именно на этом факторе должно сосредоточиваться внимание сотрудников. Моя команда разра- ботала систему, весьма похожую на ленту новостей Facebook, но снабженную сложной системой фильтров, гарантирующих попадание в ленту только действительно важной информации (никаких котиков!). Для каждой потенциальной проблемы (тер- рористический акт, пожар, заклинивание двери и т. п.) разра- ботана специальная последовательность действий, и персонал должен идентифицировать конкретное место, где возникает та или иная проблема. Система также включает перечень при- оритетов на данный момент, чтобы помочь сотрудникам спра- виться с огромным количеством событий, требующих их внима- ния. Лента имеет механизм прокручивания и может быть настро- ена на выделение событий какого-либо одного типа или всех типов одновременно, но только после того, как они достигнут определенного уровня важности. В результате сотрудники знают, на что обращать внимание в первую очередь и как звучит насто- ящий сигнал тревоги. Тепловые карты Тепловая карта движений взгляда показывает участки интер- фейса, на которых дольше всего задерживается взгляд участника. Чем дольше человек рассматривает тот или иной участок мони- тора, тем более теплым цветом он выделяется (рис. 9.4). визуальное восПриятие: вЫ на меня смотрите? | 129 Деловая ситуация: иерархия сайтов Проблема. Когда участникам эксперимента предъявили ори- гинальную версию сайта, изображенного на рис. 9.4 слева (Comcast.net — предшественник Xfinity), те, к нашему удивлению, уставились всего лишь на один элемент интерфейса в верхнем левом углу, игнорируя при этом нижнюю и правую часть страницы. Это подтверждал и айтрекинг, и тот факт, что по ссылкам на сайт нашего партнера, расположенным внизу страницы, никто не кли- кал (нельзя сказать, чтобы партнера это радовало). Проблема заключалась в визуальном контрасте. Верхний левый угол пре- дыдущей версии интерфейса не только отличался более темным цветом, но и был более интересным: здесь располагалось больше видео и картинок, на которые реагировали системы визуального восприятия участников. |