Создание сайта Погарской сигаретно-сигарной фабрики
О проекте
Студия Quadro Design создала сайт Погарской сигаретно-сигарной фабрики pccf.ru с нуля. Проект объединяет интернет-магазин, информацию о компании и публикации на платформе Webasyst Shop-Script. В состав разработки вошли индивидуальный адаптивный дизайн, вёрстка и интеграция функциональности платформы и плагинов. Работа охватывала как каталог, так и представление предприятия в информационной части сайта.
Дизайн магазина и корпоративных разделов
Для проекта подготовили пять основных типов страниц: главную, категорию, товар, корзину и оформление заказа. Адаптивный дизайн рассчитан на ширину от 320 до 1920 пикселей. Макеты проработаны на шести разрешениях: 320 пикселей для мобильного устройства, 768 и 1024 для планшетов, 1366, 1600 и 1920 для ноутбуков и стационарных компьютеров.
В визуальной системе использованы белый фон, приглушённые цветные блоки и красные акценты. На главной размещены крупный экран с изображением производства, сведения о компании, товарные подборки, новости и отзывы. Общая композиция связывает корпоративную информацию с каталогом: переходы к разделам находятся в верхней навигации, а материалы и товары представлены в отдельных секциях.
Страница категории сочетает поясняющий текст, изображения подразделов, переключение вида товаров и боковую область фильтров. В карточке товара предусмотрены крупное изображение, варианты фасовки, характеристики, описание и отзывы. Галерея показывает самостоятельные мобильные и планшетные композиции этих элементов. На узком экране меню раскрывается в отдельной панели; товарные и информационные блоки меняют расположение в соответствии с доступной шириной.
Вёрстка и интеграция Webasyst
Подготовленные страницы сверстали на HTML5 и CSS3. В объём работ вошло отображение в Opera, Mozilla Firefox, Internet Explorer, Chrome, Safari и Яндекс Браузере, на iPad, iPhone и устройствах Android. Затем вёрстку интегрировали в функционал Webasyst: разделы «Магазин», «Сайт» и «Блог», а также все бесплатные плагины платформы.
Оформление торговых страниц, публикаций и сведений о фабрике согласовано в общей теме. Шапка, навигация, кнопки, формы и подвал используют одни и те же визуальные правила. За счёт этого пользовательский интерфейс сохраняет последовательность при переходах между разными частями сайта.
Выполненные работы с плагинами
- Вывели последние отзывы о товарах на главную страницу.
- Сверстали плагин фотографий категорий.
- Интегрировали оформление заказа на одной странице.
- Сверстали интерфейс плагина обратного звонка.
- Сверстали интерфейс покупки в один клик.
Корзина и оформление заказа представлены как связанные части страницы: состав заказа, контактная информация, способы оплаты и доставки разделены на понятные блоки. В мобильном макете они расположены последовательно в одну колонку. Этот кейс показывает полный цикл создания сайта производителя на Shop-Script, включая адаптивные торговые шаблоны, информационные разделы и оформление подтверждённых дополнительных возможностей.
Другие проекты и разработка сайта
Посмотрите разработку магазина гаджетов COOLKEEN и разработку магазина часов VipTime в нашем портфолио сайтов.
Для нового проекта можно заказать создание интернет-магазина на Webasyst, обсудить программирование и доработки Shop-Script и связаться с Quadro Design.