web-designhh@yandex.ru
Обсудим проект?
Дизайн
инструментов для дома
магазина
Интернет-магазин ювелирных украшений
Цели, задачи
Стояла задача разработать дизайн интернет-магазина инструментов для дома. Нужно было переработать структуру старого сайта, добавить новый функционал и страницы.
О проекте
Крупнейший продавец электроинструментов, сварочного, силового и теплового оборудования на Урале
Что сделано
Анализ старого сайта
Проработка UX
Дизайн-концепции
Дизайн всех страниц в Figma
Анимированные прототипы
Планшетная и мобильная версия
Подготовка к верстке
Проработка UX
Дизайн-концепции
Дизайн всех страниц в Figma
Анимированные прототипы
Планшетная и мобильная версия
Подготовка к верстке
более 50 часов
время разработки
Концепции
У заказчика не было предпочтений по дизайну, поэтому предложила абсолютно разные стилистики
Главная
Задача главной страницы
Главная страница интернет-магазина — это визитная карточка и точка входа для большинства пользователей. Она играет ключевую роль в привлечении, удержании и навигации посетителей. Ее основное назначение — создать положительное первое впечатление, упростить доступ к основным категориям и товарам, а также подтолкнуть посетителей к целевому действию (покупке, регистрации и т. д.).
Главная страница интернет-магазина — это визитная карточка и точка входа для большинства пользователей. Она играет ключевую роль в привлечении, удержании и навигации посетителей. Ее основное назначение — создать положительное первое впечатление, упростить доступ к основным категориям и товарам, а также подтолкнуть посетителей к целевому действию (покупке, регистрации и т. д.).
Что сделано
Проработка верхней навигации
- Удобное меню с доступом к основным категориям товаров.
- Добавлен заметный поиск с автозаполнением для быстрого нахождения товаров.
- Основной баннер демонстрирует текущие скидки, сезонные предложения и специальные акции.
- Используется яркий и привлекательный дизайн, чтобы сразу привлечь внимание пользователя.
- Вывод популярных категорий с иконками или изображениями.
- Каждая категория кликабельна и ведет в соответствующий раздел каталога.
- Блок с "Хитами продаж" и "Рекомендуем для вас", который мотивирует пользователей к выбору.
- В нижней части главной страницы размещены блоки с гарантиями ("Бесплатная доставка", "Сервисное обслуживание", "Цены").
- Отзывы клиентов, сертификаты и логотипы партнеров для повышения доверия.
Каталог
В каталоге общие категории разбиты на дополнительные. Решили спрятать фильтры в модальное окно, чтобы оставить больше места для просмотра карточек. Самые частые фильтры вынесены наверх, там же где сортировка. При наведении на карточку можно посмотреть подробную информацию о продукте.
Карточка товара
Карточка товара включает описание и характеристики, а также отзывы покупателей
Корзина совмещена с оформлением заказа. Оформление бесшовное - то есть нет переходов на другие страницы, все внутри одной. Это best practice в e-commerce на сегодняший день.
Корзина и оформление
Сравнение
Так как товары сложны с точки зрения технических характеристик, нужно было разработать страницу сравнения. Здесь первый блок фиксируется и можно сравнить 4 товара и сразу же добавить понравившийся в корзину.
Личный кабинет
В ЛК можно посмотреть текущие и прошлые заказы, отследить статус, пополнить баланс и получить скидку.
В дальнейшем функционал ЛК планируется дорабатываться
В дальнейшем функционал ЛК планируется дорабатываться
Внутренние контентные страницы
10+ внутренних контентных страниц
Адаптивные версии
Я разработала планшетную и мобильную версию. Мобильной уделили особое внимание, так как с него планируется наибольший трафик.
Более 80 макетов и более 50 часов
Мы получили в итоге. Со всеми состояниями, модальными окнами, адаптивом под планшетную и мобильную версию.
Вам понравился этот проект?
Посмотрите другие кейсы
