Калькулятор

+7 (499) 350-07-79

КудаБежать
Мобильный навигатор по велосипедным и пешеходным маршрутам: приложения для Android и iOS и панель администратора

Заказчик

Федеральный медиахолдинг, который формирует картину дня
Холдинг 1MI, созданный в 2016 году — один из крупнейших в стране. В него входят несколько федеральных и региональных СМИ, а также паблики в социальных сетях. Ежемесячно ресурсы посещают около 14 млн пользователей.

Задача

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

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

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

Станислав

менеджер проектов WINFOX

Решение

Доверились Flutter, продумали каждую анимацию и разработали админ-панель для управления приложением
Сделали прототипирование, дизайн и разработку приложений для Android и iOS, а также код для панели администратора.

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

Бэкенд реализовали как классический REST на фреймворке Yii2.

«Использовали библиотеку Intervention Image для сжатия изображений и применили подход поэтапной и возобновляемой загрузки файлов с помощью TUS-библиотеки. Firebase помог нам организовать авторизацию через Google-аккаунт и отправку пуш-уведомлений».

Валерий

разработчик WINFOX

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

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

Дмитрий

UX/UI-дизайнер WINFOX

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

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

От авторизации по смс мы отказались: этот способ дороже в реализации.
Авторизация привычными способами
Интеграция с Яндекс Картами
Приложение использует интерфейс карт, наиболее привычный жителям России. У Яндекс Карт хорошая детализация и они часто обновляются. 
Интеграция с Яндекс Картами
Поиск маршрутов
В нижнем меню закреплена кнопка, кликнув на которую пользователь видит список доступных маршрутов в зависимости от его геолокации.

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

Каждый маршрут схематично показан на карте, а чтобы его начать, достаточно нажать «Погнали» внизу экрана.
Избранные маршруты
Фото и видео маршрута
Чтобы быстрее понять, как выглядит маршрут и местность, мы добавили возможность загружать медиа.

Пользователь может полистать фото и посмотреть видео, которые добавили другие.
Фото и видео маршрута
Создание маршрута
Приложение фиксирует, как двигается пользователь. Этот путь можно потом превратить в авторский маршрут, добавив название, описание, протяженность и другие характеристики — и поделиться маршрутом с другими.

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

Станислав

менеджер проектов WINFOX

менеджер проектов WINFOX
Редактирование авторского маршрута
Если пользователь добавил маршрут, а потом захотел в нем что-то поменять, он может его отредактировать. Мы предусмотрели такую возможность.
Редактирование авторского маршрута
Следование по маршруту
Приложение подсказывает, как проходит маршрут: пользователь видит подсказки вверху экрана. 

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

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

«Все отзывы пользователей модерируются — это позволяет следить за контентом в приложении».

Станислав

менеджер проектов WINFOX

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

«Графический интерфейс панели администратора реализован с помощью Vue.js — популярного JavaScript-фреймворка с открытым кодом. За отправку запросов на сервер у нас отвечает HTTP-клиент Axios, который поддерживает все популярные браузеры».

Анастасия

разработчик WINFOX

Управление администраторами
Админ-панель позволяет разграничивать уровни доступа пользователей.

Например, пользователю можно назначить роль модератора или администратора.
Управление администраторами
Управление маршрутами
Администратор может просматривать и изменять все маршруты, которые отображаются в приложении.

Маршруты можно сортировать по названию, локации, автору, протяженности и другим параметрам.
Управление маршрутами
Модерация отзывов
Администратор просматривает отзывы перед тем, как они становятся доступны в приложении.

Если отзыв содержит ненормативную лексику или не соответствует действительности, его можно удалить или отправить на доработку.
Модерация отзывов

Результат

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

Активная разработка приложения и панели администратора заняла около шести месяцев.

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

Станислав

менеджер проектов WINFOX

Команда проекта
Менеджер проекта
Станислав
Технический директор
Александр
UX/UI-дизайнер
Дмитрий
Разработчики
Валерий 
Анастасия
Сергей
Иван
Бахтияр
Тестировщики
Алексей 
Михаил
Технические писатели
Никита
Скачать

Другие работы

Amber CRM

Мобильная CRM система для организации работы сотрудников в полях - разработка Android приложения

XO Player

Музыкальный плеер с мощным эквалайзером и богатейшей фонотекой Soundcloud - разработка мобильного приложения для Android

Расскажите про свой проект

Pуcтам Myxамедьянов

Руководитель студии

Имя

Компания

E-mail

Телефон

Сообщение

Планируемый бюджет

₽ 500 000

₽ 1 500 000

₽ 2 500 000

Для отправки нажмите чекбокс с условиями