← Главная

АЭРОСМАРТ / Дизайн v3

Передача в сборку ↗
Дизайн-система и состояния · не публичная страница

Всё, что нужно
для точной сборки.

Цвет и типографика

Основной синий#025EA1
Тёмная поверхность#071D2D
Текст#17232D
Светлая поверхность#F2F5F8

Manrope Aa Бб 0123456789

Одна гарнитура с кириллицей. 400 — основной текст; 500–600 — интерфейс и подзаголовки; 700–800 — акценты.

H1 · fluid 35–120

Авиаперевозки

H2 · fluid 34–76

Когда важно время

Текст · fluid 16–19 · 2560: ≥18

Содержание и условия фактов сохраняются на любой ширине экрана.

Действия и фокус

Наведение — темнее цвет и поворот короткой горизонтальной стрелки на −45°. Фокус — контрастная обводка. Минимальная высота основных кнопок — 60 px. Якорь учитывает высоту шапки.

Попап обращения

Открывается по нажатию CTA. Escape и видимая кнопка закрывают окно. Фокус возвращается к исходной кнопке; заполненный текст сохраняется.

Состояния формы

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

Ошибка поляУкажите номер телефона для связи
Отправка
Успех · после ответа обработчикаСпасибо! Заявка отправлена.

Свяжемся с вами по указанному телефону.

СбойНе удалось отправить заявку.

Попробуйте ещё раз или позвоните: 8 800 550-03-13.

Калькулятор клиента

Дизайн обрамления готов. Внутренний интерфейс берётся из готового модуля клиента; расчёт и тарифы не придуманы.

Загрузка · если модуль асинхронный

Загружаем калькулятор…

Ошибка загрузки

Калькулятор временно недоступен. Оставьте заявку — поможем рассчитать доставку

Получить индивидуальный расчёт

Мобильное меню

Адаптивность и движение

Широкий экран

Fluid-контейнер до 1840 px. Открытая полоса фактов, услуги строками, полная таблица сравнения и ручная карусель.

Мобильный экран

390 px: поля 20 px, одна колонка, постер вместо видеопотока. Сравнение в раскрываемых группах; каждый способ транспорта доступен.

Движение по задаче

  1. Фоновое видео и последовательная заливка H2.
  2. Диагональный пролёт самолёта сверху слева вниз направо по прокрутке.
  3. Грузовой отсек: увеличение на экран и исчезновение перед следующим разделом. Включается, если весь сопроводительный текст помещается по высоте.
  4. Ручное переключение проектов с crossfade 450–550 мс; выборочное появление заголовков и преимуществ сверху вниз.

Reduced motion: статичный постер, полностью тёмный текст, мгновенная смена слайда. Колесо и трекпад сглаживаются коротким затуханием; внутри окон, на сенсорном вводе и reduced motion остаётся нативная прокрутка. На узком экране самолёт и фотография статичны. Подробные параметры — в ТЗ.