Москва
Кемерово

Мобильное приложение «ЦифроАрбат»

Редизайн интерфейса приложения с городской афишей и маркетплейсом для организаторов мероприятий
ЦифроАрбат — мобильное приложение городских событий

О проекте

Приложение «ЦифроАрбат» создано в рамках проекта «Цифровой город» — экосистемы мобильных приложений, которые делают удобнее жизнь горожан.

«ЦифроАрбат» — это городская афиша. Через него жители города узнают о мероприятиях, регистрируются и покупают билеты, а организаторы событий размещают анонсы и собирают аудиторию.

Поводом для создания приложения стало наблюдение: часть людей говорит, что в городе ничего не происходит. А другая часть жителей уверены: в городе  интересных событий, что они не знают, как успеть везде. Появилась гипотеза: возможно анонсы событий сложно найти.

В компании нашего заказчика решили разработать приложение, где каждый сможет найти мероприятие по вкусу. С помощью приложения они стремились создать коммьюнити для креативного бизнеса и организаторов небольших местных мероприятий, собрать в приложении как можно больше жителей города, вовлечь их в городскую жизнь и общение.

Срок разработки: 5 месяцев;Стоимость: 700 000 рублей;Команда: UX-проектировщик, дизайнер, арт-директор, 4 разработчика, менеджер проекта.

Задача

На момент обращения к нам заказчик запустил MVP приложения — городскую афишу. После запуска приложения, менеджеры продукта собрали обратную связь от первых пользователей.

По отзывам людям нравилась идея сервиса с афишей и возможностью анонсировать свое мероприятие. Однако приходилось потратить время, чтобы разобраться в ленте событий и найти подходящее. А при регистрации событий нужно было заполнить громоздкую форму.

В результате часть первых пользователей просто удалили приложение или заходили в него редко. Развитие продукта застопорилось.

Руководитель продукта обратился в Атвинту, чтобы мы улучшили интерфейс: сделали его более понятным для пользователей.

Задача: сделать интерфейс мобильного приложения, который помогает организаторами событий и жителями города взаимодействовать через приложение.

Аналитика

Роли и цели пользователей

На первом этапе определили роли пользователей и их jobs-to-be-done — цели, ради которых они будут использовать приложение.

Пользователь приложения может быть участником событий и организатором. Как участник он просматривает все зарегистрированные события в своем городе, добавляет мероприятие себе в календарь и покупает билеты, если мероприятие платное. В качестве организатора пользователь создает собственные события и размещает событие в афише.

Пользователи имеют разные цели и потребности в зависимости от роли — участник или организатор.

Для участников важно быстро найти мероприятие на свой вкус в нужный день. Им нужна лента событий с удобными фильтрами.Для организаторов главное — найти свою аудиторию и собрать нужное количество человек на мероприятие. Им нужен интерфейс, который поможет максимально полно описать событие и при этом затратить минимум времени.

Пути пользователей и узкие места

Один и тот же пользователь может совмещать обе роли. А значит, вся функциональность должна быть доступна любому. С другой стороны важно скрыть лишнюю функциональность от тех, кто не создает свои события, чтобы не запутывать пользователей.

Исходя из этого построили сценарии пользователей.

ЦифроАрбат — мобильное приложение городских событий

Теперь мы понимали, какие шаги делает пользователь для достижения целей, и могли определить узкие места в интерфейсе: те части функциональности, которые ухудшают впечатление от приложения и отбивают желание им пользоваться. Например, для участников событий польза от приложения снижалась из-за того, что фильтров по интересам было слишком много и они выводились сплошным списком. А для организаторов приложение было неудобно из-за длинной формы регистрации события.

ЦифроАрбат — мобильное приложение городских событий

На основании этой информации мы разработали приятный и удобный дизайн, который помогает жителям города быстро находить мероприятия по вкусу, а организаторам — легко создавать анонсы своих мероприятий и привлекать аудиторию.

Дизайн

Лента событий

Разработку интерфейса приложения начали с создания ленты событий.

Лента состоит из карточек событий. Главная задача карточки: зацепить внимание и быстро дать основную информацию, пока пользователь скролит ленту. Для привлечения внимания используем изображение и название мероприятия. Внизу каждой карточки разместили дату, время, место и стоимость мероприятия. Это основная информация, которая нужна участнику, чтобы принять решение о посещении мероприятия.

ЦифроАрбат — мобильное приложение городских событий

Если событие заинтересует, пользователь откроет полную карточку по тапу на мероприятие. Здесь указано полное описание и есть возможность добавить событие в календарь по кнопке «Нравится». Или купить билет на платное мероприятие.

ЦифроАрбат — мобильное приложение городских событий

В ленте кроме стандартных карточек есть подборки событий и горизонтальная лента с анонсами кинотеатров.

Киносеансы выделили отдельно, так как это специфический тип событий. Дело в том, что фильмов и киносеансов много, к тому же они идут в нескольких кинотеатрах. Если делать их отдельными событиями, они заполнят всю ленту. События остальных участников просто потерялись бы.

Поэтому мы скомпоновали анонсы кино в горизонтальную ленту между карточками событий основной ленты. По тапу на карточку фильма открывается расписание сеансов и кинотеатры, где идет фильм. Информация о киносеансах попадает в приложение благодаря интеграции с Газетой Кемерова, регистрировать вручную их не нужно.

ЦифроАрбат — мобильное приложение городских событий

Еще один нестандартный элемент в ленте — подборки событий. Они дополнительно помогают продвигать мероприятия. Подборки сгруппированы так:

с привязкой к дате: чем заняться на новогодних каникулах, куда пойти в выходные;тематические: как провести романтический вечер, куда сходить большой компанией, где провести вечер с семьей.

ЦифроАрбат — мобильное приложение городских событий

Фильтры для мероприятий

Участники мероприятий могут как просматривать все мероприятия, так и персонализировать ленту. Для этого в приложении есть фильтрация по интересам.

В MVP приложения эта функция была неудобная: все категории были реализованы единым длинным списком, который не помещался на один экран. Мы сгруппировали их в подкатегории и представили в виде удобных плашек-кнопок.

Когда пользователь заходит в приложение впервые, приложение предлагает ему выбрать наиболее интересные типы и тематики мероприятий. Самые популярные у пользователей категории вывели наверх для быстрого доступа.

Кроме фильтров по тематикам, которые пользователь задает при первом входе, мы добавили фильтрацию по дате и времени, возрастной категории, стоимости.

Для выбора даты и времени предложили сделать кнопки «быстрого выбора»: сегодня, завтра, на выходных. Ведь чаще всего люди ищут, куда пойти в ближайшие дни.

ЦифроАрбат — мобильное приложение городских событий

Пошаговая регистрация события

Пользователь получает доступ к созданию событий, если зарегистрируется в приложении по номеру телефона и выберет опцию «Стать организатором» в настройках профиля.

Организаторы событий хотят презентовать свое мероприятие и быть заметными в ленте. А значит, нужно максимально подробно рассказать о событи и правильно настроить фильтры, чтобы событие увидела подходящая аудитория. При этом организаторам хочется тратить минимум времени на размещение в афише.

Для удобства мы разбили создание мероприятия на 4 шага. Информация на каждом шаге сгруппирована по смыслу:

Сначала общая информация: название, описание, изображение;На втором шаге — время и место;Далее организатор присваивает фильтры и добавляет контакты для связи;Последний шаг нужен только для платных мероприятий. На этом шаге пользователь настраивает категории и цены билетов.

ЦифроАрбат — мобильное приложение городских событий

После заполнения каждого шага приложение автоматически сохраняет информацию.

Некоторые организаторы проводят регулярные события. Чтобы им не приходилось каждый раз заново заполнять одну и ту же информацию, добавили возможность сохранить мероприятие как шаблон. И в дальнейшем менять только часть информации. Например, только дату и время.

Когда заполнена вся информация, мероприятие либо попадает на модерацию (для новых организаторов), либо сразу публикуется в ленте событий, если организатор уже проверенный.

Добавляем социальное взаимодействие

Участники могут подписаться на организаторов и следить за мероприятиями, которые он проводит.

Для размещения отзывов изначально предполагали сделать интерфейс добавления комментариев. В итоге заказчик решил оставить возможность публиковать рецензии и обзоры мероприятий в разделе «Блог».

Технологии

Приложение разработано для операционных систем iOS и Android. Расписание киносеансов попадает в приложение автоматически благодаря интеграции с разделом «Афиша» Газеты Кемерова А42.

Для продажи билетов приложение можно интегрировать с любой платежной системой.

Результат

Приложение сначала запустили в двух городах — Кемерове и Новокузнецке. Сейчас суммарно в этих городах 32'000 пользователей. Из них 741 человек — организаторы. Ежемесячно в приложении анонсируют порядка 20'000 мероприятий.

Продакт-менеджер компании-заказчика собрала обратную связь от пользователей после релиза нового дизайна. 

Мы много общаемся с организаторами и участниками мероприятий. Люди, которые пользовались приложением раньше, отмечали, что новый дизайн приятнее. А есть те, кто раньше не пользовался приложением из-за дизайна, но после его обновления стали пользователями.

Екатерина Салтыкова

Ведущий продакт-менеджер «ЦифроАрбат»

Компания-заказчик через вовлечение пользователей в приложение получили новую лояльную аудиторию из представителей креативного бизнеса. После редизайна заказчик решил масштабировать приложение и на другие города России.

Наша цель была — собрать комьюнити креативного бизнеса. Это направление, которым почти никто не занимается по стране, в Кузбассе так и подавно. Благодаря приложению мы — одни из первых, кто объединил эту аудиторию в регионе.

Екатерина Салтыкова

Ведущий продакт-менеджер «ЦифроАрбат»

Смотрите также

Смотреть все работы
Как сделать хороший UX мобильного приложения

Как сделать хороший UX мобильного приложения

Не перегрузить функциями и акцентировать важное. Показываем на примере работы над приложением «Датчик спокойствия».

15 февраля 2019
Разработка мобильного приложения  интернет провайдера для цифрового телевидения

iOS приложение для «Большого ТВ»

Разработка мобильного приложения интернет провайдера для цифрового телевидения