Подтвердилась как UX-проблемаНавигация
Риса за Творчество · 2026 · Навигация
Пересобрал навигацию в 5 крупных разделов
«Риса за Творчество» (РЗТ) — платформа по типу Кинопоиска для музыки: здесь оценивают релизы, пишут рецензии и следят за экспертными рейтингами. Знакомые, которым я её советовал, путались в разделах и механиках. Одна из главных причин — меню: длинный плоский список, где музыка смешана с механиками платформы. Я восстановил архитектуру AS IS, провёл интервью, открытую карточную сортировку и два раунда tree test, а затем спроектировал меню из 5 крупных разделов.
39,0%→60,1%
Средний успех навигационных заданий до и после редизайна архитектуры
10
глубинных интервью: 5 новичков и 5 пользователей из Топ-90
Проблема, задача, ограничения
Разделов в меню много, но непонятно, куда идти
Проблема
Меню РЗТ — длинный плоский список. Музыка в нём смешана с рейтингами, премиями и механиками платформы, а первыми идут новости, Q&A и магазин. Многие названия — «Топ-90», «Ценность альбомов», «Магазин» — без контекста непонятны: новичок не знает, где искать релизы и что скрывается за пунктом.
Задача
Собрать понятную структуру меню, чтобы новичок быстро находил музыку и нужные разделы. Привычные входы и термины РЗТ при этом сохранить, чтобы опытные пользователи не потеряли дорогу.
Ограничения и как я с ними работал
01
Понятная навигация без потери языка РЗТ
«Топ-90», «Ценность альбомов» и другие термины — часть идентичности РЗТ, а опытные пользователи находят разделы по привычке. Нужно было сделать меню понятным новичку, не ломая эти привычки и не переименовывая всё подряд.
02
Нет доступа к полноценной продуктовой аналитике
У меня не было данных о конверсии, удержании, времени выполнения сценария, количестве незавершённых сценариев и других продуктовых метриках. Поэтому проблемы и приоритеты определялись преимущественно на основе UX-аудита и пользовательских исследований.
03
Не учитывались технические ограничения разработки
Ограничения текущей кодовой базы, сроки и стоимость реализации отдельных решений не являлись решающим фактором. Я опирался на улучшение пользовательского опыта и сценариев.
Рабочий процесс
От аудита к проверенным решениям
Каждое решение опирается на данные предыдущего шага: аудит дал гипотезы, интервью и тесты их подтвердили или отсеяли, а дизайн проверялся повторным тестированием.
-
01
Конкурентный анализ и архитектура AS IS
Бенчмаркинг 6 платформ и восстановление архитектуры AS IS.
Проблем нашлось много, поэтому нужно было выбрать главные.
-
02
Гипотезы и приоритизация
Каждую проблему перевёл в гипотезу по HADI-структуре и приоритизировал по адаптированной ICE.
Гипотезы нужно было проверить на реальных пользователях.
-
03
Глубинные интервью
Поговорил с новичками и опытными пользователями РЗТ.
Интервью подтвердили, что есть проблемы с меню и навигацией. Поэтому навигацию нужно было проверить отдельно.
-
04
Проверка навигации
Tree test AS IS, затем открытая карточная сортировка, затем tree test TO BE.
После всех исследований появилась опора для изменений в интерфейсе.
-
05
Редизайн меню
Меню из 5 крупных разделов, его состояния и хедер для гостя и пользователя.
Решения нужно было проверить на пользователях.
-
06
Юзабилити-тест
Модерируемый тест кликабельного прототипа с новичками.
UX/UI-аудит
Где продукт теряет новичка
Конкурентный анализ
Прямого аналога РЗТ в СНГ нет, поэтому я изучил музыкальные и контентные платформы со схожими сценариями и сравнил в таблице бенчмаркинга: структуру сервисов, работу с основной единицей контента, оценки и рецензии, поиск нового контента, рейтинги и социальные механики.
Ключевые инсайты
01
Контент в центре
У всех конкурентов контент — центральная точка взаимодействия. В РЗТ порядок обратный: на первый план выходят внутренние механики.
02
Поиск — не только каталог
Рекомендации, подборки и расширенные фильтры — такие же важные способы найти контент.
Здесь могла быть ваша реклама
Архитектура AS IS
Восстановил информационную архитектуру сайта: верхнеуровневые разделы, вложенные страницы, профили релизов, пользователей и артистов, связи между сущностями. Отдельно отметил дубли, неоднозначные названия и проблемные связи.
Ключевые инсайты
01
Слишком много разделов верхнего уровня
В меню их больше, чем удобно держать в голове (закон Миллера, 7±2). Новичку трудно понять, с чего начать.
02
Рейтинги конкурируют между собой
Рейтинги контента и пользователей, премии и достижения стоят рядом и спорят за внимание. Непонятно, что из этого главное.
03
Связанные сценарии разбросаны
Рейтинг всех релизов и рейтинг новичков лежат на разных страницах и никак не связаны.
Гипотезы и приоритизация
От проблем к проверяемым гипотезам
HADI-структура
Каждую проблему из аудита я описал цепочкой по адаптированному HADI-циклу:
проблемагипотезарешениеспособ проверкиметрика
К навигации относились две гипотезы: называть разделы одинаково по всему сайту и собрать пункты меню в логические группы.
Приоритизация по ICE
Приоритизировал гипотезы по адаптированной модели ICE: разделил сложность реализации на дизайн и разработку, чтобы не недооценивать проектирование и проверку.
ICE = Impact × Confidence / (Design Effort + Dev Effort)
Impact — влияние изменения на пользовательский опыт
Confidence — уверенность на основе аудита, бенчмаркинга и исследований
Design Effort — сложность проектирования и проверки решения
Dev Effort — ожидаемая сложность технической реализации
Цвет строки — приоритет:низкийвышевысокийсамый высокий
Интервью
10 интервью с двумя сегментами
Чтобы проверить гипотезы, я разделил респондентов на две группы по 5 человек. Нужно было упростить вход для новичков, не отняв ценность у тех, кто уже пользуется платформой.
5 человек · новички
Интересуются музыкой, но не знакомы с РЗТ
Исследовал первый контакт: понятно ли назначение платформы, видна ли её ценность, получается ли сориентироваться в навигации, прочитать оценку и разобраться в механиках без предварительного знания. Встроил тест первого впечатления и короткий навигационный тест.
5 человек · опытные
Пользователи из рейтинга Топ-90 РЗТ
Гайд строился вокруг реальных повторяющихся сценариев. Важно было отделить то, что человек действительно считает удобным, от того, к чему он просто привык.
Главное из интервью
01
Большое меню отталкивает
Почти все новички с первого взгляда не понимали, куда идти: меню длинное, а названия разделов не складываются в понятную карту сайта.
02
Новички ищут музыку, а не механики
Уровни, премии и внутренние рейтинги их не цепляют. Сначала они хотят найти релизы и понять, что стоит послушать.
03
Опытные ходят по привычным входам
К структуре у них меньше претензий: они заходят через «Релизы», «Новые имена» и Топ-90. Но Топ-90 считают рейтингом активности, а не качества.
Тестирование архитектуры
Три раунда проверки навигации
Учитывал не только финальный выбор, но и весь путь: возвраты, блуждания и уход на Главную как запасной вариант.
- Tree test AS IS14 респондентов, 11 заданий: где ломается текущая навигация
- Открытая карточная сортировка19 ответов: как пользователи сами группируют разделы
- Tree test TO BE18 респондентов: стало ли понятнее в новой структуре
Tree test AS IS: точка отсчёта
Отчёт tree test AS IS в Pathway
14
респондентов, 11 заданий
39,0%
средний успех: 60 из 154 ответов
0/14
нашли, где заказать разбор релиза: сценарий был спрятан в «Магазине»
7/14
назвали «Ценность альбомов» и «Сетки премий» непонятными
| Проблемная зона | Что происходило |
|---|---|
| Магазин | Никто не связывал его с отправкой релиза на разбор. Искали в «Релизах», «Рецензиях», FAQ и «Авторах». |
| Топ-90 | Без уточнения воспринимался как рейтинг чего угодно: треков, альбомов, артистов, пользователей. |
| Ценность альбомов | Путали с рейтингом альбомов, шкалой, методикой, калькулятором и справкой. 1 из 14 нашёл нужное. |
| Авторы / Авторские комментарии | Не понимали, где искать артиста и участника индустрии. Путали с рецензиями и лайками. |
| Достижения, Сетки премий | Конкурировали с премией, наградами и пользовательскими рейтингами. |
Лучше всего работала простая рейтинговая модель: страницы людей из индустрии (71%) и рейтинг треков (64%).
Открытая карточная сортировка
Выбрал открытый формат, чтобы не навязывать пользователям существующую структуру. Собрал 20 ответов, 19 подошли для анализа.
Отчёт карточной сортировки в Pathway
| Группа | Совпадение | Вывод |
|---|---|---|
| Все 4 карточки премии вместе | 16 / 19 | «Премия» — отдельный крупный раздел |
| «Лучшие треки» и «Лучшие альбомы» вместе | 16 / 19 | Треки и альбомы — рядом, в «Рейтинге» |
| Рецензии слушателей и медиа вместе | 15 / 19 | Рецензии — единый раздел с фильтрами |
| «Топ пользователей» и «Значки достижений» вместе | 13 / 19 | Пользовательские механики — в «Сообщество» |
| Релизы, артисты, новые имена, плейлисты | часто | Нужен крупный раздел «Музыка» |
| Справка, FAQ, новости, обратная связь | часто | Нужен раздел «О проекте» |
Ключевой инсайт
Нужны крупные логические разделы
Пользователи ждут не плоский список, а крупные логические разделы: Музыка, Рейтинг, Сообщество, Премия, О проекте.
Tree test TO BE: проверка новой структуры
По итогам двух тестов собрал архитектуру TO BE и проверил её на 18 респондентах: 16 из них не были знакомы с РЗТ или только слышали название.
Отчёт tree test TO BE в Pathway
18
респондентов, 14 заданий (11 — как в AS IS)
60,1%
средний успех по тем же 11 заданиям: 119 из 198 ответов (было 39,0%)
6/18
нашли, где заказать разбор релиза (было 0 из 14)
9/18
назвали «Сетки премий» непонятными, поэтому в меню их нет
Процент успешно выполненных заданий
Доля засчитанных ответов (данные Pathway)
AS IS · 14 чел.TO BE · 18 чел.
Что сработало
43%→83%
Найти самых активных участников
Через раздел Сообщество
29%→72%
Найти рейтинг начинающих артистов
64%→78%
Найти лучшие треки и альбомы
Через раздел Рейтинг
0%→33%
Найти, где заказать разбор релиза
Раньше не нашёл никто
Что ещё стоит доработать
50%→61%
Найти информацию о проекте
43%→50%
Найти страницу релиза
7%→33%
Найти значимые альбомы
Выросло, но «Ценность альбомов» всё ещё путают с обычными альбомами
Итоговая архитектура
Главным выводом стало то, что проблема навигации не только в количестве пунктов, но и во внутренней терминологии. Я не стал переименовывать всё подряд: многие термины — часть идентичности РЗТ, и знакомые пользователи легко их находят. Поэтому финальная структура сохраняет продуктовый язык, немного уточняя его и раскладывая в пять понятных разделов.
Главная
- Баннер
- Топ-15 релизов за сутки
- Релизы
- Комментарии авторов релизов
- Рецензии
- Рецензии медиа
- Топ-90 пользователей
- Ценность альбомов
- Плейлисты
Музыка
- Релизы
- Новые имена
- Рецензии
- Комментарии авторов релизов
- Авторы релизов
- Плейлисты
Сообщество
- Топ-90 пользователей
- Достижения пользователей
Рейтинг
- Рейтинг релизов
- Ценность альбомов
Премия
- Результаты премии
- Премия РЗТ
О проекте
- О нас
- Новости
- Часто задаваемые вопросы
- Заказать разбор релиза
- Статистика сайта
- Обратная связь
БылоМного плоских верхнеуровневых пунктов
СталоГлавная и 5 крупных разделов
Было«Магазин» не связывался с разбором релиза
Стало«О проекте → Заказать разбор релиза»
Было«Топ-90» путали с рейтингом чего угодно
Стало«Сообщество → Топ-90 пользователей»
Было«Новые имена» смешивали контент и рейтинг
СталоКонтент — в «Музыке → Новые имена», рейтинг — внутри «Рейтинга»
Было«Ценность альбомов» путали с методикой и калькулятором
СталоТермин сохранён, раздел стоит в «Рейтинге»
Было«Сетки премий» — непонятный пункт
СталоУбраны из навигации, остаются форматом внутри «Результатов премии»
Подтверждение гипотез
Итоги исследований
Обе гипотезы подтвердились. Разнобой в названиях — вопрос базовой гигиены интерфейса, отдельно проверять его на интервью не требовалось. Группировку меню подтвердили интервью, карточная сортировка и tree test: средний успех по 11 одинаковым заданиям вырос с 39,0% до 60,1%.
Что показала проверка
ПодтвердиласьНавигация
Если объединить разделы меню в логические группы и сократить количество пунктов меню, то поиск тех или иных разделов станет быстрее и проще
Итоговые выводы
По результатам исследований я составил выводы и задачу на редизайн по каждой гипотезе.
Меню
Пять разделов вместо плоского списка
Архитектуру TO BE перенёс в боковое меню: главная и пять разделов — «Музыка», «Сообщество», «Рейтинг», «Премия», «О проекте». Контент идёт первым, а новости, Q&A и заказ разбора собраны в «О проекте» в конце. Глобально ничего не убрал: пункты объединены или перенесены в другие разделы, а названия уточнены по итогам интервью и тестов — например, «Авторы» стали «Авторами релизов».
В tree test новая структура подняла средний успех по 11 заданиям с 39,0% до 60,1%. Тестирование архитектуры ↑
ПроблемаСлишком много верхнеуровневых пунктов одним списком
РешениеГлавная и 5 разделов по итогам карточной сортировки
ПроблемаСверху новости, Q&A и магазин — порядок не объясняет, что это за платформа
РешениеПервой идёт «Музыка», служебные пункты — в «О проекте» в конце
ПроблемаМеню нельзя зафиксировать открытым
РешениеГамбургер переключает широкое и узкое меню, выбор запоминается
ПроблемаИконки разных стилей: контурные вперемешку с залитыми
РешениеЕдиный набор: Phosphor и доработанные иконки с оригинального сайта
Было
«Концерты» появились на сайте уже после редизайна
Стало
Как работает меню
Выбор запоминается
Гамбургер переключает широкое и узкое меню. Сайт помнит, какое состояние выбрал пользователь.
Открывается рядом или поверх
Если широкое меню помещается слева от контента, оно просто открывается. Если нет — ложится поверх и слегка затемняет страницу.
Клик и наведение
В широком меню разделы раскрываются и сворачиваются по клику. В узком подпункты появляются по наведению на иконку.
Поиск там, где его видно
Поиск всегда есть в хедере. В меню он появляется, только когда меню ложится поверх и закрывает хедер.
Юзабилити-тест
Что показал тест прототипа
После первой итерации я провёл модерируемый юзабилити-тест на кликабельном прототипе с новичками. Формат простой: одна гипотеза — одно задание, затем наблюдение и вывод. Задания покрывают путь новичка целиком:
понять, что это за сервиснайти релизразобраться в разделах сообщества
Навигационные гипотезы подтвердились. H12 про активность авторов подтвердилась с уточнением — её я поправил во второй итерации, она в кейсе «Главная и UI-кит».
| Гипотеза | Статус |
|---|---|
| H1. Новичок понимает назначение РЗТ | Подтвердилась |
| H2. Пользователь сам находит релиз | Подтвердилась |
| H12. Пользователь находит активность авторов | Подтвердилась с уточнением |
| H13. Пользователь находит активных участников сообщества | Подтвердилась |
| H14. Пользователь находит «Новые имена» | Подтвердилась |
Навигация, которую я проверял tree test’ом, на живом прототипе тоже сработала: раздел сообщества и «Новые имена» нашлись через меню без подсказок.
Итоги
Что получилось
01
Каждое решение можно проследить до исследования
Аудит → гипотезы → 10 интервью → 3 раунда проверки архитектуры. За каждым ключевым экраном стоит конкретный вывод из этой цепочки.
02
Навигация стала понятнее
Средний успех по 11 одинаковым заданиям tree test вырос с 39,0% до 60,1%. Самые проблемные сценарии сдвинулись с нулевых значений.
03
Идентичность продукта сохранена
Я сознательно не избавился от терминологии РЗТ, а сделал её понятнее через структуру и уточнённые названия: например, Топ-90 теперь лежит в «Сообществе» как «Топ-90 пользователей». Это важно для опытной аудитории.
Что дальше
- Остальные сценарии. Дальше пройти тем же циклом «аудит → гипотезы → интервью → проверка» профили пользователей и авторов, рейтинги, премии и сообщество.
- Постоянная обратная связь. Регулярно проводить юзабилити-тесты новых решений, собирать отзывы опытных пользователей и следить за обращениями в поддержку, чтобы изменения для новичков не отталкивали сообщество.
Другие кейсы проекта
Вывел контент на первый план
Главная и UI-кит
Открыть кейс →Собрал релиз, оценку и рецензии на одной странице
Страница релиза
Открыть кейс →Сделал сложную систему оценки доступной
Система оценки
Открыть кейс →Весь проект
Сделал «Кинопоиск для музыки» доступным для всех
Все четыре кейса одним лонгридом: исследование, решения и результаты целиком.
Открыть общий кейс →