Что Проанализировать Перед Проектированием Интерфейса

Давно прошли те времена, когда можно было просто начать рисовать веб-сайт или приложение.

Даже самый простой интерфейс требует хотя бы примитивного этапа анализа.

Многие дизайнеры имеют свои методы анализа, а другие оставляют это на усмотрение аналитиков и не включаются в процесс сами.

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

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

Делюсь своим шаблоном и надеюсь увидеть ваши дополнения в комментариях.

Сразу оговорюсь, что эта статья не о бизнес- или системном анализе, а именно о «дизайн-анализе».

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

Такие пункты я буду отмечать словом «Редизайн».

Анализ также подходит для проектирования интерфейса чего угодно — сайта или приложения.

Поэтому я буду везде писать «Интерфейс», имея в виду, что вы подставите то, что вам нужно.

Кому лень читать, то вот пример презентации моего этапа анализа .



Спросите клиента

Самый логичный момент — спросить клиента, что уже есть, а что конкретно ему не нравится и, самое главное, почему ему это не нравится.

Даже если сразу видно, что текущий интерфейс ужасен, обязательно стоит поинтересоваться, почему клиент затеял редизайн.

Могут возникнуть неочевидные моменты.



Список моих стандартных вопросов:

  • Есть ли у вас логотип/бренд, которого стоит придерживаться? Иногда есть стиль и логотип, но клиент позволяет их игнорировать.

    Особенно полезная информация, если логотип отстой.

  • Что вы хотите изменить в интерфейсе и почему? Определяемся с основным объёмом работ.
  • Кого вы считаете своим главным конкурентом? Это будет полезно на следующих этапах анализа.

  • Есть ли у вас выгодное отличие от конкурентов? Возможно, это редкость, но иногда оказывается, что оно действительно существует.
  • Приведите пример интерфейсов, которые вам нравятся, и объясните, почему.

    Почему это очень важно.

    Может оказаться, что клиенту нравится не сайт в целом, а какая-то его часть, например, белый фон, который у него ассоциируется с «легкостью дизайна».

  • Вам нужно мобильное приложение/сайт? Основы для развития проекта.

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

    Но у клиента может быть другая точка зрения.

    К тому же адаптация интерфейса под телефон — отдельная задача.

  • Можете ли вы предоставить Гостевой доступ к Яндекс.

    Метрике или Google Analytics для этапа анализа? Главное сразу уточнить, что это всего лишь гостевой доступ и взломать вы ничего не сможете и никому не передадите сверхсекретные данные.

    Клиенты часто этого не понимают и им кажется, что предоставление доступа к Я.

    Метрика — это как отдать ключи от квартиры, где есть деньги.



Анализ Я.

Метрики/Google Analytics

Я, как истинный патриот и старообрядец, отдаю предпочтение Я.

Метрика.

Главным образом потому, что интерфейс Google Analytics отстой и нет вебвизора.



Что я смотрю в Метрике:

  • Конверсия .

    Если цели поставлены.

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

  • Карты .

    Все карточки, включая Form Analytics.

  • Отказы.

    Общий .

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

  • Отказы по целевым запросам .

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

    Поясню: «отказ по целевому запросу» означает, что я пришел на сайт по продаже вакцин от Covid19 по запросу «Вакцина от Covid19. Купить недорого», но я почему-то не понял, что попал в нужное место и сразу ушел с сайта.

    Это явно означает, что сайт не понятен с первых секунд и клиент теряет клиентов.

  • Поисковые запросы .

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

  • Статистика по устройствам ввода .

    Полезно, чтобы доказать клиенту, что ему нужен мобильный телефон.

    версию, если бы он вдруг отказался от нее на этапе Анкеты.

    Это также даст вам понимание, в каком разрешении его рисовать.

  • Пол и возраст основных посетителей .

    Это будет полезно на следующем этапе анализа.



Пользовательские сценарии

Один из моих любимых пунктов анализа.

Довольно творческий этап, отличающийся от предыдущих и чертовски полезный.

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

Для создания сценария я создаю Карту пользователя.



Вот из чего он состоит:

  • Полное имя и возраст .

    На основе данных предыдущего шага по Метрике.

  • Проблема/цель .

    Описание того, почему пользователь открыл наш интерфейс.

  • Как я пришел на сайт .

    Например, я ввел в Google «Купить вакцину от Covid19».

    Запросы я беру не из воздуха, а из Метрики.

  • Страница авторизации .

    Его дальнейший путь во многом зависит от того, на какую страницу попадает пользователь.

    Пользователь не всегда попадает на главную страницу.

  • Устройство .

    Мы принимаем его на основе показателей.

    Многое в дизайне зависит от устройства, с которого пользователь работает с интерфейсом.

  • Желаемое целевое действие .

    То, что мы уже хотим получить от пользователя.

    Например, мы хотим, чтобы он заполнил какую-то форму или нажал кнопку.

Пишу скрипт на основе этой карты.



Из чего состоит скрипт:

  • От целей посетителя, описанных в Карте
  • Из оценки текущего Интерфейса (Редизайн) .

    Смотрим текущий интерфейс и пытаемся получить из него то, что написано в Карточке пользователя.

    Отметим основные узкие места.

  • Из «наблюдений» за успешными внедрениями .

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

Я пишу три-пять сценариев.

Я пытаюсь описать: стандарт; комплексный (покупка не одного товара, а нескольких с разными характеристиками); не стандартный (вход пользователя с какой-то страницы или устройства, не подходящего для этой цели).

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



Конкуренты

На вопрос о конкурентах есть два классических ответа: «Конкурентов у нас нет»; «Мы конкурируем со всеми».

Ни то, ни другое, конечно, не верно, поэтому надо копать глубже.

Именно поэтому вопрос стоит в Анкете.

Анализируя конкурентов, я записываю только то, что можно у них почерпнуть.

Перечислять недостатки нет смысла.

Ничего полезного нам это не даст. Я открываю интерфейсы конкурентов и пытаюсь использовать их на основе пользовательских сценариев.

Ведь если это действительно конкурент, то его целевая аудитория примерно такая же.

Пару раз клиенты с легкой иронией в голосе говорили что-то вроде: " Ох, ладно.

Вы просто взяли у кого-то там то, что видели, и применили это к нам.

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

К счастью, это происходило не часто.

После этого я специально к изложению анализа добавил фразу ".

Можно поучиться у конкурентов «Сразу скажу, если надо, то да, именно это и возьму, не смущаясь, что там это уже кто-то делает. Помимо анализа конкурентов, я также анализирую смежные направления.

Например, для интерфейса о здоровом питании вы также можете посмотреть интерфейсы о подсчете калорий.

Иногда это полезно.



Карта интерфейса

Многие называют карту интерфейса по-разному.

Вы можете назвать это структурой, информационной архитектурой, иерархией, картой сайта/приложения или подобными терминами.

Суть та же — описание связей между страницами/экранами текущего интерфейса.

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

На выходе две карты: «Как есть» и «Как должно быть».



Стилистические примеры

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

Целесообразно постараться найти примеры на ту же или близкую к теме клиента тематику.

Это облегчит клиенту понимание сути этих картинок.

У меня были случаи, когда достойных примеров в теме просто не было и я брал что-то нейтральное.

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

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

Это нужно для того, чтобы у него в голове было четкое понимание того, какой стиль ему следует ожидать в итоге.

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



Каков результат?

По окончании всех этапов я собираю презентацию в Google Slides и показываю ее клиенту.

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

.

Если презентация полностью пропущена, то нужно понять, как это произошло, и сделать новую.

Но со мной этого никогда не случалось.

И даже если бы это произошло, то лучше было бы на этом этапе, чем на более позднем этапе.



Что мы получаем на этапе анализа?

  • Клиент стал немного яснее чего ожидать в итоге;
  • Дизайнеру стало понятнее, как и зачем это делать;
  • Дизайнеру легче оценить сложность проекта и оформить заказ.

    почти точное время ;

  • Дизайнеру и заказчику проще сдать/принять результат;
  • Проект станет более продуманным и это хорошо.

Теги: #дизайн #Анализ и проектирование систем #интерфейсы #дизайн сайта #анализ сайта #дизайн приложений #сценарии использования продукта
Вместе с данным постом часто просматривают:

Автор Статьи


Зарегистрирован: 2019-12-10 15:07:06
Баллов опыта: 0
Всего постов на сайте: 0
Всего комментарий на сайте: 0
Dima Manisha

Dima Manisha

Эксперт Wmlog. Профессиональный веб-мастер, SEO-специалист, дизайнер, маркетолог и интернет-предприниматель.