АО «Раменский комбинат хлебопродуктов» одно из крупнейших зерноперерабатывающих предприятий Московской области. Основная задача дизайна сайта – это имиджевая составляющая компании с функцией онлайн магазина.
Дизайн сайта презентует компанию, информирует о новой продукции, вакансиях и стажировках. С помощью легко настраеваемых баннеров рекламирует и приводит к покупке производимого товара. Функционал продуман как для юридических, частных лиц.
Главная страница состоит из компонентов — набор готовых элементов, которые используются в построении страниц. Страница меняется исходя из задач компании в текущий момент. В основном это информирование о новостях, продуктах, вакансиях с кратким описанием компании.
Слайдер. Представляет собой блок внутри которого располагается любое графическое и текстовое содержание: новости, товары, информация о скидках. Слайдер перелистывается вручную либо автоматически.
Имиджевый блок. Представляет собой графическую и текстовую составляющую в виде блока с тезисами о деятельности компании. Блок выполнен в интерактивном виде, при наведении на тезис, всплывает видео или фото демонстрирующее его.
Где купить. Представляет собой карту на базе сервиса MapBox, где расположены метками объекты, содержащие информацию: часы работы, адрес магазина, наименование магазина. Поверх карты кнопка с фильтром по комбикорму и муке. По клику на соответствующую категорию, скрываются и открываются соответствующие метки на карте.
Популярные продукты. Блок с карточками товара популярных продуктов. с возможностью перейти в основной каталог.
Пресс-центр. Информирует о последних новостях компании. Состоит из заголовка компонента и списка последних постов из любой категории.
Галлерея. Слайдер с фото и видео материалом, перелистывается вручную или автоматически.
Вакансии. Позволяет перейти на все вакансии или на страницу стажировок. Ниже располагаются последние актуальные вакансии.
Футр. Состоит из формы обратной связи, логотипа, контактных данных и навигации по страницам.
Страница каталога состоит из блока с баннерами, управляющим блоком с сортировкой и переходом по категориям, сетка товаров, пагинация по страницам.
Статичные информационные баннеры — блоки с графическим и текстовым содержанием. Редактируются из административной панели. Баннеры информируют о новинках, скидках, новостях компании, функциональных новинках сайта, например калькуляторе. Сайт имеет компонентную структуру, по этому баннеры могут располагаться на любых страницах сайта.
Ниже располагается сортировка по категориям и сетка товаров. Товар в сетке состоит из изображения, наименования, цены, вес, вводом количества и кнопкой “добавить в корзину”.
Сначала пользователь добавляет товар в корзину, после указывает необходимое количество
В каталоге присутствует переключатель отображения товаров вида “список” и “плитка”. Отображение товара в виде списка позволяет сделать каталог более компактным и быстрым для покупок.
В карточках товара у юр. лиц отсутствует цена
На сайте предусмотрен удобный калькулятор для подсчета комбикорма. На первом шаге мы выбираем животное, которое нужно откормить
На 4 шаге нам предлагается товар в необходимом количестве с разбивкой по месяцам. Одним кликом мы можем добавить его в корзину.
Страница товара. По клику на товар в каталоге пользователь переходит на страницу с подробным содержимым.
Корзина представляет список добавленных ранее товаров в виде таблицы со столбцами: изображение, наименование товара, характеристики, цена за шт., количество, итоговая цена
Если физ. лицо или незарегистрированный пользователь добавил товаров на определенную сумму, всплывает окно с предложением «Стать дилером».
При нажатии на кнопку «Перейти к оформлению», пользователь попадает на страницу оформления заказа, где вводит необходимые данные и выбирает способ доставки.
Личный кабинет. Страница управления личными данными, данными по доставке и просмотру заказов. Стартовая страница личного кабинета — это вкладка “заказы”.
Страница компания выполняет имиджевую составляющую сайта, рассказывает о предприятии, его истории, команде. Содержимое страницы определяется набором готовых блоков и компонентов, предоставленных при редактировании в административной части сайта.
Мобильная версия. Благодаря блочной структуре дизайн быстро адаптируется под экраны мобильных телефонов сохраняя свою функциональность и эстетику.
Компонентный подход позволяет быстро и гибко создавать и модернизировать страницы. Готовые UI-компоненты, помогают дизайн системе сайта масштабироваться.
В дизайн концепции мы воплотили основную идею – это имиджевый сайт компании с функцией онлайн магазина. Он получился лёгким для восприятия и информативный. Сбалансированная графика и информационное наполнение дополняют друг друга в зависимости от разделов сайта. Предусмотрен функционал для физ. и юр. лиц, корзина и личный кабинет сделаны просто, но без ущерба функционалу.
Сергей Шилов – digital director
Денис Левченко – creative director, designer
Лилия Идилия – web designer
Семён Левченко – motion designer
Алексей Глушков – project manager
p.motion 2022