Европа
ТРЦ в Липецке, в котором есть два атриума, оформленных под разные европейские города: Париж и Лондон. Занимает 60 000 квадратных метров. Ежедневная посещаемость — 982 000 человек. В настоящий момент строится вторая очередь ТРЦ, с вдвое большей площадью.
Задача
Разработать сайт ТРЦ, который будет служить одновременно инструментом привлечения арендаторов и платформой с полезной для покупателей информацией.
![<p><b>В дизайне сайта нужно было предусмотреть преемственность мотивов самой «Европы» — там очень оригинальное тематическое оформление интерьера.</b></p>](https://s29805.cdn.ngenix.net/upload/iblock/ec5/xec58464969d3a7a103cb6e0cdf2ac006.jpg.pagespeed.ic.HWCvFN7bfQ.jpg)
Аналитика и дизайн
Начинаем работу с уточнения потребностей проекта. Используем скетчи, чтобы сделать структуру, которая удовлетворяет задачам сайта. Попасть в ожидания заказчика от визуальной части помогают мудборды.
![<p><b>Опираясь на обратную связь, предлагаем следующую концепцию главной страницы:</b></p>](https://s29805.cdn.ngenix.net/upload/iblock/568/x56878a152a2ea7c0912a4a7a712bd163.jpg.pagespeed.ic.Y2KVje3ZLI.jpg)
Получаем одобрение и переходим к дизайну.
![<p><b>Создаем традиционные для презентационного сайта разделы: фотогалереи, новости, история ТРЦ.</b></p>](https://s29805.cdn.ngenix.net/upload/iblock/7b5/x7b5310f51ee11ed3317c1ae987237c3d.jpg.pagespeed.ic.iSsUm3bB5a.jpg)
![<p><b>Мы поместили контурные иллюстрации с европейскими городами на задний план страниц.</b></p><p>Так решилась задача с преемственностью в дизайне — плюс к этому, картинки не статичные, они реагируют на положение курсора.</p>](https://s29805.cdn.ngenix.net/upload/iblock/3ef/x3ef91f7f5b091bdbf986cbb2f7d8c1c2.jpg.pagespeed.ic.DxblhaGqAp.jpg)
![<p><b>Наиболее интересная часть — карта.</b></p><p>Мы получили исходный план ТРЦ и полностью отрисовали эту схему для сайта. Это не статичная картинка, а интерактивный план, на котором можно узнать, где какой отдел находится. Кроме того, что она реагирует на клики по отделам, у карты есть еще любопытная особенность — в админке можно обозначать место входа в павильон с помощью координат. На карте оно обозначится стрелкой. Удобно для посетителей.</p>](https://s29805.cdn.ngenix.net/upload/iblock/32f/x32f278fc63ca25f9b1d309a511d788a1.jpg.pagespeed.ic.015PaFJdVS.jpg)
Верстка и код
![<p><b>У «Европы» есть страница со списком арендаторов, с бесконечным скроллом и фильтром.</b></p>](https://s29805.cdn.ngenix.net/upload/iblock/1fc/x1fc143d2fe5974c72130ae0066200458.jpg.pagespeed.ic.ejzn10ZJKx.jpg)
![<p><b>Для каждого арендатора павильона загружается его логотип, заполняется описание, номер павильона, сайт компании, рабочие часы и контакты.</b> Также добавляется фотогалерея.</p>](https://s29805.cdn.ngenix.net/upload/iblock/4b1/x4b1bfb7ac45aa473a23b8df08e52c1df.jpg.pagespeed.ic.CE6iCyVCbp.jpg)