Вернуться в портфолио
Кейс

OFFO — интернет-магазин игровых приставок на 1С-Битрикс

Посадка интернет-магазина OFFO на 1С-Битрикс: каталог игровых приставок и аксессуаров, списки товаров, карточки, навигация и страницы контактов.

offo.ru
OFFO — интернет-магазин игровых приставок на 1С-Битрикс
Клиент Частное лицо
Дата 25.09.2017
Работы Разработка на 1С-Битрикс

Задача

OFFO — интернет-магазин игровых приставок и аксессуаров. В каталоге представлены отдельные направления для PlayStation, Xbox, Nintendo Switch и других товаров. Моя задача — посадка готовой верстки на 1С-Битрикс: общий шаблон, каталог, товарные и информационные страницы.

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

Что было сделано

Я разобрал готовую верстку на общие элементы, шаблоны разделов и повторяемые товарные блоки. В 1С-Битрикс были подготовлены:

  • единая шапка с поиском по товарам, контактами, временем работы, мессенджером и кнопкой заказа звонка;
  • главное меню со страницами каталога, оплаты, доставки и самовывоза, гарантии, информации о компании и контактов;
  • боковая навигация по категориям приставок, а также отдельные ссылки на новинки, хиты продаж и скидки;
  • главная страница с промобаннером и подборками «Рекомендуем», «Новинки» и «Хиты продаж»;
  • карточки в списке с фотографией, названием, артикулом, рейтингом, кратким описанием, ценой, наличием, выбором количества и кнопкой добавления в корзину;
  • детальная страница товара с галереей, вариантами модели и цвета, основными характеристиками и ценовым блоком;
  • вкладки «Описание», «Характеристики», «Комплектация», «Аксессуары», «Отзывы и вопросы», а также блоки похожих товаров и персональных рекомендаций;
  • информационные страницы гарантии и контактов, включая карту, реквизиты и постоянную навигацию по каталогу.

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

Особенности проекта

Главная особенность OFFO — высокая плотность коммерческой информации. Даже компактная карточка показывает не только изображение и цену, но также артикул, оценку, статус наличия, количество и действие с корзиной. При посадке было важно сохранить читаемость такой сетки и не смешать данные соседних товаров.

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

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

Как связаны список и карточка товара

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

Результат

Готовая верстка OFFO была превращена в набор согласованных шаблонов интернет-магазина на 1С-Битрикс. Проект получил главную страницу, каталог, списки и детальные карточки товаров, коммерческие подборки и информационные разделы в одном интерфейсе. Результат кейса — CMS-основа и шаблоны, охватывающие предусмотренные макетами пользовательские сценарии.

OFFO показывает практический объем посадки готовой верстки на 1С-Битрикс для магазина: нужно подключить не один экран, а всю цепочку шаблонов. Для проектов, где дополнительно требуется переработать структуру товаров, свойства и логику наполнения, отдельно предусмотрена услуга настройки каталогов и админки.