Аренда велосипедов:
карта, которая вовлекает

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

01 · Идея

Карта из статичного элемента —
в главного героя интерфейса

Пользователь скроллит страницу — и маршрут рисуется прямо на карте. Это не только визуальный приём, но и понятная демонстрация логики продукта: от точки А до точки Б, от поиска до поездки.Переключайте этапы — и маршрут появится прямо на карте. Так видно весь сценарий продукта: от поиска велосипеда до завершения поездки.

02 · Контекст и задача

Рынок, где выигрывает тот, кто быстрее объясняет

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

Контекст

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

Задача

Сделать интерфейс, который объединяет три вещи:

  • быстрый поиск велосипеда;
  • понятное построение маршрута;
  • игровую мотивацию возвращаться снова.
03 · Что сделали

Прокрутите — маршрут построится самПостройте маршрут по шагам

Пять решений, которые складываются в один сценарий: от поиска велосипеда до баллов за поездку.

↓ Листайте вниз — маршрут раскрывается по шагам

ПАРК НАБЕРЕЖНАЯ СТАДИОН ЦЕНТР N
Ваша точка
Станция №4 · 6 велосипедов
Центр · обмен батареи
Набережная · живописный участок
Точка назначения
Маршрут
0%
маршрут станция аренды велосипед в пути
  1. 01 Интерактивная карта

    Карта реагирует на скроллМаршрут появляется шаг за шагом

    Линия маршрута постепенно прочерчивается, показывая путь от станции до цели. Это создаёт эффект живого интерфейса и сразу объясняет, как работает сервис.Нажимайте на стрелки: маршрут прокладывается от станции до цели и показывает, как работает сервис.

  2. 02 Быстрый поиск

    Велосипед находится за секунды

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

  3. 03 Маршруты

    Кратчайший, живописный или безопасный

    Пользователь выбирает точку назначения — система предлагает три варианта маршрута. Всё строится в одно касание.

  4. 04 Геймификация

    Баллы за каждую поездку

    Открываются достижения: «Первый километр», «Ночной гонщик», «Исследователь». Можно соревноваться с друзьями и обменивать бонусы на бесплатные минуты.

  5. 05 Прототип

    Кнопка «Попробовать»

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

Нажимайте на стрелки, чтобы переключать этапы

01 / 05
04 · Геймификация

Игровой слой, из-за которого возвращаются

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

Баланс баллов
0
Уровень 3 · Городской
Уровень 31 240 / 1 500 до уровня 4
  • 1Аня К.1 840
  • 2Вы1 240
  • 3Марк Т.1 105
  • 4Лера С.980

Обмен бонусов на бесплатные минуты:

200 баллов = 15 минут 500 баллов = 45 минут 1 000 баллов = день аренды
05 · Прототип

Попробуйте прямо здесь

Выберите тип велосипеда и нажмите на любую станцию — маршрут построится, а система посчитает время, километры и начислит баллы.

Вы здесь

Выберите станцию

Тип велосипеда
—км
—мин
—баллов
Нажмите на станцию на схеме — маршрут построится за одно касание.
Баллы: 10 за каждый километр + бонус типа велосипеда. Электро — +30% к баллам, но тариф выше.
06 · Результат

Карта стала не фоном, а инструментом вовлечения

  • Понятная точка входа — пользователь видит сценарий до регистрации
  • Быстрый сценарий аренды: от открытия до старта — секунды
  • Игровой слой, который мотивирует возвращаться
  • Один визуальный язык: карта, маршрут и прогресс читаются одинаково на всех экранах

Хотите такой же интерфейс
для своего проекта?