Ova — бренд премиальных очков
Тёмный кинематографичный одностраничник для концепт-бренда очков: экраны-сцены при скролле, коллекция в четырёх цветах и фирменный перспективный леттеринг.
Задача
Ova — концепт премиального бренда очков: прозрачный кобальтовый ацетат, полированные стальные шарниры и медовые линзы. Лендинг должен был ощущаться так же дорого, как сам продукт, — минималистично, на тёмном, каждый экран как страница модного лукбука — и при этом продавать: показать оправу, коллекцию и привести к листу ожидания.
Идея
Страница построена на контрасте: глубокий чёрный, один сильный кобальтовый синий и крупная белая типографика. Каждый экран — отдельная сцена, которая «прилипает» к окну и меняется при скролле, поэтому лендинг смотрится как короткий фильм, а не длинная лента. Цвет используется скупо и всегда по делу: синий, оранжевый, белый и зелёный — четыре цвета коллекции.
Первый экран
Портрет на половину экрана, слоган, набранный вертикально фирменным леттерингом, и две кнопки. Страница открывается сразу с фото, затем на лице проявляются очки, на фоне медленно плывёт синее свечение, а раз в несколько секунд по картинке пробегает короткий глитч.
Design
Оправа поворачивается при скролле: спереди, в три четверти, в профиль, а за ней огромным кеглем стоит слово «cobalt». Дальше камера переходит к деталям — пятизвенному шарниру и стальному сердечнику дужки — с медленным параллаксом внутри каждой картинки.
Коллекция
Четыре оправы в четырёх цветах на горизонтальной ленте. Каждый шаг меняет фон всего экрана: синий, оранжевый, белый, зелёный. По нажатию на карточку открывается попап с полным описанием, характеристиками с иконками, размерами и ценой.
Mood
«Wear your light» набрано перспективным леттерингом. Строки выкатываются по одной при скролле и перебирают четыре цвета коллекции, а поверх лежит оправа.
Story
История одной оправы — от верстака до коробки и магазина — рассказана горизонтальной лентой, которую двигает обычный вертикальный скролл. Меню следует за пользователем и подчёркивает текущий раздел.
Лист ожидания
Последний экран объединяет форму и футер: выбрать цвет, оставить почту, а ниже — полноценный футер со ссылками. Портрет с первого экрана закрывает страницу.
Мобильная версия
На телефоне каждый экран сохраняет свою сцену: бургер открывает полноэкранное меню, коллекция помещается на один экран даже на iPhone SE, леттеринг подстраивается под высоту экрана.
Результат
Премиальный одностраничный сайт бренда, где главный герой — продукт: один акцентный цвет на экран, крупная типографика и анимация, которая показывает оправу, а не украшает страницу.
