• Веб
  • Пулково
  • Логотип Навигация Сайт

    Создание сайта аэропорта Пулково

    Описание Процесс

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

    Определяемся с картой сайта.

    Создаем схемы основных разделов.

    Начинаем работать над концепцией.

    Идем от частного к общему, думаем над основным элементом главной страницы — табло рейсов.

    Появляется мысль брендировать логотип в соответствии с выбранным направлением.

    Пробуем заглянуть в будущее.

    Примеряем альтернативное стилевое решение.

    А если сконцентрироваться на здании нового терминала?

    Едем в строящийся терминал, вдохновляемся архитектурой и пробуем привязать элементы сайта к формам аэропорта.

    Переходим в изометрическое пространство, но при клике по элементам показываем их в привычном плоском виде.

    Пробуем подход с псевдотрехмерными фотографиями на подложке.

    А что, если внести немного жизни и добавить плашку со стюардессой?

    Разверстываем все на одну длинную страницу.

    Арт-директор: Никто не будет так долго крутить.

    Делаем компактнее и ставим более приближенное к жизни табло.

    Арт-директор: Было интереснее.

    Уже лучше. Добавляем слайдер блоков, проводим фотосессию и показываем клиенту.

    Рисуем внутреннюю страницу «Пассажирам» и думаем, что показывать на экранах с большим разрешением.

    Делаем раскрывающуюся карточку рейса.

    Клиент: А где Питер? Похоже на сайт аэропорта любого другого города. И мрачновато.

    Облегчаем и добавляем больше Питера.

    Нет, слишком много Питера. Оставляем другой вариант главной.

    Собираем типовую страницу.

    Дорабатываем главную, убираем косую плашку и рисуем иллюстрацию для терминала.

    Пока собираются основные разделы, думаем над схемой аэропорта. Собираем примеры схем других аэропортов.

    Между собой борются два подхода: плоская схема c видом сверху и трехмерная изометрическая.

    С одной стороны, плоская более технологичная, ее можно наложить на карты «Гугла» и ее проще менять. С другой стороны, терминал состоит из 4 уровней и на изометрической схеме легче следить за маршрутами перемещения между этажами.

    Останавливаемся на изометрической концепции, но с плоскими этажами. Отрисовываем схему.

    Ставим на сайт, добавляем обвязку в виде списка точек, поиска и маршрутов.

    Объясняем технологу принципы работы.

    Адаптируем все иконки навигации для мелкой веб-версии схемы.

    Двигаемся дальше. В разделе направлений решаем показать стилизованную карту с маршрутами полетов.

    Работаем над остальными страницами.

    Возвращаемся к главной. Дорабатываем баннер, табло и информационные блоки.

    Рисуем самолет для главной страницы.

    Определяемся с логикой работы табло и статусов рейса.

    Фотографируем людей для страницы пассажиров.

    Рисуем баннеры внутренних разделов.

    Готовим иконки для раздела пассажиров.

    Делаем страницу 404 на основе системы навигации.

    Вносим правки и тестируем сайт.