«Сообщество» — это коллекция историй людей, которые сегодня живут в Москве
Web, UX/ui, Исследование, дизайн система
- НикитаИсследования
UX/UI проекта
Дизайн система - МашаИллюстрации
UX/UI проекта - СашаМенеджер проекта
Проблема
За последние 2 года закрылись многие лайфстайл и городские медиапроекты. В информационном поле преобладают темы политики и экономики. Появилась потребность развить и повысить вовлеченность граждан в столичные электронные проекты
Задача
Превратить "мёртвый" проект «Город Идей» в экосистему с актуальным контентом, открытым комментированием, где жители могут смотреть статьи выпущенные редакцией, публиковать личные истории, а также ознакомиться с полезными идеями и лайфхаками.
Понимание задачи
Провёл интервью со стейкхолдерами проекта, чтобы лучше понять проблему, их позицию по проекту и желаемый результат. Предложил свои идеи по этапам работы
Дизайн процесс
Исследуем
Определение целей
Чего хочет заказчик? (KPI, конверсия, retention)
Какие проблемы у пользователей? (опросы, отзывы, поддержка)
Анализ данных
Я.Метрики
Изучение конкурентов (что работает у них, а что нет)
Чего хочет заказчик? (KPI, конверсия, retention)
Какие проблемы у пользователей? (опросы, отзывы, поддержка)
Анализ данных
Я.Метрики
Изучение конкурентов (что работает у них, а что нет)
генерируем
Методы:
Мозговой штурм (правило: «никакой критики на этапе генерации»)
SCAMPER — модификация существующих решений: «Что если объединить шаги 3 и 4 в форме?»
Визуализация:
Wireframes в Figma
Мудборды (подбор референсов по цветам, композиции)
проверяем
Тестирование на пользователях (прототипы)
Выбор лучшего решения
Выбор лучшего решения
Внедряем
Запуск MVP (минимальной версии)
Сбор фидбека (опросы, метрики)
Постоянные улучшения (цикл: анализ → гипотеза → тест)
Сбор фидбека (опросы, метрики)
Постоянные улучшения (цикл: анализ → гипотеза → тест)
Исследование
Анализ конкурентов/User persona
Провёл исследование конкурентов для определения базового функционала будущего сервиса. С командой определили портрет идеального пользователя
- Целью исследования было выявление общих проблем и тенденций в интерфейсах конкурентов, для соблюдения стандартов в подобных сервисах и применения их у себя в продукте, что позволит пользователю быстрее адаптироваться в нашем интерфейсе
- Посмотреть какие фичи конкурентов могут прижиться в нашем продукте и положительно повлиять на его развитие
- Какие используемые в нашем продукте решения мы можем подтвердить и утверждать, что они в большей степени будут работать.
- Выявление общих проблем в интерфейсах конкурентов
- Возможность написать пост и оставлять под ним комментарии является важной часть подобных сервисов, для взаимодействия пользователей и и для их вовлечения
- В некоторых сервисах присутствует возможность изучить курс и получить за это награды 2/5, что хорошо работает в специализированных сервисах
- Функция Reelse приутствует у 1 из конкурентов, ролики пользуются популярностью и залетают на большое кол-во просмотров, но прежде чем вводить такую функцию стоит её проработать
- У 2/5 конкурентов присутствует фича обмена сообщениями, у Reddit есть возможность объединяться в группы по различным тематикам и обмениваться сообщениями
- Получение уведомлений присутствует во всех сервисах, однако реализованы с различной степенью заботы о пользователях. У Т-Журнала есть фича “Письмо”, которое позволяет гибко и ненавязчиво настроить получение уведомлений на почту по интересующим темам
- У 2/5 конкурентов присутствует фича как настраиваемая лента новостей (Reddit, Дзен) осуществлена она по разному, однако стоит отметить персонализацию под себя как положительный момент
При изучении конкурентов, их интерфейсов, а также отзывов из публичных источников было выявлены ряд закономерных проблем на которые стоит обратить внимание в дальнейшем развитии Сообщества
- В большинстве сервисах конкурентов существует проблема с взаимодействием пользователя с интерфейсом, а именно не до конца продумана логика взаимодействия с некоторыми кнопками (отписаться/подписаться), где одна функция выполняется на разных экранах
- Важно помочь пользователю и доступным языком донести информацию о продукте, как и в закрепленном разделе с документацией, так и с помощью дополнительных информеров, поп апов, т.к интерфейс достаточно нагружен и некоторый пользователи не достаточно с ними знакомы\
- Также это общие рекомендации по UI, важно соблюдать консистентность, адаптивность под различные девайсы, придерживаться минимализма и не перегружать интерфейс для облегчения взаимодействия с ним
- Следить за качеством модерации, которая отсеивает непригодные статьи для публикации
Дизайн система
Теперь итоговый продукт выглядит и функционирует более целостно, что улучшает пользовательский опыт и помогает легче достигать бизнес-целей
Цвет
— Правительственный проект должен ассоциироваться с надёжностью. Оттенок черного подходит идеально — он вызывает доверие, а также снижает нагрузку при работе с большими лонгридами
— Акцентный Нежный розовый (#FFECF9) создаёт ощущение лёгкости и заботы, ассоциируется с поддержкой и доброжелательностью
— Акцентный Нежный розовый (#FFECF9) создаёт ощущение лёгкости и заботы, ассоциируется с поддержкой и доброжелательностью
Шрифт Golos text
— Создан специально для экранов: хорошо работает в мелких кеглях (даже в плотных интерфейсах)
— Умеренная контрастность: не утомляет глаза при долгом чтении (важно для текстовых сервисов)
— Разработан по заказу Почты России (адаптирован под официальные документы)
— Ассоциируется с нейтральностью и порядком, подходит для госуслуг, новостных и соц. проектов
— Умеренная контрастность: не утомляет глаза при долгом чтении (важно для текстовых сервисов)
— Разработан по заказу Почты России (адаптирован под официальные документы)
— Ассоциируется с нейтральностью и порядком, подходит для госуслуг, новостных и соц. проектов
Собрал компоненты на отдельной странице, также добавил отдельную страницу с описанием компонентов и их поведением для команды разработки.
MVP
Спустя 9 месяцев плотной работы над проектом, был выпущен пилот проекта
Развитие проекта
Идеи способные увеличить показатели времени проведенное на сайте, вовлечённость пользователей, а также улучшить UX метрики
1. Удобство для пользователей
Альтернативный формат потребления:
• Люди могут слушать контент в дороге, за рулём или во время работы (когда чтение невозможно).
• Подходит для аудиалов
Экономия времени:
• Позволяет изучать контент без отрыва от других дел.
2. Увеличение вовлечённости
Дополнительный канал взаимодействия:
• Подкасты создают эмоциональную связь (голос передаёт интонации и харизму спикера лучше текста)
Поддержка лояльности:
• Регулярные выпуски удерживают аудиторию
3. SEO и трафик
• Подкасты можно размещать на ВК Music, Яндекс.Музыке — это привлекает дополнительный трафик на сайт.
• Текстовая расшифровка улучшает SEO (можно использовать для статей).
Альтернативный формат потребления:
• Люди могут слушать контент в дороге, за рулём или во время работы (когда чтение невозможно).
• Подходит для аудиалов
Экономия времени:
• Позволяет изучать контент без отрыва от других дел.
2. Увеличение вовлечённости
Дополнительный канал взаимодействия:
• Подкасты создают эмоциональную связь (голос передаёт интонации и харизму спикера лучше текста)
Поддержка лояльности:
• Регулярные выпуски удерживают аудиторию
3. SEO и трафик
• Подкасты можно размещать на ВК Music, Яндекс.Музыке — это привлекает дополнительный трафик на сайт.
• Текстовая расшифровка улучшает SEO (можно использовать для статей).
1. Ускорение и удобство поиска
Мгновенный доступ к связанным данным:
• Пользователи могут одновременно открывать несколько связанных статей, идеи или комментарии (как в WikiLinks), не теряя контекст.
Гибкость навигации:
• Мультитач-поиск позволяет сравнивать идеи (например, два варианта благоустройства), не переключаясь между вкладками.
2. Улучшение UX для мобильных пользователей
Естественные жесты:
• Масштабирование, свайпы и другие мультитач-взаимодействия знакомы пользователям по смартфонам и планшетам.
• Особенно полезно для старшей аудитории, которая хуже адаптируется к сложным фильтрам.
Адаптация под любые экраны:
• Технология работает одинаково хорошо на ПК, тачпадах и сенсорных устройствах.
3. Поддержка исследовательского поведения
— Не только поиск, но и анализ:
• Пользователи могут группировать результаты по темам (например, «истории жителей» + «официальные документы»).
• Визуальные связи между статьями (как в графах знаний) помогают глубже погружаться в тему.
— Пример сценария:
Житель ищет «ремонт дорог» → видит не только новости, но и:обсуждения соседей, планы администрации, инструкции, как подать заявку
Мгновенный доступ к связанным данным:
• Пользователи могут одновременно открывать несколько связанных статей, идеи или комментарии (как в WikiLinks), не теряя контекст.
Гибкость навигации:
• Мультитач-поиск позволяет сравнивать идеи (например, два варианта благоустройства), не переключаясь между вкладками.
2. Улучшение UX для мобильных пользователей
Естественные жесты:
• Масштабирование, свайпы и другие мультитач-взаимодействия знакомы пользователям по смартфонам и планшетам.
• Особенно полезно для старшей аудитории, которая хуже адаптируется к сложным фильтрам.
Адаптация под любые экраны:
• Технология работает одинаково хорошо на ПК, тачпадах и сенсорных устройствах.
3. Поддержка исследовательского поведения
— Не только поиск, но и анализ:
• Пользователи могут группировать результаты по темам (например, «истории жителей» + «официальные документы»).
• Визуальные связи между статьями (как в графах знаний) помогают глубже погружаться в тему.
— Пример сценария:
Житель ищет «ремонт дорог» → видит не только новости, но и:обсуждения соседей, планы администрации, инструкции, как подать заявку
1. Увеличение вовлечённости
• Пользователи видят свою активность (комментарии, лайки) — это поощряет их участвовать чаще.
• Награды и достижения (бейджи, рейтинги) создают игровую динамику (геймификация).
• Личный профиль даёт ощущение «своего угла» на сайте, повышая привязанность.
• Пользователи видят свою активность (комментарии, лайки) — это поощряет их участвовать чаще.
• Награды и достижения (бейджи, рейтинги) создают игровую динамику (геймификация).
• Личный профиль даёт ощущение «своего угла» на сайте, повышая привязанность.
Аналитика
Подвел небольшие итоги на основе аналитики Я.Метрик
- 169,4 тыс.Просмотров за квартал
- 24-35, 55+Главная аудитория
- 26,25%Процент отказов превышает норму, есть над чем поработать
- CSI 78,9%Процент удовлетворённости на среднем уровне
Выводы
Проект находится на стадии пилота, но уже можно сказать о некоторых выполненных задачах
- Вовлечение аудиторииПродолжаем наращивать ЦА проект, реализовали возможность комментировать статьи. Увеличили Time Spent on Site
- современный ДизайнРеализовал современный дизайн вызывающий доверие. CSI 78,9%
- ВзаимодействиеРеализовали задачу с возможностью комментировать статьи
- БудущееС развитием проекта и реализацией новых фичей планируется повышение активности пользователей и их вовлечение
Другие проекты
UX аудит, UX/UI
Web, UX, исследование, прототип
