Представьте, что вы создаете дизайн социальной сети, которая помогает поварам обмениваться рецептами с экзотическими ингредиентами. Проведя исследование, вы разработали подробнейшую персону (Пьер, шеф-новатор, работающий в ресторане изысканной кухни) и определили свое положение на рынке. Вы хорошо знакомы с индустрией и вам понятны цели проекта. Самое время приступить к дизайну. Но с чего вы начнете? Спланируете ли вы процесс привлечения шеф-поваров? Ведь без них не будет и социальной сети. Поэтому стоит убедиться, что первое взаимодействие с ними будет замечательным. Возможно, вы начнете с самого популярного действия: публикации нового рецепта. А потом перейдете к опыту поиска – как другие шеф-повара будут искать новые рецепты. Многие дизайнеры начинают работу с планирования путешествия клиента, понимания, как кто-то будет использовать готовый продукт. Одно взаимодействие направляет лиды в другой поток взаимодействия. Вскоре получается целая сеть потоков. Добавьте к ней навигацию, и продукт готов. Однако при таком подходе (с ориентацией на действия) существует одна проблема. Дизайнеры планируют действия, не понимая, на что они направлены. У них есть субъект (пользователь) и глагол (действие). Но где же объект? Когда мы сразу переходим к действию, то рискуем создать продукт с размытым отражением ментальной модели пользователя. Определив же объект, мы можем создать более реальный и приятный пользовательский опыт. Для начала нужно определить своего пользователя, понять, кто он. Затем создать его ментальную модель, в которую входят все объекты, из которых состоит проблема, и которые пользователь видит в качестве части ее решения, а также отношения этих объектов друг к другу. Затем, наконец, создаются взаимодействия. Это и есть OOUX – ориентированный на объект пользовательский опыт. В этой статье мы рассмотрим, как перейти от создания объектов к дизайну взаимодействий, используя простой инструмент – список CTA.

Что такое список CTA и почему это важно?

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

• думать о взаимодействиях креативно
• проверять эти взаимодействия
• создавать более точную смету проекта

Давайте рассмотрим эти три преимущества подробнее.

Творческие вызовы и более эффективный мозговой штурм

Простое понимание ваших объектов поможет определить, что пользователи могут с ними делать. Кода мы думаем о взаимодействии в контексте объектов, мы создаем основу для мозгового штурма. При использовании этого подхода мы ярче проявляем свою креативность и реже упускаем из вида важные моменты. Например, давайте подумаем об объекте «ингредиент» в нашем приложении для шеф-поваров. Что может Пьер захотеть сделать с ингредиентами?

• Добавить ингредиент в избранное
• Обозначить себя экспертом по ингредиенту
• Добавить ингредиент в корзину
• Проверить наличие ингредиента в местных магазинах
• Получать уведомления о новых рецептах с этим ингредиентом
• Написать совет по использованию этого ингредиента

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

Ранняя проверка действий

Хорошие новости: вы можете протестировать систему объектов и действия еще до того, как потратите часы на дизайн взаимодействия. Создайте прототип, который позволит пользователям переходить от одного объекта к другому. Наблюдая и проведя интервью, убедитесь, что ваша система соответствует их ментальной модели. Вы подобрали правильные объекты? Их взаимоотношения имеют смысл? К объектам ведут правильные «кнопки»? Имея подобный прототип, вы можете обсудить функциональность с пользователями, без необходимости создания прототипов взаимодействий.

Более точная оценка стоимости

Дизайн взаимодействий отнимает много времени и ресурсов. Необходимо заранее продумать все возможные проблемы и ошибки, учесть множество факторов. Объем и сложность дизайна взаимодействия будет влиять на сроки, бюджет и требования к персоналу. Со списком CTA вы можете быть уверены, что имеете четкое понимание предстоящего фронта работ. Вы можете предсказать возможные трудности и лучше к ним подготовиться. Звучит многообещающе. Но как же создать список CTA? Начнем со схемы, затем обсудим создание официальной и подробной версии.

Список CTA: схема

Для начала необходимо создать карту объектов. Для этого:

• Вычлените общие элементы из целей продукта
• Определите элементы объектов (основное содержание, метаданные, вложенные объекты)
• Расставьте приоритеты

В результате получится нечто похожее: Синие стикеры в рамочке – объекты, желтые – основное содержание, розовые – метаданные, синие стикеры без рамочки – вложенные объекты. Как только вы создадите карту объектов, продумайте, какой призыв к действию будет относиться к каждому объекту. Для CTA – зеленые стикеры. CTA лучше обсудить со всеми командами проекта, собрав идеи о том, какие действия пользователи могут совершать над объектами. Для этого просто нужно подумать о том, какие кнопки должны вести к объектам. На каждый объект может потребоваться 10-15 минут, поэтому отведите на мозговой штурм час или два, если в вашей системе 3-5 объектов. Вы удивитесь, сколько идей вам удастся сгенерировать. Однако будьте готовы к тому, что в результате обсуждения вы захотите пересмотреть некоторые цели.

Список CTA: официальная версия

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

• Зачем нужен этот призыв к действию? Какова его цель, к реализации какой пользовательской или бизнес-цели он ведет?
• Кто будет взаимодействовать с этим призывом к действию? Определенная персона или тип пользователя? Кто-то со специальным доступом или ролью?
• Где будет находиться призыв к действию? Где пользователь будет ожидать его увидеть? Есть ли еще необычные варианты размещения, которые будут отвечать нуждам пользователя?
• Насколько сложным будет поток взаимодействия, к которому ведет призыв к действию? Как много усилий должен будет приложить пользователь?
• Какие потоки взаимодействия являются приоритетными? Какой нужно запустить обязательно, какой отложить до следующей фазы, а какой нуждается в тестировании и доработке?
• Какие вопросы и сомнения вызывает этот призыв к действию?

Создайте ориентированный на объекты прототип и протестируйте ментальную модель с пользователями. Убедитесь, что подобрали подходящие входные точки для взаимодействий. Так будет намного проще предугадать действия пользователя после нажатия кнопки.

Основа функционального дизайна

Итак, вы создали систему объектов и список CTA, разработали прототип системы. Ваш прототип опробовали реальные пользователи: они легко переходят от объекта к объекту, призывы к действию отвечают их нуждам. Замечательно! Но OOUX и список CTA не помогут вам спроектировать сами взаимодействия. Вам все же придется выполнить эту тяжелую работу. Однако если вы будете разрабатывать их на основе потоков взаимодействия, то можете быть уверены в результате. Что более важно, при таком подходе для пользователей навигация будет менее абстрактной и запутанной. Они будут знать, что они делают и зачем. К тому же OOUX позволит сделать процесс дизайна более элегантным, оптимизированным и ориентированным на пользователя.