Объектно-ориентированный UX или как создать object map
Согласовать продукт с тем, как его используют потребители, — главная задача дизайнера. ООUX поможет нам в этом.
Кажется, вы всё сделали безупречно, и интерфейс вашего продукта — отражение всех законов и правил UX. Углы скруглены, подобрана правильная цветовая палитра, оптимизирован макет и элементы размещены в строгой иерархии… Но пользователи почему‑то с трудом ориентируются на странице и все ещё не удовлетворены результатом. Видимо, проблема кроется намного глубже. Как её выявить и исправить? Именно для этого нам нужно освоить объектно-ориентированный UX.
Что такое OOUX?
Когда пользователь открывает приложение, у него всегда есть определённая цель. Например, отправить письмо, обработать фото или послушать музыку. Подсознательно он уже представляет, что будет делать. Сформированная ментальная модель подсказывает ему, как именно выполнить свою задачу. В идеале структура вашего продукта должна совпадать с этой ментальной моделью — именно так выглядит успешный UX. В противном случае продукт может оказаться слишком сложным и непонятным для пользователя, он не станет разбираться и просто уйдёт к конкурентам. На такой исход мы не согласны, правда?
У пользователя есть сформированные ментальные модели. Источник — Medium
Одна из основных задач дизайнера — структурировать продукт так, чтобы он соответствовал представлению людей о его использовании. Сократить различия между функционалом ресурса и привычным поведением его потребителей — путь к лучшему пользовательскому опыту. Это факт! Вот здесь как раз и выходит на сцену ООUX — объектно-ориентированное проектирование. Звучит сложно, но главное начать.
Итак, первый шаг — понять объекты, которые пользователи будут создавать и редактировать с помощью нашего продукта. Создание object maps оживит эти абстрактные понятия. Они помогут вашей команде определиться с функциями новых продуктов, выявить проблемы в уже существующих, передать сложную информацию визуально доступным способом и принять обоснованные дизайнерские решения. Весь этот процесс называется объектно-ориентированным UX.
Понимание объектов, атрибутов, связей и действий
Карты объектов могут выглядеть довольно сложно. Но в их основе простые элементы и логически понятные принципы. Попробуем разобраться на примере музыкального приложения.
Объекты
Для начала нужно определить, что является объектом. Для этого нам понадобится два простых вопроса:
- Существительное это или глагол?
Что? Снова почувствовали себя за школьной скамьёй? Не пугайтесь. Этот вопрос оправдан. Объекты действительно чаще всего являются существительными. Это люди, места, вещи или, как в нашем случае, песни, плейлисты и альбомы. Глаголы же указывают на действие или состояние и скорее описывают, что будет происходить с объектами, а не сами объекты. Например, пользователям нашего музыкального приложения нужно будет регулировать громкость, искать нужную композицию и сохранять её в плейлистах. Но это всё действия, а не объекты. Поэтому их в нашу карту не вносим.
- Что пользователи с ними делают?
Обычно пользователи контролируют объект, могут создавать его и впоследствии редактировать. Меломаны с помощью нашего музыкального проигрывателя будут формировать плейлисты с песнями и сортировать их по альбомам или исполнителям. Это все объекты, ведь пользователь их создаёт, редактирует, удаляет или использует любым понравившимся ему способом.
Стоит заметить, что большая часть пользовательского интерфейса посвящена элементам управления. Хотя они очень важны, их нельзя отнести к объектам. Это «действия», о которых мы поговорим позже.
Обычно объекты — это существительные
Атрибуты
Суть объекта отражают атрибуты. Это характеристики, которые пользователь может менять, чтобы настроить объекты под себя. Например, в нашем музыкальном приложении это название и обложка альбома, количество плейлистов или отдельных песен в нем. Определив эти атрибуты заранее, мы упростим задачу для пользователя и поможем держать объекты в порядке. Он сможет больше времени уделить приятной музыке, а не техническим настройкам.
Атрибуты раскрывают суть объектов
Связи
Они помогают определить, как один объект связан с другим. Атрибуты и объекты настолько тесно переплетены, что не всегда понятно, что от чего зависит: у исполнителя несколько альбомов или в альбоме песни нескольких исполнителей. Связи формируются и выстраивают определённую структуру, когда один объект содержит другой. Подобно шкатулке или тёке с папкам, один плейлист может содержать несколько песен, а альбом несколько плейлистов. Или как наша База знаний на сайте содержит несколько разделов, в которых можно почитать много полезных материалов. Понятные взаимосвязи между объектами помогут улучшить пользовательский опыт и в будущем принимать более обоснованные согласованные решения. По своему характеру связи бывают двух типов:
- Вложенные (закрытого типа) — когда один объект содержит в себе другой, как атрибут. Часто вложенные объекты выглядят как группа дополнительных атрибутов. Например, плейлист в нашем примере вложен, так как зависит от своего пользователя.
- Взаимосвязанные (открытого типа) используются для независимых объектов. Например, песни. Они могут быть собраны в альбомы или плейлисты. И все же, каждая песня — это отдельный независимый объект, который может существовать сам по себе.
Связи между объектами очень важны
Действия
Последнее в нашем списке, но вовсе не последнее по значению — действия. Это всё, что пользователь может делать с объектами. Создание, удаление и редактирование — только основные из них. В некоторых приложениях могут понадобиться функции совместного использования, копирования, печати или экспорта. По отношению к некоторым объектам действия вообще не применимы. Например, отдельные альбомы могут быть закрыты для редактирования пользователем.
В интерфейсе действия чаще всего отображаются в виде кнопок, и их легко определить как дизайнеру, так и пользователю. Чёткое понимание допустимых действий и как они влияют на объекты поможет в создании макетов и принятии дальнейших дизайнерских решений.
Карта должна показывать возможны действия с объектом
Создаём object map
Начать работу над object map всегда непросто, как и любое новое дело. Не тушуйтесь. Так у всех! Выход один — просто сделать первый шаг и потом продолжать двигаться по намеченному плану. Итак, начнём сначала:
Знание своей работы
Есть такое понятие «jobs-to-be-done» (JTBD). Это фреймворк, который помогает понять мотивы пользователей. Подход, разработанный Гарвардской школой бизнеса на основе работ Клейтона Кристенсена, отлично помогает подвести итог исследованиям пользовательского опыта.
Основной принцип JTBD — пользователь, образно говоря «нанимает», продукт для выполнения нужной ему работы. Что бы то ни было: покупка товаров, предоставление услуг или развлечение, как в случае с музыкальным приложением, понимание того, как и какую работу хочет выполнить пользователь, поможет вам создать действительно эффективную карту объектов.
Список объектов
Вместе с командой поработайте над «поиском существительных», как советует специалист по ООUX София В. Пратер. Чтобы определить объекты, поговорите с пользователями, изучите продукты конкурентов и авторитетные статьи на эту тему, внимательно вычитайте бриф. Будьте сосредоточены на цели. Вместо того, чтобы распыляться на ненужные детали, сфокусируйтесь на поиске соответствующих объектов.
София В. Пратер рекомендует заняться «поиском существительных». Источник — Magzter
Инструменты для «картографии»
Начать можно с Figma. А если вдруг вы ещё не знаете, как в ней работать, то мы создали бесплатный полный курс по этому инструменту, где можно пройти путь «с нифига до мастера» и выичуть Figma за несколько недель. Но помните важное правило — название инструмента по сути не важно. Главное, чтобы этот инструмент упрощал командную работу и итерацию. Помните, мы говорили о важности связей? Так вот, необходимо, чтобы выбранная программа позволяла перемещать объекты без потери взаимосвязей.
Создание карты
Проработав список объектов, вы можете приступать к созданию карты. Разделите все объекты в списке по атрибутам и действиям. Детализируйте их, добавив связи и дополнительные атрибуты. Не ожидайте идеального результата с первого раза. Карта постепенно будет приобретать форму и ясность. Ваша цель — чёткая и понятная структура, каркас, который вы будете дополнять и улучшать с каждой новой итерацией.
Тестирование
Продолжайте общаться с пользователями и проводите глубинные интервью. В самом начале мы говорили, как важно привести UX в согласие с ментальной моделью пользователей. Это длительный, постепенный процесс, в котором вы можете постоянно улучшаться. По мере более глубокого понимания объектов, атрибутов, связей и действий совершенствуйте свою карту и делайте продукт более и более эффективным.
Последние штрихи
Процесс создания карты может быть слегка хаотичным и в конце выглядеть как творческий беспорядок. Знаем, никому не нравится убирать, но уделите время и наведите порядок. Организуйте информацию так, чтобы она легко считывалась и последовательность была понятна. Структурируйте объекты, чтобы их связи шли в одном направлении. Можете использовать цветовую иерархию для выделения разных объектов, атрибутов и связей. Главное — не переборщить. Шести будет более чем достаточно.
Важно навести порядок
Используем object map
Объектно-ориентированный пользовательский опыт поможет понять, а значит, и эффективно справиться с самыми разными проблемами UX. Начните использовать object map на самых ранних этапах работы над проектом и прибегайте к ним в процессе проектирования, чтобы выявить проблемные места и скорректировать направленность работы. Пусть они станут центральной осью вашей командной работы и помогут согласованно двигаться к общей цели — эффективному продукту, который пользователи захотят «нанять» для выполнения своих задач.
Карта объектов поможет выявить необходимые изменения и быстро воплотить их в жизни, независимо от того, нужно ли подкорректировать существующие функции, добавить новые или создать продукт с нуля. Это упростит работу и повысит качество следующих рабочих процессов — создание user flows, wireframes и прототипов. Но это уже тема для следующего раза… Коротко её раскрывает наша «пижамная» мама, Аня, в YouTube-видосе. Обязательно посмотрите и поставьте лайк!
Источник: Medium