Мы хотели начать этот материал с обратного, рассказать о том, что не нужно делать в разработке сайтов и приложений. Но решили сказать о том, как делать дизайн полезным и удобным. Здесь мы опишем 5 техник брейншторма и сбора информации, которые помогут тебе создать основу сильного и удобного интерфейса.

Я пилю лендинги по шаблону, зачем мне это?

Здесь не о цветах и шрифтах, а о фундаменте – информации. Знания о ресерче и построении тематической карты, диаграмм сходства, интервью целевой аудитории пригодятся тебе, чтобы сделать крутой стартап или попасть в команду профи.

Брейншторм, аватар аудитории и польза продукта

В основе удобного, понятного и сильного дизайна – информация об аудитории, ее боли и продуктах конкурентов. Затем: о UI/UX-карте и визуальной части собственного проекта – сайта или приложения.
Чтобы понять, что болит у нашего юзера нужно знать кто он, составить аватар целевой аудитории. В фундаменте аватара 6 ключевых вопросов:

  1. Персональные данные: возраст, пол, семейный статус, дети, профессия, образование, доход.
  2. Ценности и жизненные цели.
  3. Источники информации: что читает и смотрит, на кого подписан в соц. сетях.
  4. Трудности и боли: какие проблемы и задачи решает ежедневно.
  5. Решения трудностей: какими продуктами пользуется, чтобы “закрыть” боли.
  6. Вкусы и предпочтения: любимые бренды, рестораны, места отдыха.

Дальше: определить боль целевой аудитории и попасть в ее решение. Чем польза нашего продукта отличается от конкурентного и как сделать ее уникальной? Так, скорее всего, мыслили разработчики IKEA PLACE – приложения дополненной реальности, которое не просто показывает пользователю мебель в каталоге, а помещает предмет в пространство комнаты.

ПОСЛЕ ШТОРМА – СТРУКТУРИРУЙ

Брейнштормить тоже нужно правильно. Есть техника Диаграммы сходства и работает это так:

  • Собираешь фокус-группу.
  • Формируешь пул вопросов по проекту: функции, айдентика, tone of voice.
  • Участники записывают ответы в течение 30-60 минут.
  • Ответы группируются по каждому вопросу отдельно.

В классическом формате Диаграммы сходства – это белая доска и набор стикеров. На пункте 2 – формировании вопросов – вопросы записываются на стикеры и клеятся на доску. Таким образом создаются категории будущего проекта. Во время пункта 4 участники наклеивают ответы в нужные группы. Главное условие: каждый ответ должен нести максимальную пользу и идти от абстрактного к точному.

Вопрос: мы делаем интернет-магазин косметики на рус-укр аудиторию. Как нам увеличить доверие клиентов и сделать сервис лучше, чем у конкурентов?

Ответ: сделаем возможность “примерить” декоративную косметику. Как одежду в магазинах. Чтобы цвет и блеск, например, помады, менялся на губах модели. А к ароматам кроме текстового описания подберем еще и видео, чтобы погрузить в опыт.

Вместо стикеров, маркеров и белой доски для Диаграмм сходства вполне подойдет Whiteboard Miro – это то же самое, только виртуально. 

UX MAP: КАРТЫ ПУТЕШЕСТВИЯ ПОЛЬЗОВАТЕЛЯ

User Experience Map – это то, каким будет опыт пользователя при взаимодействии с твоим проектом. Есть 3 типа таких карт:

  1. Карта эмпатии: что чувствует, думает, говорит и делает пользователь.
  2. Карта путешествия клиента: пользователь определяет потребность, сравнивает, торгуется и выбирает.
  3. Карта опыта: это визуализация непрерывного опыта, через который проходит пользователь для достижения цели.

КАРТА ЭМПАТИИ

Карта эмпатии поможет тебе понять настрой пользователя. Его чувства, ожидания, мысли и мотивацию к действиям по отношению к твоему продукту. Поможет вызвать эмпатию к продукту.

  • Карта разделена на 4 сектора: «Говорит», «думает», «чувствует», «делает».
  • В основе – аватар пользователя.
  • Показывает точку зрения пользователя на задачи, связанные с продуктом.

КАРТА ПУТЕШЕСТВИЯ

Составление карты путешествия начинается с компиляции целей и действий пользователя. Затем основа дополняется мыслями и эмоциями, чтобы создать повествование. Повествование превращается в визуализацию, используемую для передачи идей, которые будут использоваться в процессах проектирования. Карта помогает определить конкретные точки взаимодействия с клиентом, которые вызывают боль или удовольствие. Убрать разрозненность и понять пути юзера.

  • Карта разделена на 4 дорожки: фазы, действия, мысли, установки/эмоции.
  • Карта отражает точку зрения пользователя, образ мышления, мысли и эмоции.
  • В основе – аватар пользователя.

ДаБудетСайт | Студия веб-дизайна | Смоленск

+7 (910) 717-72-30
https://dabudetsite.ru

0 ответы

Ответить

Хотите присоединиться к обсуждению?
Не стесняйтесь вносить свой вклад!

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *