Сверстали 16 уникальных типов страниц для крупного интернет-магазина.
Редизайн старого сайта - дело непростое, а если это крупный интернет-магазин с большим количеством багов? Все началось с небольших правок имеющегося проекта, которые по желанию заказчика плавно переросли в переход на новый фреймворк, дизайн, функционал. Новый сайт должен отвечать современным требованиям: быстро загружаться, корректно отображаться на мобильных устройствах, выглядеть современно. Покажем самое интересное.
Адаптивная верстка интернет-магазина перешла к нам. Список страниц довольно большой: главная страница, страница каталога, акций, товаров, корзины, списка заказов, истории заказов и многое другое.-
Главная страница включает в себя серию элементов:
-
Основные элементы верхней навигации
Шапка сайта - логотип, контакты, ajax-корзина, секция "личный кабинет", поиск, навигационное меню, offcanvas-меню для адаптива.
-
-
Карусель товаров для интернет-магазина
Следующим элементом в списке идет блок с адаптивной каруселью. В ней отображается текущий акционный товар в виде плитки.
Динамический каталог товаров с выгрузкой из 1С.
Блок "Популярные товары"
Отображает список наиболее продаваемых товаров. Выполнен в виде слайдсета с динамическим перестроением в зависимости от разрешения экрана.
Раздел "О компании" и подвал сайта
Краткий и лаконичный элемент с текстовой информации о компании, переходящий в подвал сайта.
Каталог
Динамический каталог товаров, выводит список категорий первого уровня, по клику раскрывает дочерние категории, еще дочерние категории, и так - до бесконечности. Слева имеется классический фильтр для сортировки по нужным параметрам. Аналогично другим блокам, все это может перестраиваться "на лету".
Акции
Разноцветная новостная страничка с выводом материалов в виде плиток разной ширины. Плитки выстраиваются автоматически, после заливки картинок и Магии.
Внутренняя страница какой-либо акции выглядит так:
Карточка товара
Внутренняя страница карточки товара. Очень сложная и функциональная составляющая сайта. Позволяет сначала выбрать тип оформления, затем рассмотреть поближе выбранный тип, затем купить его или же посмотреть похожие продукты.
Форма регистрации
Форма с переключением на тип пользователя: юрлицо или физлицо. Естественно, с ajax проверкой правильности заполнения полей. И вертикальной листалкой новостей справа, дабы пользователь не скучал в процессе регистрации.
Корзина и личный кабинет
Многоуровневый личный кабинет и корзина в 5 актах.
Акт 1. Главная страница личного кабинета
Акт 2. Главная страница корзины.
Акт 3. Детали заказа
Акт 4. Заказ оформлен
Акт 5. История заказов.
Страница 404
Если что-то пошло не так, рассмотрите страницу с хитрой розовой рамкой ;)
