Уходим от шаблонов: создаем новый дизайн интернет-магазина премиальных строительных материалов

Заказчик

Санлайт-Хаус — компания по продаже облицовочного кирпича, черепицы и других материалов для отделки фасадов

Задача

Разработать новый дизайн для интернет-магазина, отойти от стандартного шаблона Битрикс и создать кастомный шаблон

О проекте

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

Работа с клиентом началась в 2019 году, тогда основной упор был сделан на SEO-продвижение. Сайт был на шаблоне Битрикса, которого было достаточно для работы с SEO. Поэтому предприняли его кастомизацию, сделали небольшой редизайн и увеличили структуру страниц, чтобы продвинуть сайт по внешним поисковым запросам. 

Так как редизайн старого сайта все еще проводился в рамках работы в сезоне 2019-2021 годов, то пока дизайн морально устарел, и клиент решил его изменить. 

Задача 

Цель проекта — создать новый дизайн для интернет-магазина. Отойти от стандартного шаблона Битрикс и создай кастомный шаблон.

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

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

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

Аналитический этап

Перед началом работ была проведена серьезная аналитика текущего состояния сайта и запроса клиента. Этот этап состоит из следующих шагов:

1. Мы создали множество сайтов аналогичных компаний, чтобы выявить тенденции в дизайне и основные решения, которые работают в данной нише. Это помогло нам понять, каким образом можно выделиться на фоне конкурентов и сделать акцент на отличиях Санлайт-Хауса.
2. Было проведено исследование предпочтений деловых клиентов, чтобы определить, какой стиль оформления будет для них наиболее привлекательным. Важно было учитывать, что целевая аудитория — это профессионалы в области строительства и построения, которым важно качество продукции и удобно искать нужную информацию.
3. Поскольку предыдущий сайт уже успешно продвигался через SEO, мы провели аудит структуры структуры и семантического ядра, чтобы сохранить и улучшить позиции в поисковых системах после редизайна.
4. Проанализируйте типичный интерфейс, показывающий слабые места в навигации и показ каталога, которые мешают пользователям легко находить нужные товары и информацию.
5. Одновременно с клиентом были достигнуты основные цели нового дизайна: повышение конверсии, улучшение восприятия бренда как лучшего поставщика и увеличение среднего чека за удобный интерфейс и дополнительные предложения.

Трудности и их решение

Во время работы возникли сложности, требувшие нестандартных решений:

• Клиент хотел уйти от стандартного шаблона Битрикс, который работал в атмосфере и ограничивал возможности кастомизации. Мы разработали полностью кастомный шаблон, который соответствует требованиям современного веб-дизайна и гибким настройкам внешнего вида и функциональности сайта.
• Каталог товаров довольно объемный и разнообразный, созданный по сложности с его структуризацией и представлением на сайте. Была разработана новая структура категорий с использованием фильтров и сортировок, что упрощает навигацию и поиск нужных товаров.
• Переход на новый дизайн может негативно сказаться на текущих позициях сайта в поисковых запросах. Сохранены все важные элементы SEO-оптимизации, такие как метатеги, заголовки и описания, а также проведены работы по перенаправлению старых URL на новые страницы.
• Необходимо было обеспечить превосходное позиционирование компании, сохранить эту функцию и использовать использование сайта. В дизайне использован минималистичный подход с упором на качественные фотографии и огненную типографику. Карточки товаров были оформлены так, чтобы подчеркнуть уникальность каждого товара.
• Требовалось сделать так, чтобы пользователи сразу рассматривали важные предложения и новинки. На главной странице были выделены блоки с акциями, популярными товарами и новинками, которые привлекали внимание пользователей и стимулировали видимость конверсий.

Основные этапы реализации

1. На основе анализа и была разработана концепция нового дизайна, учитывающая все требования и особенности.
2. Были созданы интерактивные прототипы ключевых страниц (главная страница, каталог товаров, карточка товара), чтобы протестировать удобство использования и получить обратную связь от клиента.
3. После утверждения концепции приступили к детальной проработке дизайна всех страниц и их оформлению в HTML/CSS.
4. Новый дизайн был интегрирован в Битрикс, что позволяет клиенту легко управлять контентом и обновлять информацию о товарах.
5. Перед запуском сайта было проведено тестирование на различных устройствах и браузерах, а также проверена корректность работы всех функций.
6. После запуска сайта мы продолжаем оказывать поддержку, помогая клиенту улучшить работу сайта и решать возникающие вопросы.

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

Дизайн страницы

Главная страница «Санлайт-Хаус»

Дизайн каталога

Раздел с каталогом товаров 

Дизайн карточки

Раздел с цветной карточкой 

Адаптивное под мобильное устройство

Перейти на сайт