+375 (29) 390-56-65
Время работы
Пн-Пт: 9:00 - 17:00
Сб-Вс: выходной
Отвечаем в мессенджерах:
Кейсы Кейсы по разработке сайтов Кейс по созданию сайта-каталога для поставщика систем безопасности

Кейс по созданию сайта-каталога для поставщика систем безопасности

Кейс по созданию сайта-каталога для поставщика систем безопасности
Обсудить проект
ООО «ОгнеборСервис» – поставщик комплексных систем безопасности, в том числе пожарного и охранного оборудования. Компания продает оборудование, проектирует, производит монтаж и техническое обслуживание. Компания располагает необходимыми разрешительными документами, кадрами и оборудованием для оказания всего спектра услуг в сфере слаботочных систем и систем безопасности.
Дизайн
Дизайн
Индивидуальный
Сайт
Сайт
Сайт-каталог
Объём
27 132
Страниц
Скорость
94 / 95
Загрузки сайта
Язык
RU
Русский
Поиск
Поиск
По сайту
Мессенджеры
Мессенджеры
Коммуникация
Маршрут
Маршрут
На картах
Description-миниатюра

В качестве дополнительного элемента была
отрисована и установлена description-миниатюра
с указанием контактной информации и деятельности.

Description-миниатюра
Авторежим работы

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

Авторежим работы
Построение маршрута

Для удобства нахождения офиса компании
была реализована интерактивная карта с
возможностью построения маршрута.

Построение маршрута
Форма обратной связи

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

Форма обратной связи
Задача

Разработать сайт-каталог в стиле Hi-Tech с использованием фирменной палитры цветов. Предоставить удобную и понятную структуру каталога и категорий товаров. Обеспечить высокую скорость загрузки сайта.

Решение

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

Ниша

Поставки комплексных систем безопасности

Продолжительность
  • 3 недели – дизайн
  • 2 месяца – разработка
  • 1 месяц – заполнение

Краткий бриф на разработку сайта

Наименование компании
ООО «ОгнеборСервис»
Сфера деятельности
Поставки комплексных систем безопасности
Страна, на которую рассчитан сайт
Беларусь
Основные товары и услуги
Видеонаблюдение, охранно-пожарная сигнализация, пожаротушение и огнезащита, кабели и провода и т.д.
Домен сайта
ognebor.pro
Целевая аудитория
Мелкий и крупный бизнес, производственные организации, а также физические лица мужского пола 30-60 лет
Задачи сайта
Представление информации о доступных товарах и о самой компании, привлечение новых клиентов
Тип сайта
Тариф
Индивидуальное
CMS
WordPress
Хостинг
Пожелания заказчика
Стиль Hi-Tech (геометрические линии, современный дизайн, яркая картинка), фирменные цвета, строгие шрифты, наличие поиска

Выбор цветовой палитры, шрифтов и визуального контента

01
Цвет и типографика
В начале работы мы отрисовали готовый логотип компании в векторном формате, так как ранее у клиента был только jpg формат логотипа, в то время как для сайта желателен формат svg или png. Проблем с выбором цветов для сайт не возникло - взяли фирменную палитру компании: оранжевый и темно-серый цвета, а также градиент, взятый с логотипа.
Насчет шрифтовой пары мы с клиентом тоже быстро пришли к согласию: гротескный шрифт Tektur идеально подходит под сферу деятельности компании за счет своих острых изгибов, а Fira Sans, шрифт для основного текста, отлично сочетается с заглавным шрифтом и немного сглаживает строгость всего сайта.
#373737
#747474
#ff6900
#ffffff
В начале работы мы отрисовали готовый логотип компании в векторном формате, так как ранее у клиента был только jpg формат логотипа, в то время как для сайта желателен формат svg или png. Проблем с выбором цветов для сайт не возникло - взяли фирменную палитру компании: оранжевый и темно-серый цвета, а также градиент, взятый с логотипа.
#373737
#ff6900
#747474
#ffffff
Насчет шрифтовой пары мы с клиентом тоже быстро пришли к согласию: гротескный шрифт Tektur идеально подходит под сферу деятельности компании за счет своих острых изгибов, а Fira Sans, шрифт для основного текста, отлично сочетается с заглавным шрифтом и немного сглаживает строгость всего сайта.

Полезный и для пользователя, и для бизнеса функционал

02
Функционал

Первое, на что обращает внимание посетитель на сайте, – это шапка. Несмотря на простоту структуры хедера в данном проекте, элемент выглядит уникально за счет обыгрывания стиля Hi Tech в виде линий. Сама шапка сайта состоит из двух частей: верхняя содержит контактную информацию о компании, авторежим работы и поиск по названию или артикулу; нижняя указывает на важные внутренние страницы сайта.

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

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

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

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

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

Какие инструменты и технологии мы использовали

03
Инструменты
Figma
Figma
Illustrator
Illustrator
Photoshop
Photoshop
WordPress
WordPress
JQuery
JQuery
PHP
PHP
JavaScript
JavaScript
WPBakery
WPBakery
Swiper
Swiper
FancyBox
FancyBox
Bootstrap
Bootstrap

Скорость загрузки сайта

04
Скорость
ognebor.pro
Анализировать
Мобильные устройства
Компьютер
94
ognebor.pro
0-49
50-89
90-100
Мобильные устройства
Компьютер
95
ognebor.pro
0-49
50-89
90-100
Показания сервиса
Google PageSpeed Insights

Наши специалисты без препятствий оптимизировали скорость загрузки сайта, чтобы было удобнее и быстрее перемещаться по нему. Более подробно о том, почему так важна высокая скорость загрузки сайта, можно почитать в нашей статье. Для текущего проекта были достигнуты следующие значения: 95 баллов на декстопных устройствах и 94 балла на мобильных (возможны более низкие результаты из-за медленного интернета или сильной нагрузки на устройства).

Результаты по проекту

05
Результат

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

1. Стильный дизайн
Сайт выполнен в современном Hi-Tech стиле с использованием фирменной палитры цветов.
2. Удобная навигация
Создана интуитивно понятная структура каталогов и категорий товаров для легкого поиска.
3. Высокая производительность
Оптимизированы все элементы сайта для обеспечения быстрой загрузки страниц.
4. Полная информация
Предоставлены актуальные данные о товарах: характеристики и цены. Загружено более 30 000 товарных позиций с различных сайтов производителей, включая точные описания и изображения.
Хотите так же?
Давайте обсудим проект!
+

Обсудить проект

+

Заявка на обратный звонок

Согласие на обработку персональных данных в соответствии с целями, указанными в Политике обработки персональных данных