Артефакты: карты сценариев

Описание

Карта сценария (англ. scenario map, design map) – это инструмент, позволяющий визуализировать, обсуждать и оптимизировать сценарии взаимодействия. В карте отражены шаги сценария, с вопросами, комментариями и идеями по каждому из них.

Карта сценария может быть использована как для анализа уже существующего процесса (reality map), так и для проектируемого, желаемого взаимодействия (design map).

Continue reading

Артефакты: карты путешествия потребителя

journeyОписание
Карта путешествия потребителя (англ. customer journey map, experience map, далее – CJM) – это инструмент визуализации взаимодействия потребителя с продуктом или услугой. Создание CJM – это одновременно и процесс анализа, и метод генерации идей по совершенствованию продукта/услуги.

CJM отображает взаимодействие, развёртываемое во времени, разложенное на атомарные составляющие. Составляющие взаимодействия относятся как к процессу (цели и задачи потребителей, их действия, ожидаемый результат, проблемы и барьеры, препятствующие переходу на следующий шаг, точки касания (touchpoints), материалы, инструменты, оборудование, KPI с точки зрения бизнеса и т.д.), так и к психоэмоциональному состоянию потребителя (мысли, чувства, эмоции).

Continue reading

Артефакты: сценарии

FilmОписание

Сценарий (англ. scenario) – это описание того, как пользователь взаимодействует с продуктом для достижения своей цели в соответствующем контексте. Сценарии могут быть как художественными – с описанием деталей взаимодействия и контекста, так и техническими, напоминающими алгоритмы.

В терминологии есть некоторая путаница – под «сценариями» могут иметь в виду разные инструменты, от пользовательских историй и до вариантов использования. Авторы книги Designing Interactive Systems – People, Activities, Contexts, Technologies Benyon, Turner и Turner предложили отличное объяснение того, как разные виды сценариев связаны между собой и для каких целей служат. Они выделяют 4 вида сценариев в зависимости от этапа проекта и целей их создания: пользовательские истории, концептуальные сценарии, конкретные сценарии и варианты использования.

Continue reading

Артефакты: персонажи

doctor-personaОписание

Персонаж (персона, англ. Persona) – это архетип пользователя, представляющий определенную поведенческую модель. Иными словами, это описание группы пользователей с их ожиданиями, переживаниями, опытом, потребностями, воплощенное в одном фиктивном профиле.

Continue reading

Артефакты: карта эмпатии

Описание

Карта эмпатии (англ. empathy map)  – инструмент визуализации идей, разработанный компанией XPLANE, позволяющий поставить себя на место пользователя, взглянуть на проблему, которую решает ваш продукт, его глазами. Может быть использован как в качестве альтернативы персонажам, так и как дополнение к ним. Карта эмпатии представляет собой схему, в центре которой размещается представитель определенного пользовательского сегмента, по разные стороны от него – 4 блока (“думаю и чувствую”, “говорю и делаю”, “вижу”, “слышу”). Выводы приводятся в двух дополнительных блоках: “проблемы и болевые точки” и “ценности и достижения”.

Примеры

В качестве примера я набросала карту эмпатии, которая описывает проблему поиска UX специалиста в команду:

Continue reading

Артефакты: макеты UI (wireframes)

Описание

Макет интерфейса (англ. wireframe, русск. некрасивое вайер, каркас) – это статическая схематическая иллюстрация страницы (формы), на которой отображено расположение и содержание отдельных элементов интерфейса пользователя (UI). Задача макета – показать содержание конкретной страницы, взаимное расположение блоков и отдельных элементов. В абсолютном большинстве случаев макеты интерфейса не раскрывают особенностей визуального дизайна (используются черный/белый цвет и их оттенки, стандартные шрифты, простейшие иконки).

Ближайшими родственниками макетов являются эскизы или наброски (sketches, скетчи), прототипы, дизайн-макеты (mockups). Соотношение между всеми этими артефактами я постаралась показать на картинке:

Итак, в зависимости от детализации артефакта, можно выделить 3 варианта: скетч, собственно макет (wireframe) и дизайн-макет (mockup). Каждый из этих вариантов можно сделать динамическим, превратив его в прототип интерфейса.

Continue reading

Артефакты: отчет по юзабилити-аудиту

Описание

Юзабилити-аудит (usability review) – это процесс и результат экспертной оценки информационной системы (веб-сайт, веб-приложение, мобильное, настольное приложение и т.п.) либо ее прототипа на предмет удобства использования.

В процессе оценки могут быть использованы самые разные техники, но самая популярная – оценка по эвристикам (де-факто в большинстве случаев – по эвристикам Якоба Нильсена). В этом случае вместо «аудит» говорят «эвристическая оценка» (heuristic evaluation).

Кроме эвристической оценки, достаточно популярна также оценка по проверочным спискам (чек-листам, checklists). Популярность техники понятна, учитывая, что ее использование не требует от эксперта никаких особых навыков, кроме умения читать. Но полезный выхлоп от такой оценки сравнительно невелик: во-первых, сам список правил в таком чек-листе порой вызывает много вопросов. К примеру, вы видите пункт в духе «На всем сайте используется единый принцип выравнивания», но никаких пояснений, почему это важно, когда это важно, а когда этим можно пренебречь, в чек-листе вы не найдете. Во-вторых, многие пункты в чек-листах зачастую оказываются не применимыми к конкретной ситуации. Каждая система (сайт, приложение) индивидуальна и обладает особенностями, которые не покрывают никакие чек-листы. В общем, этот метод хорош для поиска мелких ошибок (опечатки в тексте, некликабельные логотипы), но не более.

К более сложным и полезным техникам можно отнести экспертизу компонентов (feature inspection). В этом случае эксперту на вход дается описание пользователей (желательно – в формате персонажей), описание контекста использования, а также список основных пользовательских сценариев. Затем эксперт проходит последовательно по всем сценариям и отвечает на следующие вопросы:

  1. Как ускорить работу данных пользователей в данном контексте?
  2. Как снизить число ошибок данных пользователей в данном контексте?
  3. Как повысить удовлетворенность данных пользователей в данном контексте?
  4. Как сделать интерфейс понятнее данным пользователям, чтобы повысить скорость обучения в данном контексте?

Главное преимущество этого метода – учет особенностей пользователей и контекста в процессе оценки.

Разумеется, это не все существующие техники, но как показывает мой опыт, чаще всего используются именно они.

Примеры

Вместо примера привожу шаблон отчета, который используем мы. Continue reading

Артефакты: референсные подборки и мудборды

Описание

Референсная подборка (design reference) создается в начале работы над визуальным дизайном и представляет собой компиляцию изображений, на которые затем дизайнер будет опираться при создании дизайн-макета. В нее могут входить примеры цветовых схем, шрифтов, оформления отдельных  блоков,  фотографий в интерфейсе, компоновки и отдельных графических элементов.

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

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

Понятия иногда используют взаимозаменяемо.

Примеры:

 

Continue reading