Как правильно проектировать интерфейс/сайт/лендинг

Ваш сайт или суперпродающий лендинг может стоить вам баснословную сумму денег, но быть абсолютно непонятным и неудобным для конечного потребителя, на привлечение которого вы потратите круглую сумму денег. И даже самый дорогой специалист не поможет вам, если не будет понимать главного — кто будет взаимодействовать с продуктом. Как избежать ошибок при проектировании и от чего вы должны отталкиваться, раздумывая над своей идеей?

Лучше всего подход, при котором во главу угла ставится опыт пользователя и дизайнер ставит себя на его место, пытается понять, каким человек увидит продукт показан в серии Top Gear, когда они проектировали машину для пенсионеров. Что они сделали, чтобы построить идеальную машину для пожилого человека?

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

customer development

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

Проектирование, основанное на персонаже

portraits_compiled_small_by_dustsplat-d6lqvfi

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

Вы должны придумать настоящую историю: почему он решил использовать ваш продукт/зайти на ваш сайт, что он делал до этого, что он ожидает получить.


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

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

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

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

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

Как создать персонажа?

__cloning_power___by_misslaurelle-d6lpkhl


Как и в случае с обычными родами, персонаж является результатом предварительной работы, в нашем случае – исследований.

Сперва необходимо провести серию интервью со всеми ответственными сторонами. Такими сторонами могут быть:

  • директора
  • менеджеры
  • консультанты
  • продавцы
  • итд


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

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

На основе полученных данных можно довольно просто определить категории пользователей, выделить типичные стереотипные группы, которые в данном случае помогут нам правильно и грамотно решить задачу. Продолжая тот же вариант с баром, в нём будут разные чеки у любителя ЗОЖ, который носит фитнесс-браслет для того, чтобы узнать, сколько он прошёл, у вегетарианца, пришедшего на ужин и у офисного планктона, который забежал на бизнес-ланч.

Теперь дело за картой эмпатии (Empathy Map). Она необходима для формирования полноценного образа каждого персонажа и выглядит примерно вот так:



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

Чек-лист персонажа

Этот чек-лист позволит облегчить работу, причём не только с точки зрения проектирования, но и с точки зрения обсуждения проекта в команде, потому что куда проще называть придуманного студента-первокурсника Арсения по имени, чем по его группе.

  • Имя
  • Пол
  • Возраст
  • Профессия
  • Средний доход / источник дохода
  • Время суток, когда он взаимодействует с продуктом
  • Ожидания
  • Предыдущий опыт взаимодействия с продуктом/аналогом/конкурентом

Например, если вы проектируете сервис заказа пицца, то одним из персонажей должен быть студент Арсений, который заказывает пиццу домой к себе домой, чтобы покушать вместе с друзьями. Ему 19 лет (потому что он отслужил в армии), сейчас учится на программиста, использует андроид, пиццу заказывает он после 21:00 и до этого ему всегда привозили пиццу не менее, чем за час. Для заказа он позвонил по телефону на сайте.

В голову сразу приходит идея предложить ему (он же позвонил по телефону, верно?) установить приложение на будущее (сказав про бонусную систему), сказать про акцию, что доставка «40 минут или бесплатно» и множество других вариантов.

Что со всем этим делать?

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

Теперь, когда есть понимание целевой аудитории, персонажи и их потребности, появляется поле для настоящей деятельности. Вместо расталкивания по макету стандартных блоков вроде: «почему 99% клиентов выбирают нас», «спешите на акцию», и, что ещё  важнее, вместо того, чтобы расшибать себе лоб, когда никто из клиентов, проходящих мимо ларька со свининой в мусульманском районе, не останавливается, чтобы купить себе свининки, теперь можно будет делать всё по-умному.

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