fbpx

Почему нельзя проектировать интерфейсы только по референсам. Пример из практики.

почему нельзя проектировать интерфейсы только по референсам

Часто дизайнерам советуют обращаться к референсам перед началом проектирования интерфейсов. В этом есть свои преимущества:

  • Можно найти интересные дизайн решения и адаптировать их под свои задачи;
  • Вдохновится стилем и общей концепцией похожих интерфейсов;

Но есть и обратная сторона медали: появляется соблазн слепо скопировать понравившийся паттерн и не углубляться в суть СВОЕЙ задачи. В итоге это может негативно отразиться, например, на конверсии или на удовлетворенности пользователей вашим интерфейсом. 

Пример из практики

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


Наш сервис интегрируется с CRM и все входящие сообщения из Директа можно просматривать прямо в CRM. Чтобы не вдаваться в детали скажу, что Инстаграм может блокировать аккаунты, если с него работают под разными IP.

А это частый кейс в компаниях, когда менеджеры заходят в один аккаунт с разных устройств. В итоге повышается риск бана аккаунта. Для компании Инстаграм-аккаунт — это их актив, который не хотелось бы терять из-за бана.

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


Так вот, если бы мы пошли по пути «посмотреть референс — спроектировать что-то похожее», то у нас бы получилась форма на подобии вот этой.

картинка 1

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

картинка 2
Пример добавления нового аккаунта в гугл-почте

В нашем случае это телефон или логин и пароль от аккаунта инстаграм.

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

С этого момента и начинается проектирование с пониманием СВОЕЙ задачи. В нашем случае нам нужно:

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

В итоге у нас получилась форма из двух шагов. На первом шаге у нас и речи нет, про добавление аккаунта. Там мы поместили только то, что касается прокси:

картинка 3

  • Информационный Алерт, который говорит о том, что сначала лучше подключить прокси;
  • Ссылка на help, в которой расписана подробная статья с картинками что такое прокси и зачем он нужен (для тех, кто не знает). Ссылку специально сделали длинной, чтобы, во-первых, она была более заметной, во-вторых, покрывала все основные вопросы по поводу прокси;
  • Необходимые поля для подключения прокси, чтобы можно было сразу добавить аккаунт в «безопасном режиме»;
  • Также учли и то, что некоторые пользователи не захотят заморачиваться с подключением прокси. На этот случай предусмотрели кнопку «Пропустить», чтобы можно было на свой страх и риск сразу перейти к добавлению Инстаграм-аккаунта;

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

картинка 4

Резюме

Используйте референсы, как дополнительный инструмент в своей работе, а не как основной. Обязательно вникайте в суть СВОЕЙ задачи и только после этого приступайте к проектированию.

Спасибо, что дочитали до конца.

Не забудьте подписаться на мой YouTube и Telegram. Там еще больше полезного материала про дизайн интерфейсов.

Комментарии 1

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

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