Первый экран обновлённого интернет-магазина Parquet Deco

Задача

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

Старый дизайн интернет-магазина

Проблемы UX

  1. Перегруженный первый экран

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

  2. Категории занимают слишком много пространства

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

  3. Слишком длинные товарные подборки

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

Проблемы UI

  1. Несогласованный стиль иконок и элементов

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

  2. Непоследовательная система отступов

    Расстояния между блоками, карточками и текстом отличаются, поэтому композиция страницы воспринимается неровной и менее аккуратной.

  3. Слабая визуальная иерархия карточек товара

    В карточках одновременно присутствует много мелкой информации, ярлыков и кнопок, поэтому цена и основное действие конкурируют с второстепенными данными.

Новая главная страница Parquet Deco

Каталог с быстрым подбором товаров

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

Продуктовые страницы — каталог

Карточка товара с понятным сценарием покупки

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

Продуктовые страницы — карточка товара

Простая корзина

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

Корзина интернет-магазина

Пошаговое оформление заказа

Процесс разбит на понятные этапы — пользователь всегда понимает, где находится и что нужно сделать дальше. Формы сгруппированы по смыслу, итоговая сумма остаётся перед глазами.

Оформление заказа

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

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

Мобильная версия магазина напольных покрытий