100500 шагов ради дизайна: как в 2ГИС делают красивую карту понятной

Карта — один из базовых продуктов 2ГИС, на который опираются все остальные. Создание карты не заканчивается её отрисовкой, впереди — её настройка. Для этого мы ездим по разным городам. Этот пост об одной из таких поездок — рассказывает Андрей Кочанов, дизайнер карты 2ГИС.

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

Чем больше мы пользуемся нашими продуктами, тем чаще находим моменты, которые не работают. Или работают не так, как мы задумывали. Особенно сложно находить такие в городе, в котором давно живёшь: карта становится настолько родной, что какие-то недочёты просто не замечаешь.

К примеру, дороги — мы их делим на классы. Оранжевые и широкие — главные федеральные трассы и широкие проспекты, чуть потоньше и жёлтые — междугородние дороги и второстепенные улицы. В Новосибирске, нашем родном городе, у нас получилось показать их так, чтобы можно было визуально отличить главную от второстепенной на любом масштабе карты. Но в Москве наших классов оказалось недостаточно — просто потому что размеры городов разные. Значит, нужны новые классы — и мы их сделали.

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

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

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

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

В полях мы одновременно пользуемся 2ГИС и подобными продуктами: Яндекс Картами и иногда Google Maps: пробуем разные сценарии, отмечаем всё, что бросается в глаза. Или не бросается, а хотелось, чтобы бросалось. Всё это помогает нам оценить нашу карту: общее впечатление, сильные и слабые стороны, предложения по тому, на чём нам стоит сфокусироваться, чтобы быть заметно лучше любого другого продукта. И обязательно улучшить качество здесь и сейчас.

Вот несколько коротких сценариев, как проходили наши будни в Москве.

Притворились туристами и поехали в Хамовники.

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

Провели день на свежем воздухе.

В Мещерском парке изучили тропинки и самые интересные места, искали где пообедать.

Нам нужно было понять, как должна выглядеть идеальная карта для сценариев выходного дня — и решили прокатиться до Бородино. Это музей-заповедник в 130 километрах от Москвы, посвящённый военной истории.

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

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