Сайт для ЖК ERA — богатство ар-деко на WebGL

ERA — флагманский проект московского девелопера Tekta group. Это квартал из 6 высоток, переосмысляющий архитектурный стиль ар-деко. Он располагается в Даниловском районе Москвы, на границе между городским центром и периферией.

Для ERA нужен был большой и помпезный промо-сайт. Мы разработали объемный, ценностно насыщенный контент и упаковали его в зрелищный дизайн.

В центре сайта — интерактивная 3D-карта района на WebGL. Это первое решение такого уровня и масштаба в рунете, да и среди сайтов о жилой недвижимости во всем мире аналогов немного.

Отправной точкой бренда стал архитектурный стиль ERA — ар-деко. Изначально у нас был соблазн сфокусироваться на шике и гедонизме в духе “Великого Гэтсби”. Однако слишком агрессивное праздничное настроение не попадало бы в аудиторию. Поэтому мы сменили регистр на более спокойный, уютный и домашний, сохранив основные темы.

Ключевой образ всего сайта — сияющий силуэт здания, который появляется на начальной заставке. Мы создали его с помощью технологии WebGL. Он символизирует эпохальность, значительность появления квартала ERA в городе. Образ подчеркивает слоган: “Начало новой эры”.

Визуальный лейтмотив — световая линия. Она регулярно встречается на сайте в разных формах, делает его узнаваемым. Чтобы сделать эти линии яркими, детализированными и объемными, мы также использовали WebGL.

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

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

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

Одной из амбициозных целей было придать сайту глубину за счет объемных элементов и интерактивных моделей. Для этого мы использовали технологию WebGL, которая позволяет рендерить 3D-объекты прямо в браузере.

Что мы сделали с помощью WebGL?

— Заставку, которая поражает посетителей с первых секунд.

— Интерактивную карту района — уникальную доминанту сайта.

— Декоративные элементы, оживляющие сайт: объемные галереи, параллакс звездного неба и т.д.

3D-карта

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

Мы самостоятельно адаптировали и упростили реальный план района, создали 3D-модель проекта и встроили ее в сайт. Затем отметили ключевые места притяжения и добавили анимацию. В итоге получился живой, открытый к взаимодействию фрагмент города, вовлекающий пользователя. Он позволяет ощутить объемное пространство и дает такой уровень погружения, который невозможен с двумерной картой.

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

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

Такое обильное использование WebGL было неисследованной территорией в области промо-сайтов о недвижимости. Однако в итоге мы получили то, что хотели — масштабные интерактивные элементы, которые увлекают пользователей. В них сконцентрирована тема всего сайта — экстраординарный прорыв, определяющий новые стандарты качества. Именно так мы хотели рассказать об ERA.

Выдающийся результат подтверждают победы на мировых конкурсах: era.center стал сайтом дня на CSSDA и FWA