Портфолио

Создание интернет-магазина модной одежды WeAnnaBe

Создали интернет-магазин одежды WeAnnaBe на Webasyst Shop-Script: индивидуальный дизайн, вёрстка, интеграция и оформление модулей. Продумали показ коллекций, подбор по цвету и размеру, карточку товара и мини-корзину.

Главная страница WeAnnaBe с баннером коллекции, новыми моделями, публикациями, фотографиями и контактной формой.

Выпадающая мини-корзина WeAnnaBe над каталогом: фотография товара, общая сумма и кнопка заказа.

Карточка товара WeAnnaBe: крупная фотография платья, выбор размера, кнопка корзины и рекомендации моделей.

Каталог одежды WeAnnaBe с фильтрами цвета, цены и размера, сортировкой и сеткой фотографий товаров.

О проекте

Интернет-магазин одежды с акцентом на коллекции

Для WeAnnaBe команда Quadro Design создала интернет-магазин модной одежды с нуля на Webasyst Shop-Script. Проект объединил разработку индивидуального дизайна, вёрстку страниц, интеграцию в платформу, установку модулей и их оформление в общей стилистике сайта. В основе интерфейса — фотографии одежды, представление коллекций и последовательный переход от знакомства с ассортиментом к выбору конкретной модели.

Дизайн главной страницы и каталога

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

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

Карточка товара и вёрстка модулей

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

Разработали индивидуальный дизайн интернет-магазина WeAnnaBe.
Выполнили вёрстку страниц и элементов пользовательского интерфейса.
Интегрировали вёрстку с Webasyst Shop-Script 6.
Установили модули и сверстали их в едином дизайне магазина.

Что объединяет этот проект

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

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

Посмотрите разработку магазина одежды Achete и разработку магазина одежды The RockStore в нашем портфолио сайтов.

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