Карта, с которой не уходят

TrendAgent — B2B-платформа для агентов по недвижимости: поиск, карточки ЖК и квартир, презентации клиенту, сделки. Одно и то же должно работать и в офисе на вебе, и в разъездах в приложении — агент не выбирает устройство, он работает там, где оказался.

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

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

Своя карта у платформы была, но слабая: пины и все. За тем, ради чего карту вообще открывают, агенты уходили во внешние — чаще всего в Яндекс. Как доехать, какая дорога вечером в четверг, как выглядит улица, где припарковаться.

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

• Маршрут от ЖК или корпуса до работы, метро, школы
• Панорамы улиц — понять окружение, не выезжая
• Пробки не только «сейчас», а в час поездки клиента
• Парковки рядом с комплексом

Задача была не «подключить API». Яндекс Карты — способ, а не результат: агент должен остаться в продукте на тех же вопросах, которые он уже решает в чужом приложении.

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

60%

за группировку объектов по умолчанию

75%

смотрят на минимальную цену на пине

50%

ждут на пине название объекта

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

Цена и название — не украшение пина, а причина по нему кликнуть. Три четверти агентов выбирают район именно по минимальной цене, поэтому она попала на пин, а не в карточку, которая открывается кликом.

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

Правило простое: включил функцию — остальные выключились. Иначе маршрут, пробки и панорама рисуются друг на друге и карта превращается в кашу. Пины объектов на маршрутах, пробках, панорамах и парковках гаснут — они мешают слою.

	Пины объектов
Маршруты, пробки, панорамы, парковки	Гаснут
Линейка	Остаются
Объект выбран и включили маршрут	Его пин остается, адрес идет в «Откуда»

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

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

	Пин
Жилье	Синий, иконка дома
Коммерческая недвижимость	Оранжевый, иконка портфеля
Машиноместа и паркинги	Черный, иконка машины

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

Цвет здесь несет данные, а не настроение. Три цвета — три экономики: квартиру, офис и машиноместо агент продает по-разному, и путать их на карте дороже, чем добавить легенду.

На близком зуме ЖК перестает быть точкой и становится стройкой из корпусов. Тогда на карте появляются контуры домов и пины вида «К.4 · Completed», «К.12 · Q4/2024» — номер корпуса и срок сдачи.

Срок сдачи дублируется цветом: сдано, 2023, 2024, 2025 и позже. Это тот вопрос, который клиент задает вторым после цены, — и раньше ответ на него лежал в карточке, а не на карте, где стоит сам дом.

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

Три вида транспорта, и каждый рисуется по-своему, потому что важное в них разное.

	Что показывает
Автомобиль	Зеленая линия, альтернативный путь серым, платные дороги
Общественный транспорт	Сплошная линия с пересадками и цветами ветвей метро
Пешком	Пунктир, расстояние и время

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

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

Пробки — не «сейчас». Клиенту важно, как дорога выглядит в его поездку: утром в среду или в шесть вечера в пятницу. Поэтому у функции два режима — «сегодня» и статистика, а внутри статистики день недели и ползунок часа от 0 до 24.

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

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

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

Парковки — пины мест с названием, адресом и графиком. Линейка ставит точки кликом и показывает расстояние в тултипе; пины домов при ней не гаснут.

Парковки на карте не заменяют паркинг в карточке ЖК. Это два разных вопроса: «где оставить машину у дома» и «есть ли машиноместо в продаже». Второй — это уже черный пин из системы выше.

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

• На вебе панель функций и панель маршрута живут рядом с картой
• В приложении карточка объекта поднимается снизу поверх карты
• Фильтры на мобильном — короткий ряд: цена, тип, площадь, метро
• Кластер с числом объектов работает одинаково и там, и там

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

1. Кластер не объясняет свой состав. По клику на группу не всем понятно, какие объекты в нее вошли: обводка полигона слишком незаметная.
2. Пины без цены выглядят сломанными. В разгруппированном виде непонятно, почему у части пинов цена есть, а у части нет. Логика «цена гаснет, когда наезжает» изнутри не читается.
3. Панель маршрута не находят с первого раза. Агенты искали точку отправления зумом и поиском, не сообразив, что оба адреса вводятся прямо в панели.

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

Еще одна претензия была не к карте: по парковкам агенты чаще спрашивают про закрытый паркинг в ЖК и про «платная или бесплатная», а этого в слое нет. Слой отвечает на вопрос про район, а не про объект.

1. Карту открывают не чтобы искать лот, а чтобы не уходить в Яндекс за маршрутом, пробкой и улицей. Метрика успеха — агент остался в продукте.
2. Опрос снял спор о вкусах: 60 на 40 по группировке значит, что ее нельзя навязать, а 75% по минимальной цене — что цена живет на пине, а не в карточке.
3. Одна функция за раз и погашенные пины — иначе слои убивают друг друга. Линейка — единственное исключение, и по делу.
4. Три типа объектов и три цвета вместо одинаковых пинов: квартира, офис и машиноместо продаются по-разному, и карта обязана их различать.
5. Пробки без маршрута и парковки без паркинга в ЖК отвечают не на тот вопрос, который агент несет клиенту.