Создание интернет-магазина органической косметики LoveOrganic

О проекте

LoveOrganic — интернет-магазин органической косметики, адрес проекта — love-organic.ru. Для магазина выполнили полный цикл создания на Webasyst и Shop-Script: индивидуальный дизайн, вёрстку и интеграцию интерфейса с платформой. В состав работ также вошли установка и оформление модулей, разработка и установка плагина.

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

Дизайн магазина органической косметики

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

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

Каталог и подробная карточка товара

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

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

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

Разработка интерфейсов и интеграция

Вёрстку перенесли в тему Shop-Script и согласовали с интерфейсами модулей. Отдельно разработали и установили плагин, предусмотренный проектом. Окно входа получило поля электронной почты и пароля, а страница завершённого заказа — сводку с номером заказа, способом получения и итоговой суммой.

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

Другие проекты и разработка магазина

Посмотрите разработку магазина товаров для здоровья MYWELLNESSSHOP и разработку книжного интернет-магазина КБК в нашем портфолио сайтов.

Для нового проекта можно заказать создание интернет-магазина на Webasyst, обсудить программирование и доработки Shop-Script и связаться с Quadro Design.