Живая карта: редизайн новогоднего слоя в 2ГИС

Традиционно 1 декабря в 2ГИС включается зимний слой — это особый режим карты, который превращает привычный город в зимнюю сцену: меняются цвета карты, появляются тематические 3D-модели, украшения и анимации.

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

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

Задача: обновить зимний слой

Обновление новогоднего слоя стало моей первой большой задачей с командой 3D-моделирования. Нам предстояло немного доработать существующие модели и добавить несколько новых элементов.

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

Нам захотелось превратить декоративный слой в цельный эмоциональный опыт.

Как решали?

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

Мы задали принципы:

• упрощённые формы без мелкой детализации;

• чистая мягкая цветовая палитра;

• очаровательный образ модели;

• эмоциональная анимация.

Как были сформулированы основные цели и принципы, настало время создания концептов для команды моделирования.

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

Дизайнер подробно описывал модель, собирал по кусочкам референсы и передавал моделлеру. Затем следовало несколько итераций с изменениями, которые снова описывались текстом и ссылками на референсы. Затем наступал этап создания анимации, и процесс повторялся.

У такого подхода были весомые недостатки:

😕 Высокая зависимость от текстовых описаний. Ключевые визуальные решения (форма, пропорции, характер, «настроение» модели) передавались словами и референсами, что неизбежно приводило к разночтениям.

😣 Потеря замысла при интерпретации. Один и тот же референс мог по-разному считываться дизайнером и моделлером, из-за чего результат часто расходился с первоначальными ожиданиями.

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

😬 Слабая масштабируемость. Такой формат неплохо работал точечно, но тяжело масштабировался на большое количество моделей.

И моя личная боль:

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

И тогда на помощь команде пришли нейронки!

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

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

После плоской примерки на карту референс отправляли в нейронку Tencent для создания 3D-модели.

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

Затем команде улетает практически полностью выверенное ТЗ для создания модели. Команда моделирует и текстурирует с нуля, опираясь на «черновую» модель из Tencent. Затем обычно вводятся практически минорные правки по оттенкам и формам.

Дальше модель нужно анимировать, и здесь я могу смело сказать, что нейронки по-настоящему спасают!

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

Такой AI-модифицированный пайплайн в разы ускорил и упростил процесс работы над моделями, и мы позволили себе разгуляться!

Следом на праздничном драйве мы подготовили ещё пачку моделей для тематических локаций:

• ледовые городки;

• грузовички для ёлочных базаров.

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

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

Итоги в цифрах

х2.5 вырос DAU относительно целевых ориентиров.

670к пользователей оставило слой включённым.

+ 35% выросла интенсивность кликов в модели по сравнению с прошлым годом.

Итоги команды

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

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

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

Мои личные итоги

Для меня это был первый крупный проект вместе с командой 3D-моделирования и первый опыт запуска нового рабочего процесса внутри команды. AI-инструменты дали мне очень важное ощущение скорости и живого эксперимента: появилась возможность практически мгновенно проверять идеи прямо на карте, быстро тестировать гипотезы и не терять эмоциональный импульс во время работы.

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

Это не единственный крутой дизайнерский кейс. Хотите делать подобное вместе с нами — смотрите открытые вакансии.

Источник: habr.com