Дизайн інтернет-магазину кальянів True Cloud

Задача

Спроєктувати сучасний дизайн інтернет-магазину кальянів, тютюну та аксесуарів True Cloud зі зручною фільтрацією каталогу та швидким оформленням замовлення.

Зроблено

Дизайн

Адаптиви

Головна

Головна сторінка поєднує атмосферний темний банер із чистим світлим каталогом, де товари вигідно виділяються на білому фоні. Під першим екраном розміщена візуальна плитка з 6 основних категорій (електронні сигарети, тютюн, вугілля, аксесуари, кальяни, китайський чай) та добірки хітів продажів, новинок і знижок.

Каталог

Сторінка каталогу спроєктована для швидкого підбору товарів серед сотень позицій: ліворуч винесено меню категорій, повзунок діапазону цін і фільтр за брендами, а зверху — швидкі підкатегорії та сортування. Лаконічні картки товарів містять бейджі новинок і знижок, додавання в обране та миттєву покупку.

Давайте працювати разом.

Готові втілити ваше бачення у життя? Давайте об'єднаємося для вашого наступного проєкту та разом створимо щось незабутнє.

// Type some code ->
console.log "oO08 iIlL1 g9qCGQ ~-+=>";
var paddingTop = 'px';
var sectionRadius = 'px';
// Interactive Theme Configuration
function updateButton(config) {
var radius = 'px';
btn.style.borderRadius = radius;
}
updateButton({ active: true });

Розробник

Color Styles

Pink

Purple

Orange

Green

Blue

Дизайнер

Картка товару

У картці товару зроблено акцент на детальному огляді комплектації та характеристик кальяну: вертикальна галерея ракурсів, статус наявності, кнопки основного та швидкого замовлення. Поряд структуровані технічні параметри (висота, матеріал шахти й чаші, тип з'єднання), умови доставки та каруселі супутніх і переглянутих товарів.

Кошик

Окрема сторінка кошика наочно показує обрані позиції, колір, кількість і вартість кожного товару. У блоці підсумку реалізовано мотиваційний індикатор суми, якої бракує до безкоштовної доставки, що стимулює покупця додати супутні розхідники.

Оформлення замовлення

Процес оформлення замовлення розділено на 2 логічні кроки без візуального перевантаження. На першому етапі покупець вводить контактні дані (як новий або постійний клієнт), а на другому — обирає службу доставки (Нова Пошта, Укрпошта), спосіб оплати та застосовує промокод.

Крок 1: Контакти

Крок 2: Доставка й оплата

Мобільна версія

Усі ключові сторінки магазину адаптовані під мобільні пристрої з акцентом на швидкий пошук та фільтрацію в один дотик. Зручна сітка каталогу в 2 колонки та компактний чекаут забезпечують високу конверсію зі смартфонів.