Выбор оптимального ракурса и источников графики, эскиз

Несмотря на то, что главный вход расположен со стороны Выставочного переулка, точка обзора была взята с противоположной стороны, чтобы видеть все пути въезда, а также 3-е транспортное кольцо.

Сначала был создан предварительный макет карты с использованием наземных фотографий и фото со спутника.

Более детальная и качественная прорисовка статичной карты

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

Расчет путей следования машин

АФИМОЛЛ имеет 3 доступа к парковкам. Синий цвет путей следования (см. иллюстрацию выше) оказался малозаметным, к тому же въезды на парковки осуществляются с трех разных направлений, поэтому было решено обозначить пути тремя разными цветами: желтым, красным и зелёным. Ниже приводятся рабочие эскизы.

Начало flash-анимации

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

Для анимации были созданы изображения автомобилей разного цвета и в разных положениях. Также были нарисованы всплывающие подсказки и знаки.

Корректировка flash-анимации и знаков

После просмотра заказчиком демо-версии карты поступило предложение разделить траектории для каждого направления на те, которые идут к ТРЦ АФИМОЛЛ с запада, и те, которые идут к нему с востока, так как одновременное движение трех автомобилей вызывало у людей некоторое раздражение и дискомфорт. Как выглядит финальная версия меню — показано ниже.

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

В заключение был нарисован новый знак метро и добавлены всплывающие фотографии въездов.

Публикация на сайте

Перед публикацией к flash-карте был добавлен прелоадер, а свойства карты были настроены так, чтобы она могла растягиваться в зависимости от величины окна, в котором находится.

Результат разработки можно посмотреть на сайте АФИМОЛЛ Сити.