Личный кабинет был спроектирован как часть общего сценария покупки через каталог. Со временем основной сценарий сместился в сторону торгов. Старый лейаут перестал вмещать растущий объем данных, а важные события терялись в интерфейсе. Я пересобрал структуру кабинета, обновил информационную архитектуру и добавил постоянный виджет актуальных запросов, чтобы поставщики быстрее реагировали на запросы покупателей.
Зона ответственности
UX-аудит, аналитика, IA, прототипирование, UI, валидация
Роль
Продуктовый дизайнер
+7,1%
рост MAU
+3,5%
скорость ответа на запросы
−10%
время разработки
Контекст
Платформа начиналась как B2B-маркетплейс, где пользователь в основном покупал через каталог. Старый ЛК был встроен в общую структуру: сверху оставались меню, поиск, корзина и навигация.
На раннем этапе это работало. Было мало разделов, таблицы были компактными, а поиск по товарам был важной частью сценария.
Со временем продукт изменился. Основная работа пользователей сместилась в сторону торгов и отсрочки платежа. ЛК перстал быть вспомогательной страницей, а стал ежедневным рабочим инструментом.
Было
Каталог → Заказ → ЛК как статусная страница
Стало
ЛК → Торги → Ответ поставщика → Заказ
Проблемы
1. Не хватало места под таблицы и рабочий контент
Данные приходилось ужимать, действия и статусы становились менее читаемыми.
2. Верхняя навигация больше не соответствовала сценарию
Каталог и глобальный поиск занимали место, хотя для пользователя основным инструментом стал запрос цены.
3. Информационная архитектура перестала масштабироваться
Разделов стало больше, часть из них находилась не там, где пользователь ожидал.
4. Поставщики недостаточно быстро реагировали на запросы
Если поставщик отвечает на запрос в течение первого часа, вероятность конверсии в заказ выше. А проданные тонны на платформе напрямую влияют на GMV.
Источник данных
Часть проблем мы поймали при разработке новых фич, часть получили через фитбек пользователей, часть непосредственно от бизнеса как проблему.
Исследование
Анализ Я.Метрики
Отчет по разрешению экрана
- По данным посещаемости большинство пользователей работали с desktop-экранов
- При этом пользователей с экраном 1920 px около 62% от общего объема
- Доля мобильных — около 3%
Вывод: личный кабинет можно проектировать как desktop-first рабочий инструмент с использованием 100% ширины экрана
Отчет по посещаемости
Я проверил, какие разделы используются чаще всего, а какие почти не участвуют в ежедневных сценариях.
Вывод: первый уровень меню не должен содержать все подряд. Он должен отражать частотность и важность задач.
Этап подготовки к передаче в разработку
Проработка всех сценариев и состояний интерфейса, подготовка описаний для разработчиков и аналитиков, демонстрация логики работы с помощью видеоанимации и интерактивных прототипов в Figma и Tilda.
Цель
Снизить вероятность ошибок на этапе разработки и показать стейкхолдерам все нюансы работы интерфейса.
Пример
Задача: спроектировать PIM-систему.
Проблема: MVP 0.5 включал множество сценариев. Система была объёмной, и тестирование отдельных элементов не давало полной картины.
Решение: стейкхолдеры и менеджеры протестировали интерактивный прототип ключевых блоков. После внесения ряда изменений макеты передали в разработку. В дальнейшем систему дорабатывали, не затрагивая уже протестированные принципы работы интерфейса.
Веб-дизайн и разработка на Tilda
Для эффективного продвижения маркетинговая команда регулярно тестировала новые офферы для разных сегментов аудитории. Поэтому задачи по созданию лендингов появлялись постоянно.
Чтобы снизить нагрузку на дизайн и разработку, в дополнение к текущему UI-киту я создал библиотеку стандартных блоков и перенёс часть разработки на Tilda.
64
стандартных блока-компонента
2,5 раза
уменьшение time to market
Айдентика
На старте проекта стояла задача разработать единый фирменный стиль с учётом уже существующих материалов. «Платферрум» — суббренд «Северстали» со своей идентичностью, поэтому важно было учитывать и айдентику материнского бренда.
После интервью со стейкхолдерами я сформулировал позиционирование и описал метафору фирменного стиля. Затем подготовил руководство по работе с айдентикой и шаблоны для внутренней и внешней коммуникации.
Графический дизайн
Иллюстрации
Я создал и развивал два набора 3D-иллюстраций: тематические сцены и иконки для рекламы и коммуникационных материалов, а также набор моделей металлопроката.
250+
3D иллюстраций
❤️Личная награда
Для внутренней коммуникации я создал двух персонажей, которых назвали «Платфоши». Персонажи часто появлялись вместе и взаимодействовали друг с другом, поэтому метафора бренда «объединение рынка металла» сработала и как метафора «объединения команды». Персонажи полюбились сотрудникам, и со временем их стали использовать самостоятельно. Для меня это стало личной внутренней наградой.
