{{title}}
{{published}}
{{description}}
{{text}}
Редизайн портала за 2 недели: что реально успеть
Корпоративный портал сервисной компании рос стихийно: десятки страниц в плоской навигации, перегруженные рабочие экраны. На редизайн было две недели. За них мы пересобрали навигацию, переработали шесть ключевых страниц, сделали мобильные версии двух из них и собрали UI Kit со светлой и тёмной темами. Рассказываем, почему начали не с палитры, а с навигации.
Почему сжатый срок — это фича, а не компромисс
Для контраста: Nielsen Norman Group каждый год разбирает лучшие интранеты мира. У победителей 2021 года путь к новому порталу занял в среднем 17 месяцев, а с 2014 года средний срок держится около 1,4 года. Это полный цикл с разработкой, контентом и командой в среднем из 17 человек. Сравнивать напрямую нельзя: мы делали дизайн, а не весь цикл. Но разница в порядке величин показывает, откуда берутся сроки: из желания переделать всё сразу.
Две недели не оставляют такой возможности. Меняется то, что сотрудники видят и трогают каждый день; всё остальное — следующими итерациями. Мы начали не с перекраски экранов, а с UX-анализа пути сотрудника. Главной проблемой оказалась плоская навигация, а не цвета, поэтому первые решения были про структуру, а не про пиксели.
Две недели не оставляют такой возможности. Меняется то, что сотрудники видят и трогают каждый день; всё остальное — следующими итерациями. Мы начали не с перекраски экранов, а с UX-анализа пути сотрудника. Главной проблемой оказалась плоская навигация, а не цвета, поэтому первые решения были про структуру, а не про пиксели.
Что вошло в две недели
- UX-анализ пути сотрудника по рабочим сценариям.
- Навигация: десятки страниц сгруппированы в разделы, новый сайдбар.
- Редизайн шести ключевых страниц — тех, где идёт ежедневная работа: «Все задачи», «Мои доски», «Отзывы», «SLA и средний рейтинг», «Продукты», «Изменить продукт».
- Мобильные версии двух страниц — «Продукты» и «Изменить продукт».
- Палитра по цветам логотипа и UI Kit в светлой и тёмной темах.
Команда — три роли: UX/UI-дизайнер, арт-директор, проджект-менеджер.
Как передали систему, чтобы портал не расползся снова
Портал рос по принципу «нужна страница — добавим страницу». Поэтому результатом стали не только шесть экранов, но и правила, по которым собираются следующие.
UI Kit — главная страховка на будущее. Следующую страницу портала можно собрать из готовых компонентов по его правилам, без «свободного творчества», из-за которого портал и расползся. Тёмная тема при этом не требует второго комплекта макетов: когда экраны собраны из компонентов, смена темы — свойство системы. Что такое UI Kit и чем он отличается от дизайн-системы — в глоссарии.
После сдачи заказчик отдал нам следующий проект — дизайн и тексты своего сайта.
Что из этого стоит повторять
- Навигация раньше пикселей. Если сотрудник не находит экран, красивый экран не поможет. UX-анализ пути показывает, где на самом деле теряется время.
- Частотные сценарии вместо «всего портала». Шесть страниц ежедневной работы дают эффект, который видит каждый сотрудник. Остальное собирается по тем же правилам.
- Система вместо набора макетов. UI Kit с темами превращает разовый редизайн в правила для всех следующих страниц.
Цифры
- Срок — 2 недели.
- 6 ключевых страниц, 2 мобильные версии, светлая и тёмная темы, UI Kit.
- Команда: UX/UI-дизайнер, арт-директор, проджект-менеджер.
- После сдачи заказчик отдал нам следующий проект — дизайн и тексты своего сайта.
Частые вопросы
По-настоящему, если менять ядро опыта, а не всё подряд. За две недели мы пересобрали структуру портала — навигацию по разделам и сайдбар, — переработали шесть экранов ежедневной работы и собрали UI Kit, по которому портал растёт дальше. Косметикой была бы перекраска старых экранов в новую палитру. Глубина достигается приоритизацией, не спешкой.
Потому что меняли не весь портал, а частотные сценарии: шесть страниц, на которых идёт ежедневная работа. Остальные страницы собираются из компонентов UI Kit по тем же правилам. Тёмная тема при этом не требует второго комплекта макетов — это свойство системы компонентов.
Когда сотрудники строят обходные пути: инструкции «как найти», локальные файлы вместо портала, задачи в мессенджерах. Это тоже стоит денег — просто размазано по каждому дню. С чего начать — в гайде «Редизайн корпоративного портала».
