Беларусь

region-img

Сотбит.Оригами: Особенности дизайна нового шаблона

author
Владислав Шацилло 13 ноября 2018
Время чтения: 4 мин

Здравствуйте, менеджеры и владельцы интернет-магазинов! Сегодня мы решили поговорить с вами о прекрасном. Как вы уже, наверняка, знаете, недавно мы анонсировали выход уникального шаблона Origami, из которого можно самостоятельно «сложить» любой интернет-магазин. И он будет не просто прекрасен, а еще и удобен! Почему? Сейчас расскажем.

Особенности дизайна нового шаблона Сотбит.Оригами

Помните, как у классика: «Красота спасет мир»? Так вот, наше мнение – красота не только мир может спасать. Это раз. Иногда красоты бывает недостаточно. Это два. Именно поэтому, создавая наш уникальный шаблон Сотбит.Оригами, мы задействовали всю мощь отдела дизайна,основывая наши решения на UX-дизайне.

UX – User Experience, дословно: «опыт пользователя». Это восприятие и ответные действия пользователя, возникающие в результате использования и/или предстоящего использования продукции, системы или услуги. Опыт пользователя включает все эмоции, убеждения, предпочтения, ощущения, физические и психологические реакции пользователя, поведение и достижения, которые возникают до, во время и после использования системы.
Почему мы решили во главу угла поставить все же UX? Все очень просто – продуманный дизайн, ориентированный на пользователя, неизбежно приводит в повышению конверсии магазина. А если конверсия растет, то растут и продажи. Но мы не будем сейчас «растекаться мыслью по древу», а сосредоточимся на самых ключевых особенностях и представляем вам 7 UX-особенностей, которые выгодно отличают наш шаблон от решений других разработчиков:
  1. Кошелек Миллера
  2. Фильтр в двух вариантах
  3. Навигация в 3 клика
  4. Добавление товара в корзину из любого блока
  5. Мобильный фильтр
  6. Мобильная карточка товара
  7. Мобильная страница оформления заказа

Кошелек Миллера

Итогом исследования Джорджа Миллера стал тот факт, что человек может помнить одновременно около 7 элементов. Поэтому в шаблоне Origami все устроено таким образом – в одном функциональном блоке содержится не более 5-8 элементов.

Шаблон Origami от Сотбит

Фильтр в двух вариантах

Фильтром в интернет-магазине уже никого не удивишь. Скорее всего, вы даже не найдете ни одного современного шаблона на Битрикс, в котором бы его не было. Но у других разработчиков он только один. А вот в Оригами 2 варианта фильтра: вертикальный и горизонтальный. Вертикальный фильтр можно расположить в левом или правом сайдбаре.   

Вертикальный фильтр в шаблоне Origami от Сотбит

В нашем шаблоне Origami горизонтальный фильтр соответствует всем современным тенденциям e-commerce рынка. По горизонтали очень компактно располагаются свойства. Согласитесь, один вариант фильтра – это хорошо, но два – лучше. 

Горизонтальный фильтр в шаблоне Origami от Сотбит

Навигация не более, чем в 3 клика

В погоне за оригинальностью, многие разработчики забывают про пользователя. Сложная архитектура и запутанная навигация пугают пользователей и те уходят с сайта, так ничего и не купив. Шаблон Origami от Сотбит ориентирован на пользователя. Поэтому в большинстве случаев вам понадобится всего 2 клика, чтобы попасть из любого раздела сайта в интересующее вас место.
Навигация по шаблону Origami меньше чем в 3 клика

Добавление товара в корзину из любого блока

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

Добавление товара в корзину из любого блока шаблона Origami

Мобильный фильтр

Что вы знаете про удобный фильтр в мобильной версии интернет-магазина? Как вы относитесь к всплывающим окнам, закрыть которые бывает очень непросто, ведь попасть пальцем в маленький крестик – задача не из легких? Нас это откровенно бесит. Поэтому в мобильной версии Оригами вы не найдете такого фильтра. Блок с фильтром плавно выезжает слева, предлагая вам пункты, по которым вы можете отфильтровать товары. Закрывается фильтр легким движением пальца: искать маленький крестик и целится в него не придется.
Мобильный фильтр в шаблоне Origami

Мобильная карточка товара

В основе страницы мобильной версии заголовок с названием товара и крупной фотографией, которые пользователь может скролить пальцем. Выбор свойств товара находится сразу под фото. А вот кнопка «В корзину» и выбор количества товаров закреплены внизу экрана телефона. То есть пользователь, в какой части страницы он бы не находился, может положить товар в корзину!

Мобильная карточка товара в шаблоне Origami

Мобильная страница оформления заказа

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

Мобильная страница оформления заказа в шаблоне Origami

Что имеем по итогу? Новый шаблон для проектов на 1С-Битрикс, который мы назвали Оригами, это не очередной типичный примитив. Это универсальный инструмент, наполненный мощным функционалом и спроектированный с ориентацией на пользователя. Сотбит.Оригами – позволяет создавать любые интернет-магазины для людей. А его продуманный дизайн может увеличить конверсию магазина.

Виктория Филимоненко Виктория Филимоненко
Время чтения: 4 мин
Поиск товаров на Битрикс – эффективный инструмент интернет-магазина
Модули

Поиск товаров на Битрикс – эффективный инструмент интернет-магазина

Узнайте, как оптимизация поиска на вашем сайте влияет на улучшение конверсии и повышение среднего чека интернет-магазина. Исправляйте ошибки, управляйте поисковой областью и приоритетами результатов выдачи вместе с модулем Сотбит: Умный поиск.

Сотбит: Умный поиск
Максим Карабовский Максим Карабовский
Время чтения: 2 мин
Личный кабинет поставщика от Сотбит: особенности, преимущества, кейсы
Маркетплейсы

Личный кабинет поставщика от Сотбит: особенности, преимущества, кейсы

Рассматриваем оптимальное решение Сотбит: Маркетплейс для внедрения собственного личного кабинета партнера.

Сотбит: Маркетплейс Энтерпрайз

Остались вопросы по статье?

Оставьте свой контакт и наш менеджер вас проконсультирует.

ФИО:*
E-mail:*
Телефон:
Подтвердите, что вы не робот:*
Сообщение: