Собственный концепт для портфолио, без заказчика. Банк «Мята» и условия карты вымышленные.
Задачу поставил себе сам: сделать первый экран лендинга кредитной карты, который не похож на обычный «картинка карты + кнопка». Хотелось, чтобы главный объект на экране не просто крутился для красоты, а давал посетителю что-то сделать.
Взял механику игрового автомата с прищепками. На кольце висят карты, шток сверху нажимает на прищепку, и карта падает.
В лендинге это стало выбором дизайна: на карусели двенадцать вариантов одной кредитки. Кликаешь по понравившейся, кольцо довозит её до штока, карта падает. Справа появляется «Ваш дизайн», а главная кнопка меняется на «Оформить» с названием выбранной карты.
Что ещё сделано:
— двенадцать разных дизайнов карт, каждый со своим рисунком;
— карусель можно крутить мышью или пальцем, карта под курсором подсвечивается;
— ниже отдельный блок со всеми дизайнами, выбрать можно и оттуда;
— мобильная версия: карусель крупная, управляется свайпом и тапом.
Сцена работает прямо в браузере, это живое 3D, а не видео.
Готовый первый экран с десктопной и мобильной версией и рабочей 3D-сценой. Показывает, как из промо-блока сделать полезное действие: посетитель выбирает карту ещё до заявки и идёт оформлять уже «свою».
Такой приём подойдёт для банковских карт, подарочных сертификатов, тарифов, любых продуктов с несколькими вариантами на выбор.