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

OFFO

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

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

Задача

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

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

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

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

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

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

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

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

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

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

Результат

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

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