Несмотря на то, что главный вход расположен со стороны Выставочного переулка, точка обзора была взята с противоположной стороны, чтобы видеть все пути въезда, а также 3-е транспортное кольцо.
Сначала был создан предварительный макет карты с использованием наземных фотографий и фото со спутника.
В целом заказчика устроил данный эскиз, и мы приступили к более детальной и качественной прорисовке карты. При этом в полной мере были учтены особенности конструкций зданий, было создано реалистичное окружение, а также исправлены некоторые ошибки.
АФИМОЛЛ имеет 3 доступа к парковкам. Синий цвет путей следования (см. иллюстрацию выше) оказался малозаметным, к тому же въезды на парковки осуществляются с трех разных направлений, поэтому было решено обозначить пути тремя разными цветами: желтым, красным и зелёным. Ниже приводятся рабочие эскизы.
Согласно рассчитанным маршрутам, было решено сделать 3 кнопки, каждая из которых запускает анимацию движения автомобилей данного направления ко всем трем парковкам. При наведении на кнопку на карте появляется разветвленный путь со стрелкой, а при нажатии на кнопку — начинается движение.
Для анимации были созданы изображения автомобилей разного цвета и в разных положениях. Также были нарисованы всплывающие подсказки и знаки.
После просмотра заказчиком демо-версии карты поступило предложение разделить траектории для каждого направления на те, которые идут к ТРЦ АФИМОЛЛ с запада, и те, которые идут к нему с востока, так как одновременное движение трех автомобилей вызывало у людей некоторое раздражение и дискомфорт. Как выглядит финальная версия меню — показано ниже.
Кроме этого, окончательно было определено, какие подсказки будут всплывать при движении автомобилей, а также какие названия будут появляться на карте.
В заключение был нарисован новый знак метро и добавлены всплывающие фотографии въездов.
Перед публикацией к flash-карте был добавлен прелоадер, а свойства карты были настроены так, чтобы она могла растягиваться в зависимости от величины окна, в котором находится.
Результат разработки можно посмотреть на сайте АФИМОЛЛ Сити.
Проведите конкурс среди участников CMS Magazine
Узнайте цены и сроки уже завтра. Это бесплатно и займет ≈5 минут.