Логотип, сайт, визитки «Сириус-Аэро»

О проекте

ООО «Авиакомпания «СИРИУС-АЭРО» — крупнейшая частная компания бизнес-авиации в России. Авиакомпания выполняет чартерные перелёты на собственных воздушных судах VIP-класса.

Перед разработкой нового сайта команда Iris Digital провела работу над фирменной идентикой компании. Мы модернизировали логотип «СИРИУС-АЭРО», сохранив его узнаваемость и ключевые визуальные особенности, но сделав начертание более современным и удобным для использования в цифровой среде.

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

Задача

После обновления визуальной идентичности заказчик обратился в веб-студию Iris Digital для модернизации действующего сайта. На момент начала работ сайт:

• работал без системы управления контентом;
• имел устаревший визуальный стиль;
• был сложен для дальнейшего развития;
• не позволял оперативно дорабатывать функционал и обновлять контент.

Перед командой стояли следующие задачи:

1. Разработать современный дизайн сайта с учётом обновлённой фирменной идентики.
2. Сделать интерфейс более выразительным и соответствующим сфере бизнес-авиации.
3. Перенести сайт на CMS.
4. Реализовать адаптивную верстку для мобильных устройств.
5. Добавить интерактивные элементы и анимацию.
6. Разработать дополнительный функционал.

Разработка визуальной концепции

На первом этапе команда Iris Digital подготовила дизайн-концепцию и описала поведение основных элементов интерфейса.

Первый вариант показался заказчику слишком сдержанным:

Мы учли замечания заказчика и объяснили особенности выбранного подхода: плоского дизайна, параллакс-эффектов и трансформации элементов.

Чтобы сравнить разные стилистические направления, дополнительно разработали ещё три варианта дизайна в более привычном корпоративном стиле.

Первый вариант:

Второй вариант:

Третий вариант:

Выбор общей концепции

После просмотра вариантов заказчик остановился на первом направлении.

Работа над главным экраном

Следующим этапом стало обновление главного экрана сайта. Главный визуальный образ должен был подчёркивать динамику и специфику авиакомпании — самолёт должен был не просто находиться в кадре, а лететь.

Команда подготовила несколько вариантов композиции:

• вариант с другим ракурсом самолёта;

• вариант с более заметными облаками;

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

Разработка внутренних страниц

После утверждения главного экрана команда перешла к разработке внутренних страниц сайта.

Отдельное внимание уделили шапке сайта и её поведению при прокрутке. Мы подготовили два варианта отображения фиксированной шапки:

1. Шапка сохраняет первоначальный вид при прокрутке.

2. Шапка меняет размер и закрепляется в более компактном формате.

Заказчик выбрал второй вариант как более удобный и визуально лёгкий.

Верстка и функциональная разработка

После утверждения дизайна мы:

• выполнили адаптивную HTML5/CSS3-верстку;
• добавили анимационные эффекты;
• реализовали изменение и закрепление шапки при прокрутке;
• интегрировали готовую верстку с UMI.CMS;
• разработали дополнительный функционал;
• адаптировали сайт для корректного отображения на мобильных устройствах.

Тестирование

Удобство просмотра сайта на мобильных устройствах проверили с помощью сервиса Google. Это позволило убедиться, что страницы корректно отображаются на разных экранах и соответствуют требованиям адаптивности.

Результат

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

• разработка нового дизайна;
• создание интерактивного главного экрана;
• реализация анимации и эффектов на HTML5/CSS3;
• адаптивная верстка;
• интеграция с UMI.CMS;
• разработка дополнительного функционала;
• проверка отображения сайта на мобильных устройствах.

Вывод

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