Novogas — сайт для завода газовой аппаратуры
ОАО “НЗГА” — завод с многолетним опытом в сфере газового оборудования. Компания выпускает надёжную и сертифицированную продукцию для газоснабжения, ориентированную на промышленные и частные объекты.
Задача
Разработать сдержанный и функциональный корпоративный сайт для завода по производству газовой аппаратуры, отражающий промышленную специфику компании и надёжность продукции. Особое внимание уделить структуре, удобству восприятия информации и адаптивности для различных устройств.
Дизайн
Любой дизайн начинается с прототипирования нетипичных страниц, и для Новогрудского завода газовой аппаратуры наш дизайнер разработал прототипы страниц:
- Главная;
- О компании;
- Каталог с категориями;
- Товары в категории;
- Страница товара;
- Новости;
- Страница новости;
- Контакты;
После проверки прототипов заказчиком были внесены корректировки по структуре, перераспределены акценты в блоках и учтены пожелания по логике пользовательского пути. Также были предоставлены финальные тексты и дополнительная информация. После утверждения обновлённой версии мы перешли к этапу визуального оформления — разработке дизайна.
Дизайн сайта выполнен в строгой и сдержанной стилистике с использованием акцентных голубых элементов, соответствующих цвету логотипа компании. Серые шапка и подвал визуально отделены от основного контента и содержат все необходимые элементы. В соответствии с требованиями к государственным сайтам, предусмотрены: переключатель версии для слабовидящих, языковой переключатель, а также ссылки на сайты вышестоящих организаций, размещённые в нижней части страницы.
На первом экране главной страницы размещено видеопрезентация компании, задающая тон всему сайту и подчеркивающая промышленную специфику бренда. Далее следует блок с минималистичными карточками продукции, оформленными с тонкой голубой обводкой и мягкой подсветкой, визуально отсылающей к свечению пламени газа. Ниже расположены крупные карточки новостей — выразительные и информативные, с акцентом на актуальные события.
Страница каталога продукции оформлена в виде минималистичных карточек с мягкой голубой подсветкой, отсылающей к фирменной цветовой гамме и теме газового пламени. На страницах категорий сохраняется единая визуальная стилистика, при этом карточки дополнены описательной информацией о товарах. Страница отдельного товара содержит крупные фотографии, подробное текстовое описание, технические характеристики. Для удобства пользователей есть кнопка для отправки заявки прямо с этой страницы.
Страница «Новости» оформлена в виде крупных карточек разного размера, что придаёт странице динамичность, избегая однообразия. Каждая карточка содержит крупное изображение, дату публикации и заголовок. Страница отдельной новости включает крупное фото и подробный структурированый текст, а справа расположена колонка с актуальными новостями.
Страница «Контакты» содержит все необходимые данные: контактную информацию по разделам, интерактивную Яндекс.Карту, а также таблицы с контактами отдельных отделов организации и магазинов с продукцией компании.
Разработка и адаптация
Все страницы адаптированы под мобильные устройства и детально прорисованы дизайнером. Карточки перестроены под вертикальный формат, с кнопками, удобными для нажатия пальцем. В ряде блоков, реализован горизонтальный скролл для комфортного просмотра контента без перегрузки экрана. Также добавлен горизонтальный скролл таблиц, чтобы сохранить читаемость данных на узких экранах.
После утверждения дизайна сайта наш программист выполнил верстку и разработку: превратил макеты в работающий адаптивный сайт, настроили корректное отображение на всех устройствах, оптимизировал скорость загрузки и протестировал кроссбраузерность.
