Экспресс UX/UI-аудит личного кабинета и маркетплейса для экосистемы Космос

UX/UI
Исследования
Аудит
Личный кабинет
Экосистема
Корпоративный сайт
Classified
E-commerce

«Экосистема Космос» — цифровое инновационного пространство для резидентов, оказывающих услуги в сферах производства, недвижимости, коммерции и финансов.

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

Клиент

Подготовка рекомендаций по их устранению

4

Выявление критичных точек

3

Оценка интуитивности интерфейса, визуальной консистентности и функциональности

2

Анализ пользовательских путей сайта и личного кабинета

1

Задачи

3

Результат

26

50

варианта улучшений предложено
ключевых проблем было выявлено
часов работы UX/UI-дизайнера
Команда и инструменты
UX/UI upper-middle
UX/UI tech lead
Анастасия
Екатерина
Figma, экспертный UX/UI-анализ, бенч-маркетинг
4
Презентация
Рекомендации по всему сайту и прототип одной страницы
1
UX-анализ
Пути пользователя, структуры сайта, контента, функционала
2
UI-анализ
Оценка консистентности визуального дизайна
3
Отчёт по аудиту
Защита перед клиентом с разбором вопросов
Этапы работ

Функциональный анализ элементов

3

2

Анализ пути пользователя, структуры сайта и лк

1

Этап №1

UX-анализ

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

Анализ контента

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

Анализ пути пользователя, структуры сайта и лк

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

Анализ структуры и интерфейса с учётом лучших практик в UX/UI

Найти ключевые точки взаимодействия пользователей с системой и потенциальные узкие места.

Интервью с командой клиента,
заполнение брифа

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

Моделирование основных сценариев использования платформы

возможное решение

Примеры обнаруженных пользовательских барьеров

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

  • Вынести блок «Стать резидентом», сделав его самостоятельным элементом и выделив его значимость

  • Включить всю основную информацию о процессе становления резидентом прямо в блоке.

Неочевидность и неинформативность блока «Стать резидентом»

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

  • Реализация авторизации через Pop-up

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

Проблема навигации при авторизации и после

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

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

  • Проработать структуру форм для заполнения данных при создании заказа/услуги/регистрации как участника

  • Сделать важные разделы обязательными для заполнения

  • Стимулировать клиентов заполнять как можно больше информации

  • Выводить только заполненные разделы.

Полупустые страницы заказов, услуг и участников

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

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

Проблема
Описание
возможное решение
Проблема
Описание
возможное решение
Проблема
Описание
возможное решение

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

Анализ контента

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

Тестирование и корректировки

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

Улучшение текстов и структуры

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

Оценка контента интерактивных элементов

возможное решение

Примеры обнаруженных ошибок контента

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

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

Неочевидность значений текстов и символов

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

Примеры проблем на странице участника:

  • Под заголовком указан год. Это может трактоваться как год основания компании или как год регистрации участника на платформе
  • Отсутствие пояснений к QR-коду затрудняет понимание его назначения пользователями.

Переписать тексты так, чтобы везде прослеживалась преемственность.

Текущий интерфейс

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

  • Добавить ключевую информацию, чтобы сделать раздел более информативным.

  • Подробное и визуально привлекательное представление информации повысит общее удовлетворение от использования сайта.

Раздел «Участники» не предоставляет пользователям достаточной информации

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

Проблема
Описание
возможное решение
Проблема
Описание
возможное решение
Проблема
Описание
возможное решение

Непоследовательность в терминах

Текущий интерфейс

Текущий интерфейс

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

Функциональный анализ элементов

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

Сравнительный анализ функциональности

Оценить формы, кнопки и ссылки, чтобы удостовериться в интуитивности и эффективности этих элементов.

Логика и последовательность
интерактивных элементов

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

Тестирование пользовательских сценариев

возможное решение

Примеры обнаруженных функциональных ошибок

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

  • Использовать более знакомые элементы интерфейса, такие как кнопки, с явным обозначением действия, чтобы повысить интуитивность;

  • Провести тестирование с реальными пользователями, чтобы убедиться, что кнопка и её функция понятны и не вызывают сомнений у целевой аудитории, и внести коррективы по результатам тестирования

Неочевидность и неинформативность блока «Стать резидентом»

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

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

  • Переработать форму для заполнения с разбивкой на смысловые блоки поможет выводить более структурированный и легкочитаемый результат;

  • Добавить ограничения по символам и подсказок.

Сложность восприятия контента на странице услуг, запросов и новостей

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

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

  • Пересмотреть расположение кнопок в соответствии с привычными паттернами;

  • Использовать разный дизайн для визуального разделения.

Полупустые страницы заказов, услуг и участников

Близкое расположение кнопок «Создать организацию», «Присоединить к организации», «Сменить пароль» и «Удалить аккаунт» и их схожий дизайн могут повысить вероятность случайного нажатия на неправильную кнопку.

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

Проблема
Описание
возможное решение
Проблема
Описание
возможное решение
Проблема
Описание
возможное решение

Оценка соответствия дизайна актуальным тенденциям

3

2

Оценка цветовой палитры, типографики, интерактивных элементов

1

Этап №2

UI-анализ

Нужен для выявления несоответствий в дизайне и разработки рекомендация по внедрению более интуитивного интерфейса. Для этого проводится:

Анализ визуальной иерархии интерфейса для выявления проблем восприятия

Обновить визуал в соответствие с общей стилистикой платформы и текущими тенденциями в UI-дизайне

Общий список решений в рамках этапа

Общая стилистика

Переписать тексты и разбить их на мелкие абзацы с добавлением заголовков и графических элементов для улучшения восприятия

Разработать единый стиль фильтрации для всех страниц платформы и всех разделов лк для единства отображения информации

Оптимизация контента

Унификация элементов интерфейса

Масштабируемость сайта в будущем
1
Поиск по предложениям эквивалентен поиску по категориям
2
Приоритетность информации об услуге: категория, описание, исполнитель услуг
3

Для демонстрации предлагаемых изменений мы разработали прототип страницы «Услуги»

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

3

26

клиент, который получил конкретные рекомендации по улучшению сайта

1

50

варианта улучшений предложено
ключевых проблем было выявлено
часов работы UX/UI-дизайнера
UX/UI upper-middle CRT
Анастасия
команда о пользе проведения дизайн-аудита
Аудит экосистемы позволил нашей команде выявить слабые места в пользовательских сценариях сайта и личного кабинета. Клиент получил несколько вариантов улучшений и конкретные рекомендации, которые будут способствовать росту числа активных пользователей, повышению их вовлечённости и,  в конечном итоге, достижению ключевых бизнес-целей