Mind maps для решения задач пользователя
Работа в команде гениальных творческих личностей – это палка о двух концах. Конечно, страсть и мастерство приводят к отличным дискуссиям, но чрезмерный акцент на собственном таланте может привести к снижению продуктивности. Иногда работа UX-специалистом в команде экспертов-технологов вдохновляет на новые идеи для работы.
Обсуждение функций до разработки дизайна может показаться проблемой, касающейся только клиентов, но мы, творческие люди, тоже от этого не застрахованы. Мы приходим в восторг, находя случайные решения, и еще до того, как мы их находим, рождается интерфейс.
Именно так происходило в моей команде разработчиков. Когда речь заходила об опыте пользовательского взаимодействия, мы часто сталкивались с конфликтом технических деталей и самого интерфейса. Иногда мы забывали, что макет экрана создается не для богов. Мы спорили о том, куда передвинуть кнопку и как переделать всплывающее окно – вместо того, чтобы вернуться к цели экрана. Скоро стало ясно, что нам нужно было серьезно пересмотреть то, что мы собирались предложить пользователю, особенно перед тем, как вдаваться в детали.
С высоты птичьего полета
Зацикливаться на деталях опасно. Но при этом это довольно просто. Обычный дизайн предполагает наличие каркаса, карт сайта, прототипов и пр., и предоставляет разработчикам тему для размышлений, однако он также ограничивает количество дизайнерских решений. Чтобы выбрать правильные идеи в совместной среде разработки, нам изначально нужно было общее представление задач, которые выполняет дизайн.
Диаграммы связей. Широко используемые для мозгового штурма, составления списков, обобщения тем или изучения новой информации, диаграммы связей помогают настроить ассоциативное мышление нелинейным образом.
Моя команда использует их для отображения каждой пользовательской задачи, которую поддерживает приложение. Они переключают внимание с того, куда пользователь должен «пойти», на то, что пользователь пытается сделать. Они напоминают нам, что думать нужно рассказами и описаниями, а не функциями. К тому же, они гибкие: если изменяются реализуемые детали, вместе с ними изменяются и диаграммы связей.
Создайте диаграмму связей
Пока большинство членов команды фокусируются на одном аспекте проекта, диаграммы связей позволяют объединить наши усилия. Они отображают процесс разработки проекта и показывают, насколько проект удобен в использовании в данном состоянии. Они также полезны на каждом этапе проекта: от планирования и тестирования до разработки и контроля качества.
Вот еще несколько преимуществ диаграмм связей:
- Они помогают выделить приоритетные функции. Курт Воннегут однажды сказал, что «каждая строка в рассказе должна продвигать сюжет или раскрывать характер». Таким же образом, все, что мы добавляем на сайт или в приложение, должно вписываться в уже существующий сценарий поведения. Диаграммы связей помогают визуально оценить новые идеи и выделить наиболее важные, основываясь на их значимости.
- Они помогают планировать юзабилити-тестирование. Когда приходит время тестировать продукт на реальных пользователях, ветви диаграммы связей могут служить в роли самостоятельных планов тестирования. Просто выберите несколько ветвей, напишите сценарий тестирования на их основе – и вы готовы к тестированию.
- Они быстро показывают, что мы уже протестировали. В том же ключе, диаграммы связей помогают получить визуальное отображение объемов нашего автоматизированного тестирования, объединяя ветви на диаграмме с названиями файлов функций, которые существуют в нашей автоматизированной системе тестирования.
- Они удерживают в центре внимания конечного пользователя. Вместо того, чтобы фокусироваться на «этом экране» или «той странице», диаграммы связей создают истории: сможет ли пользователь «загрузить фотографии», «зарегистрировать новую учетную запись» или «узнать больше о чем-либо». Так как диаграмма направлена на задачи, она становится своеобразным заменителем пользователя.
- Они гарантируют, что мы запланируем вещи, которые не могут быть запланированы. Часть планирования опыта пользовательского взаимодействия учитывает то, что может выйти за пределы наилучшего сценария. Наша команда использует диаграммы связей для планирования того, где записать полезную копию для ошибок и посмотреть, какие альтернативные пути мы пропустили. Это также неплохое напоминание того, что нужно дать пользователю пути для отступления – включить опцию «отменить» на соответствующих ветвях, чтобы дать пользователю возможность вернуться в любой точке.
- Они предоставляют контролю качества полную картину системы. В конце концов, диаграммы связей помогают нашей команде по контролю качества намного быстрее понять систему и обратить внимание на существенные пограничные случаи. Это также можно использовать в исследовательской проверке качества, чтобы создать быстрый обзор системы, обсудить риски или изменения и отобразить покрытие тестирования.
После того, как вы узнали, насколько полезными оказались диаграммы связей для нас, вам наверняка уже не терпится попробовать их самим. Вы на правильном пути.
Сделайте по-своему
Давайте представим, что мы делаем диаграмму связей для приложения для знакомств – MyDates. Если вы никогда ранее не создавали диаграммы связей, существует множество практических руководств, которые помогут вам разобраться в основах.
При помощи нашей диаграммы связей мы создадим ассоциативный перечень всех функций, используемых в MyDates. На практике, вы можете начать с существующего продукта и работать в обратном направлении, или создать диаграмму связей на этапе планирования.
MyDates позволяет создавать профили с информацией и искать совпадения, просматривая профили других зарегистрированных пользователей. Следующий пример был выполнен при помощи приложения Mind Node для Mac и iPad, в бесплатной и платной версиях.
Начните со списка задач высокого уровня. Для начала, добавьте ветви для каждой крупной задачи, которую поддерживает приложение.
Этот этап может показаться достаточно сложным, если вы первый раз группируете функции в темы. Мне кажется полезным представлять себе, будто я пытаюсь убедить близкого друга пользоваться приложением. Вместо маркетингового хода, где бы я обращал внимание на броские функции, я бы хотел рассказать своему другу, что это приложение принесет в его жизнь.
Не забывайте использовать глаголы. Самые очевидные действия, которые позволяет выполнить MyDates, это:
- Создать профиль,
- Настроить профиль, и
- Искать профили с совпадениями.
Начните предложение с фразы «как пользователь, я могу [глагол]…». В данном случае, это «настроить профиль» и «искать совпадения». Эти две задачи являются наиболее очевидными и основными. Использование глаголов подразумевает фокусирование на действиях, а не на местах.
Далее, расширяйте каждую ветвь. Сфокусируйтесь на каждой ветви и расширьте ее чтобы включить все, что данное приложение может сделать для пользователя в пределах данной функции. Это что-то вроде сортировки функций на определенные ветви. Загрузка фотографии и удаление профиля будут в ветви настройки профиля, подробная информация о других пользователях и просмотр недавних совпадений будут в ветви «искать совпадения».
Фокусируйтесь на потребностях, а не на функциях. Вместо того, чтобы написать «загрузить чей-либо профиль», сделайте «узнать больше о ком-либо». Желание узнать больше о возможных совпадениях является основным, вне зависимости от того, где данная информация отображена. Не стесняйтесь использовать рабочие названия и переименовывайте узлы. Возможно «настроить профиль» будет лучше изменить на «поделиться информацией о себе». Когда я отправляю копию диаграммы остальным, я всегда проверяю, что поставил дату. Таким образом, получатель знает, что моя диаграмма – это работа в процессе.
Включайте только то, что уже есть. Включайте только те задачи, которые уже поддерживаются продуктом, или те, которые сейчас создаются или разрабатываются. Так как приложение растет, используйте пунктирные линии для тех задач, которые еще не полностью выполнены. Это не место для предположений и идей, хотя вы, конечно, можете создать отдельную диаграмму связей только для этого.
Выполните заключительную прогонку. Когда я создаю диаграмму, я часто втягиваюсь в центровые функции и забываю о базовых задачах, таких как регистрация или создание учетной записи. Когда мне кажется, что диаграмма готова, я мысленно прогоняю приложение, как будто я пытаюсь им пользоваться. Это помогает мне понять, чего не хватает. Не забывайте спрашивать себя «как я сюда попал?».
Укажите путь
Не ждите, пока кто-нибудь из вашей команды попросит посмотреть вашу диаграмму связей. Убедитесь, что все, кто работает над проектом, видел ее, и может получить к ней доступ, не спрашивая вас. Лучший способ начать – это познакомить новых членов команды с проектом. Не бойтесь быть прямолинейным. Выделите все центральные моменты, которые может выполнить приложения, пересматривая узлы первого уровня.
Не забудьте оставить диаграмму на виду. Если вы создали диаграмму в середине существующего проекта, достаньте ее во время обсуждения проекта и оставьте на столе. Я доходил до того, что прикалывал диаграмму связей на стену возле своего рабочего стола. Когда кто-нибудь подходил ко мне задать вопрос по проекту, я, отвечая на вопрос, мимоходом указывал на нее. Довольно скоро коллеги начали сами просить меня показать её.
Для нас диаграммы связей стали частью рабочего процесса, так как они заполнили пробел в общении. Достаньте свою диаграмму связей, когда кому-либо нужно освежить память, посмотрите, что уже протестировано, или решите, на что должно быть направлено следующее тестирование. Опыт пользовательского взаимодействия – это совместный труд. Приносите ее с собой на встречи с клиентами. Демонстрация того, над чем вы работаете чтобы сделать обмен информацией проще, не повредит и даже произведет впечатление на вашего клиента.
Чтобы заставить вашу команду беспокоиться об опыте взаимодействия, придется потратить время и силы. Отличный способ провести время – это напомнить всем об общей картине: для кого разрабатывается продукт и чего он позволяет добиться. Диаграммы связей – это отличный и наименее трудоемкий способ сделать это.
Это перевод статьи под названием “Stuck in the Details? Mind Map User Tasks” от Evgenia (Jenny) Grinblo. Перевели в компании UXDepot с одобрением издания UX Booth.
PS от переводчиков: Надеюсь, вам понравилась статья. Мы будем рады, если вы укажете нам на ошибки в переводе, чтобы мы могли их оперативно исправить. Пишите нам по адресу editor@uxfox.ru, пожалуйста 🙂
Все комментарии:
Нет комментариев.
Оставьте комментарий: