В наше агентство обратилось руководство ООО “ОС Альфаснаб” для редизайна своего сайта alfaopt.com.
ООО “Оптовые системы Альфаснаб” - компания, специализирующаяся на производстве и продаже комплектующих для систем электрического обогрева и отопления бытовых помещений и промышленных объектов. Также предприятие занимается реализацией средств учета ресурсов и LED освещения от ведущих российских и зарубежных производителей.
С популяризацией интернета в разы увеличился спрос на онлайн-покупки. Клиентам намного удобнее ознакомится с каталогом компании в режиме онлайн, убедится в наличии и заказать необходимый товар, нежели ехать в офлайн магазин и совершать покупку там. Исходя из всего этого роль сайтов в нашей жизни вышла на новый уровень, теперь для нас это визитная карточка и лицо компании.
Первое с чем сталкивается пользователь - визуальная составляющая сайта. “Встречают по одежке, а провожают по уму” данная поговорка актуальна и по сей день, поэтому не стоит забывать о дизайне, а точнее о его двух составляющих:
- UI - Пользовательский интерфейс
- UX - Пользовательский опыт
Анализ
Как видно на скриншоте, данный дизайн был актуален для 2013 - 2016 года. Сейчас же сайт должен быть “чистым” и лаконичным. Поэтому было принято изменить следующее:
- Шапка сайта
- Баннеры
- Иконки для групп в каталоге
- Превью новостей и статей
Шапка сайта
- Было принято решение модернизировать логотип, чтобы он не выбивался из композиции.
- Из-за того что компания по большей части работает с b2b рынком общение с клиентами осуществляется посредством электронной почты. Поэтому, мы добавили иконку с адресом для удобства как менеджеров (им не нужно диктовать адрес по телефону), так и клиентов (они сразу могут написать письмо с запросом на тот или иной товар).
- Добавлены часы работы под номер телефона из-за того что были проблемы с тем, что некоторые пользователи могли позвонить в нерабочее время.
Баннеры
Большинство дизайнеров компаний занимающимся продажей приборов учёта и систем обогрева сталкиваются с тем, что сложно, а бывает что невозможно найти изображения товара в хорошем качестве да ещё и в нужном ракурсе. Для фотографии в каталоге подойдет картинка с разрешением 300х300px, а вот для баннера такое изображение окажется маленьким.
Поэтому мы подготовили около тридцати 3D моделей продукции, которая часто используется на баннерах.
Результат вы можете видеть ниже.
Иконки в каталоге
Старые иконки были слишком активного красного цвета, это приводило к тому, что:
- Пользователю было дискомфортно находится долго на странице.
- Уходило много времени на поиск нужного раздела, по причине того, что яркая иконка привлекала гораздо больше влияния чем название раздела.
Новые иконки были сделаны объемными в серо-красных тонах, так как:
- Это выглядит современно (все уходят от плоского дизайна в графике).
- Не происходит визуального конфликта названия раздела и самой иконки.
Превью для новостей и статей
Все обложки были реальными фото, из-за этого возникли следующие проблемы:
- Некоторые правообладатели фотографий обращались с требованием использовать другие фото, иначе дело будет решать суд.
- Разделы “Новости” и “Статьи” пестрили и не имели единой композиции, так как фотографии, как минимум не имели общей цветовой гаммы.
Поэтому было принято решение разработать единый стиль для обложек и иллюстраций (схожий с тем, что на баннере), которые будут использоваться в статьях.
Итог работы
Редизайн в общей сложности был выполнен за 2 месяца. По итогу сайт стал выглядеть ново и свежо, не только на фоне конкурентов. Время пользователей на сайте увеличилось, уменьшились отказы (закрытие страницы через 10 сек.), из-за динамики таких показателей увеличился X сайта с 200 до 410 за 1,5 года.