Войти на сайт
Логотип
Клиентам

«Альфа Строй Проект»

Вернуться к списку
  • Тип проекта:
    Корпоративный сайт
  • Тематика сайта:
    Оборудование
  • Редакция продукта:
    Старт
  • Сайт:
  • Партнер:
Задача
Стояла задача сделать сайт для компании, выпускающей обогревательные котлы, которые широко используются в тепличном бизнесе. Необходимо было представить на сайте как основную категорию товаров, так и дополнительные.

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

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

‌Акцентным цветом был выбран оранжево-красный как символ огня и тепла, Фоновый цвет было решено сделать не просто серым или черным, но с фиолетово-синим отливом, так как в данном случае такой фон смотрелся интереснее.

‌Чтобы добавить живости, применили на сайте легкую анимацию: акцентировали круги на схеме котла на 1 экране главной страницы, плюс использовали легкую анимацию при постепенной загрузке.

Техническая часть
Была создана вёрстка, которая адаптируется под любые размеры и работает на устройствах шириной от 320px до 2500px.

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

Также была добавлена анимация элементам таким как меню, карточки оффера, dropdown. Добавлена анимация элементам при скролле.