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

Работа началась с анализа старого сайта. Затем мы разобрали структуру и разработали прототипы более 30 страниц.

Из общения с клиентом и анализа старого сайта мы выявили ряд проблем:

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

За основу взяли концепцию «минимум действий – максимум информации». Клиент хотел разместить информацию о продукции сразу на главной странице и показать, как она применяется на разных предприятиях, а также добавить быстрый доступ к документации продуктов.

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

 Визуализация

 Страницы сайта построены по жёсткой сетке: слева – фиксированное меню, справа – колонка с фильтрами. Центральная часть страницы показывает информацию по выбранному разделу.

Задача сайта - показать триединство продукта. Компания производит оборудование и дополнительные части, адаптирует к потребностям заказчика, оказывает гарантийное и проектное сопровождение. Поэтому все страницы сайта связаны между собой, нет разрозненной подачи информации.

В «Решениях» размещены варианты  использования оборудования, схемы подключения для разных отраслей промышленности и производств. Таким образом, пользователь видит готовые решения по использованию оборудования в собственной компании. Выбрав одно из них, можно посмотреть, где оно применяется: название компании, направление промышленности, расположение.

Клиенту не нужно долго разбираться, какое оборудование ему искать, уже есть готовые решения. 

На старом сайте не было подробных описаний оборудования. Мы создали раздел с продукцией, который представляет краткую справку по товару, позволяет увидеть, как он устроен, посмотреть модификации, выбрать и заказать необходимую.

 

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

Особенности разработки

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

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

Что же касается клиентской части, тут нет никакого Bootstrap или еще какого-либо фреймворка, который обычно сводит всю уникальность сайта на нет.

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

Сайт отлично отображается во всех современных браузерах, таких как IE 11, Edge, Opera, Mozilla, Chrome. И приятно выглядит на смартфонах, так как большинство анимаций и эффектов на мобильной версии сайта были отключены, чтобы довести до пользователя только самую необходимую информацию.

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