Разработка магазина продуктов «ЧиполлиноNET»

Для проекта «ЧиполлиноNET» студия Quadro Design создала интернет-магазин продуктов питания с нуля: разработала дизайн, выполнила вёрстку и интегрировала её с Webasyst Shop-Script. В макетах представлены мясо, овощи, фрукты и другие продукты для повседневного рациона. В основе оформления лежит подробная презентация магазина, которая знакомит посетителя с ассортиментом и условиями заказа, а затем направляет его в торговый раздел.

Длинная главная страница с последовательной подачей информации

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

Первый экран оформлен крупной фотографией продуктов и логотипом «ЧиполлиноNET». Жёлтая полоса меню отделяет его от основной части. Ниже расположены графические знаки, фотографии товарных направлений и текстовые блоки. На макете видны категории мяса, овощей и фруктов: изображения позволяют представить содержание разделов ещё до перехода в каталог.

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

Что выполнили при создании магазина

• Разработали индивидуальный дизайн интернет-магазина и длинной главной страницы.
• Сверстали подготовленный дизайн, включая изображения, инфографику, меню и информационные секции.
• Интегрировали вёрстку в Webasyst Shop-Script.
• Установили предусмотренные проектом модули.
• Выполнили вёрстку интерфейсов модулей в общем оформлении сайта.

Презентация бренда и торговый раздел

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

Другие проекты и разработка сайта

Посмотрите разработку магазина чая «Родное Луговое» и разработку магазина профессиональной косметики Nayiada в нашем портфолио сайтов.

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