Контекст
Каталог продуктов кабинета рос, и каждое новое направление требовало пункта первого уровня. Старая навигация выкладывала категории всех разделов в одну полосу: на небольших экранах она не помещалась, и всё лишнее схлопывалось в «Ещё». Состав меню зависел от ролей и подключённых продуктов и был непредсказуем.
Решение
Вместо горизонтальной полосы продуктов появилось мега-меню из трёх частей.
Каталог
- Сгруппирован по задачам клиента
- Новый продукт — строка в группе
Избранное
- Своя полоса быстрого доступа
- Порядок перетаскиванием
Создать
- Одна кнопка
- Для всех документов кабинета
Избранное вместо борьбы за первый уровень
Первый уровень больше не делится между заказчиками: его собирает сам клиент. Нужный раздел добавляется звёздочкой прямо из каталога и сразу появляется в полосе под шапкой. Сам каталог живёт в мега-меню с собственной прокруткой, поэтому разделов в нём может быть сколько угодно.
Согласование через прототип
У каждого раздела свой заказчик, и все они хотели место на первом уровне. Вместо серии презентаций я собрал в Figma AI интерактивный прототип на React: возражения снимались демонстрацией прямо на встрече.
Двадцать с лишним заказчиков согласовали меню без затяжных итераций, потому что видели работающую навигацию, а не картинку.
Результат
Что бы сделал иначе
- Заранее проверил бы механику на прототипе с клиентами: настройка избранного не самая очевидная вещь. Ресурса на исследования тогда не было, он появился позже, и проверить её исследователи рекомендовали уже на аудите после релиза.