• 1.Сбор требований к проекту;
• 2.Анализ показателей Google Analytics;
• 3.Анализ целевой аудитории;
• 4.Аудит конкурирующих проектов;
• 5.Формирование рекомендаций;
• 6.Начало работы.

Сбор информации

К получению данных мы подошли основательно: провели интервью с клиентом, изучили показатели Google Analytics, провели аудит других сервисов бронирования билетов. Все интерфейсные решения мы подкрепили фактами — ни один элемент не появился на сайте просто так.

Сначала мы подробно изучили основных конкурентов: структуру их сайтов, решения по выдаче информации и визуальные образы.	Затем сформировали основные сценарии поиска и оформления билетов.	На основе данных Google Analytics, аудита конкурирующих проектов и пользовательских сценариев мы сформировали структуру сайта.

Проектирование

«Билет Онлайн» — интерфейсный проект. Здесь важно не только создать понятную структуру сайта и скомпоновать элементы, но разработать удобный поиск. Мы очистили интерфейс от лишних деталей: информация для поиска билета подгружается последовательно, а для смены даты не обязательно использовать календарь.

Выдачу билетов мы оформили списком — так сравнивать найденные варианты проще. Для того чтобы не перегружать экран, все дополнительные фильтры и ссылки на недавно просмотренные страницы мы поместили в отдельный блок справа от выдачи.

Мы создали интерактивные прототипы каждой страницы и проработали все возможные состояния блоков.

Дизайн сайта

Поиск билетов мы сопроводили видом из окна самолёта: фон сайта меняется в зависимости от времени суток.

На этапе дизайна сформировали правила: информация о перелётах помещается в тёмные блоки, а элементы поиска и фильтры располагаются на светлом фоне. Правило мы применили и в оформлении кнопок, выделив важные «призывы к действию» ярким цветом.

Мы внимательно проработали компоновку деталей полёта — сделали акцент на самом главном: времени отправления и прибытия, длительности полёта и количестве пересадок.

Подробная информация о билете подана вертикально: пользователь просматривает страницу в той последовательности, в которой будут проходить перелёты.	Сайт запоминает пассажиров: если у пользователя есть аккаунт, ему не придётся заново вводить данные тех, с кем он привык путешествовать.

Мы проработали все состояния элементов и оформили около 30 экранов.

Вёрстка и программирование

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

Перейти на сайт