Разработка сайта для компании “Марго Групп”

Заказчик
Компания Марго Групп – это молодая амбициозная компания, которая динамично развивается на мебельном рынке Украины.
Задача
Разработка торговой площадки для продажи мебели, интеграция 1С на сайт, реализация адаптивной верстки под все типы устройств.

Клиент: Марго Групп

О заказчике: Компания Марго Групп – это молодая амбициозная компания, которая динамично развивается на мебельном рынке Украины.

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

Задачи: Разработка торговой площадки для продажи мебели, интеграция 1С на сайт,  реализация адаптивной верстки под все типы устройств.

Используемые технологии: PHP 7.2, JavaScript, OpenCart 2.3, HTML5.

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

Главная страница / Верхушка сайта

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

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

       

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

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

Главная страница / Блок преимуществ

Ниже слайдера расположился блок с описанием основных преимуществ компании.

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

Главная страница / Предложения месяца

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

 

Главная страница / Блок последних новостей

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

Данный раздел полезен и с точки зрения продвижения: чем чаще добавляется новый контент - тем чаще поисковые боты будут заходить на сайт.

 

Главная страница / Форма обратной связи

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

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

Страница каталога товаров / Категории 

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

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

         

         Страница карточки товара

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

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

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

Страница новостей и блога 

         Помимо просмотра последних новостей пользователь имеет возможность просмотреть статьи и новости, которые были добавлены раньше. 

Для этого пользователю была добавлена кнопка “Все новости” в блоке последних новостей. Клиенту также были добавлены фильтры, позволяющие управлять выводимым контентом и настраивать его под свои нужды: будь-то сортировать новости по заголовкам или вывести все новости и выбрать самую интересную для чтения.

Страница акций и скидок 

Акции, скидки и распродажи стали неотъемлемой частью современной жизни и компания Марго идет в ногу со временем! Компания регулярно проводит акции и делает скидки на свои услуги. Для привлечения и информировании клиентов блок с акциями был вынесен на главную страницу с броским дизайном. 

Страница акций и скидок / Страница акции 

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


Страница часто задаваемых вопросов

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

 

Страница вакансий 

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

 

Страница администратора сайта

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

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

Основная идея интерфейса пользователя состояла в грамотной комбинации  простоты и функциональности, которая должна была отразиться и на удобство администрирования сайта. Для этого даже простейшие операции по администрированию были реализованы интуитивно понятными.

 

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

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

 

Выводы: Подводя итоги, можно смело сказать, что команде компании Promodex удалось выполнить поставленную перед ней задачу, контент на сайте сделать динамичным, но не ресурсоемким - это сделало возможным использовать сайт даже при слабом интернет-соединении и благодаря адаптивной верстке на любых устройствах. Внедрение 1С на сайт  значительно упростило работу сразу нескольких отделов компании Марго Групп. 


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

В карточку агентства

Письмо автору кейса

Пользуйтесь реальным опытом в IT и следите за успехами потенциальных подрядчиков и конкурентов
Читайте также
Кейсы по теме#Дети, дом, семья