Программа по благоустройству и инфраструктуры районов как отдельных городов внутри Москвы.
Задача от МОС.РУ
Программа мэра «Мой район» существует уже как 6 лет. На разделе доносят информацию о событиях, активностях, планах и проделанной работе.
Требуется сформировать обновленную концепцию «Мой район» на сайте mos.ru, который будет формировать ценность для пользователей и отвечать запросам администрации — информировать и размещать новости о программе.
Цели
- Дать вариант редизайна в соответствии с дизайн-системой всего портала.
- Донести на разделе новостную информацию о событиях, активностях, планах и проделанной работе в рамках программы.
- Создать новый и удобный сайт для пользователей города Москвы: обновлённый поиск по районам и создать новый раздел для привлечения на мероприятия граждан Москвы.
Что было сделано
- Провели анализ раздела сайта.
- Провели с командой CustDev с 12 Москвичами.
- Выявили потребности и ожидания от сайта.
- Нашли прямых и косвенных конкурентов среди 13 сайтов, проведен анализ сайтов.
- Спроектировали CJM и Flow раздела.
- Разработали UI kit необходимый для команды и передачи разработки.
- Спроектирован обновленный интерфейс сайта с нововведениями для повышения ценности портала:
- Учтён прошлый опыт пользователей и улучшили главную, чтобы поиск был заметным.
- Убрали избыток цветовых решений, сделали интерфейс консистентным и простым для восприятия и разработали визуальную концепцию.
- Добавлен новый раздел нетворкинг, добавили редакторские подборки.
- Карту интересов и точек в районах, с упором на людей разных социальных группы населения.
Гипотеза, проверяемая исследованиями
“Пользователи не понимают или не видят ценности портала”
Интервью
Вместе с командой проверили свои идеи и мысли на side-by-side интервью. Благодаря чему, удалось подтвердить проверяемую гипотезу, а также найти новые идеи.
ЦА
- 12 человек были опрошены в ходе работы над проектом для проверки гипотезы
- Выбор пал на респондентов, которые подходили в текущую ЦА продукта, отбирались по следующим критериям: возраст, пол, семейное положение, постоянное проживание
в Москве.
- Исследование показало, что наибольший интерес к данному вопросу проявляют женатые женщины с детьми.
Цитаты респондентов
Анализ
Сделали аудит сайта, нашли его сильные и слабые стороны.
Понятное деление по разделам, понятный текст и понятно
что к чему относится
что к чему относится
- Все элементы интерфейса разных цветов, дизайн выглядит морально устаревшим
- Мало воздуха, за счёт этого сложнее воспринимать информацию
- Много разных элементов, не следующих общей логике оформления
Конкуренты/аналогичные сервисы
Всего с командой отобрали 13 сайтов по аналогичным и косвенным связям: новостные ресурсы, сервисы и приложения, так же другие проекты при поддержке с виденьем и подходом от других команд и зарубежные проекты по близкой тематике.
Выводы
- Конкуренты делятся на 2 лагеря: информационные – предоставляют пользователям необходимую информацию, и мотивирующие – побуждают пользователя к действию, например, к посещению определенного места.
- Наиболее близкие к проекту «Мой район» — информационные ресурсы. Однако эти ресурсы интересны только в том случае, если пользователю нужно узнать новости, но ресурс проигрывает более удобному формату связи через соц. сети
- Сайты доступны для широкого ЦА: могут быть полезны для пользователей с разными интересами и потребностями.
- Большинство ресурсов имеют дизайн «без перегруза», что делает их предпочтительными в выборе. Сама информация хорошо структурирована: пользователь может легко считывать нужную информацию и без проблем ориентироваться.
JTBD
По JTBD продукт должен соответствовать следующим критериям:
- Экономить время, содержать все в одном месте.
- Позволять узнать актуальные новости района, в том числе: актуальные маршруты транспорта и перекрытия, обустройство района.
- Помогать планировать походы на мероприятия, городские события (от новости до регистрации).
- Быть доступным для всех москвичей: фокусируются на людях и их потребностях.
CJM
Был просмотрен текущий путь пользователей по продукту. Чтобы определить текущие приоритеты пользователей: нужно понять какие разделы пользователи пропускают, а какие – нет.
Флоу
Составили карту для нового продукта, чтобы закрыть потребности пользователей.
Цвет и Шрифт
По цветам мы решили отталкивается от фирменного стиля. Сделали основной и дополнительный цвета и на основе него мы создали палитру.
Подобран шрифт Golos – нейтрален, удобен и хорошо читается с небольших экранов.
Компоненты
Чтобы не множить сущности и создавать хаос в макетах, собрали все воедино в ui-kit, чтобы команде было легко и без проблем создавать интерфейсы и не отвлекаться на что-либо ещё.
Выбор района
При переходе на страницу моего района, встречает поиск. Без всего лишнего. Сделаны адаптивы под экраны ноутбуков, планшетов и телефонов.
Раньше, поиск был не совсем интуитивно понятен: часть пользователей пропускали функционал мимо своих глаз, не замечая его с первого раза. Причина? Элемент поиска не считывается. Выглядит неприметным, смешиваясь с декоративными элементами главной. Да и сам поиск не выглядит как поиск. Ведь для поиска своего района отделяет всего один клик.

Страница района
Попадаем на район Басманный. Пройдемся по порядку:
Главная района. Под названием района ( теги > ) – по ним можно сразу перепрыгнуть к нужному разделу.
На противоположном углу можно перейти и посмотреть раздел с новостью, что же было сделано за текущий месяц/сезон и просмотреть ближайший планы по улучшению.
Раздел мероприятий. Ближайшие события – кружки, лекции, мастер-классы, которые будут проводится в этом районе.
Сервисы. Решение повседневных задач:
- Карты перекрытий и изменений маршрутов районов.
- Сервис по графикам отключениям воды.
- Записать ребёнка на секции рядом с домом.
- Сдача мусора на переработку.
- И других сервисы, решающие проблемы Москвичей от МОС.РУ.
Новости. Вся важная информация об изменениях, событиях района. Новостная лента стала легче и проще для восприятия.
В версии ДО, есть фильтрация по категориям и разбивание по цветовым блокам. От этого отказались. Причиной стала нехватка/неактуальностью новостей. Если смотреть по районам из мало популярных категорий, информация встречается за прошлый/позапрошлый год. Пример такого раздела ниже.
Нетворкинг. Новый раздел! Подробности ниже.
Выбор редакции. Где и куда можно сходить, топы по достопримечательностям, паркам и знаковым местам.
Обратная связь. Переводим наших пользователей на другой сервис, как активный гражданин, для решения вопросов и предложений.
Карта. Все нужные места, куда можно: записать ребёнка на секции, погулять с собакой, побегать и потренироваться, ближайшие парки, доступные места для людей с ограничениями.
Нетворкинг
Здесь можно записаться на разного рода мероприятия и познакомиться с новыми людьми со схожими интересами и целями по жизни и наладить с ними связи. На главной мы решили выделить сколько пользователей зарегистрировалось и сколько за месяц создали встреч.
Ваши регистрации. Мероприятия, на которые мы записались и будут в скором времени происходить.
Встречи. Каталог интересующих встреч, которые будут происходить в ближайшее время. Можно выбрать дату и время, интересующую тематику и стоимость – платные или бесплатные.
Создание встреч. Даем пользователю инициативу создавать мероприятия, а также отслеживать сколько записались на наши мастер-классы и тренировки.
Рекомендации. Основывается на интересах пользователя, на которые он регистрировался или же оценивал.
Карта. Отследить, где будут проходить сами мероприятия на районе.
Ещё раз резюмируя, что было сделано
- Провели анализ раздела сайта.
- Провели с командой CustDev с 12 Москвичами.
- Выявили потребности и ожидания от сайта.
- Нашли прямых и косвенных конкурентов среди 13 сайтов, проведен анализ сайтов.
- Спроектировали CJM и Flow раздела.
- Разработали UI kit необходимый для команды и передачи разработки.
- Спроектирован обновленный интерфейс сайта с нововведениями для повышения ценности портала:
- Учтён прошлый опыт пользователей и улучшили главную, чтобы поиск был заметным.
- Убрали избыток цветовых решений, сделали интерфейс консистентным и простым для восприятия и разработали визуальную концепцию.
- Добавлен новый раздел нетворкинг, добавили редакторские подборки.
- Карту интересов и точек в районах, с упором на людей разных социальных группы населения.
Web, News, Portal, Gov