Основные задачи

Структурировать огромный каталог товаров

Собственное производство и продукция поставщиков — десятки тысяч позиций
Подготовить к SEO-продвижению

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

Каталоги производителей, сертификаты, 3D-модели
Опередить конкурентов

Более удобный, привлекательный и наполненный полезным контентом сайт

ЭТАП 1. Проектирование

Кликабельная версия прототипа для просмотра в браузере

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

В процессе проектирования мы разработали прототипы всех типов страниц, согласовали новую структуру каталога (оптимизированную для дальнейшего SEO-продвижения) и алгоритм переноса товаров со старого сайта на новый.

Для товаров было разработано два типа карточки товара:

для собственного производства компании (электрощитовое оборудование)
для продажи электротехнической продукции от поставщиков

Cтруктура сайта
Прототип главной страницы
Прототип каталога (торговля)
Прототип категории каталога (торговля)
Прототип карточки товара (торговля)
Прототип каталога (производство)
Прототип категории каталога (производство)
Прототип карточки товара (производство)
Прототип страницы с брендами
Прототип страницы бренда
Прототип информационной страницы
Прототип раздела с новостями
Прототип новостной страницы
Прототип раздела с сертификатами
Прототип раздела с материалами для скачивания
Прототип страницы с контактами
Прототип формы обратной связи

ЭТАП 2. Дизайн и вёрстка

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

На этапе дизайна подобрали и согласовали основной шрифт. Им стал «Exo 2». Это бесплатный шрифт, полностью поддерживающий кириллицу и рекомендованный Google для использования в веб-разработке.

В качестве фонового изображения было выбрано изображение электрической платы.

Страницы сайта были свёрстаны полностью адаптивно и протестированы во всех популярных браузерах и на всех разрешениях.

Дизайн главной страницы
Дизайн каталога (торговля)
Дизайн категории каталога (торговля)
Дизайн карточки товара (торговля)
Дизайн каталога (производство)
Дизайн категории каталога (производство)
Дизайн карточки товара (производство)
Дизайн страницы с брендами
Дизайн страницы бренда
Дизайн информационной страницы
Дизайн раздела с новостями
Дизайн новостной страницы
Дизайн раздела с сертификатами
Дизайн раздела с материалами для скачивания
Дизайн страницы с контактами

ЭТАП 3. Программирование

Сайт включает в себя следующий функционал:

Поиск по каталогу
Оформление заявок, запросов на консультацию, заказов обратного звонка
Фильтрация продукции по бренду (группировка товаров одного бренда в отдельные разделы)
Библиотека полезных файлов для скачивания
SEO-функционал и настройки

Всем контентом сайта управляет сам клиент из админ-панели.