Редизайн интернет-магазина прачечного оборудования «Вектор»

«Вектор» — магазин профессионального прачечного оборудования для прачечных и химчисток, работает с 2000 года. Основной сегмент — B2B.

Визуальные решения сильно устарели, поэтому мы подготовили концепты и предложили клиенту редизайн.

Технические ограничения негативно влияли на производительность и безопасность системы, а ограниченная фильтрация товаров, проблемы с навигацией и сложность оформления заказа не соответствовали современным ожиданиям пользователей.

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

В рамках проекта было решено: 

1. Проработать интерфейс и улучшить UX.

2. Обновить архитектуру сайта для повышения производительности и стабильности.

3. Сохранить привычное функционирование пользовательской части и взаимодействие менеджеров компании с административной частью.

4. Оптимизировать функционал для ускорения работы
с заказами.

Переработали backend под новую вёрстку, что позволило улучшить производительность и безопасность системы. Реализовали множественную фильтрацию. В дизайне отобразили качество и ценности бизнеса, выделив компанию среди конкурентов.

Обновили карточки 240 товаров в каталоге, страницы 28 категорий и 20 подкатегорий.

1. Установили фиксированный каталог слева при скролле, который облегчает навигацию по категориям и сокращает время пользователя на поиск нужного раздела, что способствует улучшению UX (пользовательского опыта) и повышению удовлетворенности. Это ключевой элемент дизайна, под который подстраивается весь контент сайта.

2. Сделали удобную навигацию с любой страницы, которая позволяет пользователям легко перемещаться между различными разделами сайта, не теряя контекста. Это особенно важно для больших сайтов с большим количеством страниц, так как снижает риск «потерянных» страниц и улучшает удержание пользователей.

3. Разместили поиск на привычном месте: размещение строки поиска в ожидаемой зоне делает ее интуитивно понятной для пользователей, что способствует быстрому доступу к нужной информации и повышает общую продуктивность взаимодействия с сайтом.

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

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

3. Реализовали множественную фильтрацию. В предыдущей версии интернет-магазина можно было фильтровать товары только по одному параметру одновременно, теперь же доступна гибкая фильтрация по нескольким критериям. Реализация фильтров упростила подбор товаров более чем из 240 позиций.

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

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

Убрали дублирующуюся информацию на странице сравнения товаров, тем самым усилив восприятие контента.

Дизайн сайта выполнен в светлых, чистых оттенках, отсылающих к ключевым ассоциациям компании — «чистота» и «свежесть». Такой выбор цветовой палитры подчеркивает основные ценности бренда.

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

Основной шрифт сайта — LT Superior — это шрифт без засечек, который сочетает в себе вневременную элегантность и функциональную современность, делая текст легким для чтения на любом устройстве.

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

Компания получила платформу для дальнейшего
масштабирования.

— Удобная навигация, доступные фильтры, улучшенный поиск.

— Возможность создания и редактирования заявок.

— Сохранение привычного функционала для менеджеров.

— Возможность использования сайта на любых устройствах.

— Снижение затрат на техническую поддержку.