Как оформить витрину интернет-магазина? или 5 ошибка в юзабилити интернет-магазинов

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

Сегодня я хотел рассказать о 5-ой ошибке юзабилити интернет-магазинов — это отсутствие витрины, неправильно выбранное содержание и расположение.

Пример из жизни:

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

casio-on-display

или такой:

test

Первая витрина указывает на «дешевизну» товаров и огромный ассортимент.

Магазины, осуществляющие продажу дорогих марок часов, как правило, имеют небольшой  выбор товара, так как ориентируются на продажу одной торговой марки. Соответственно, по второй витрине можно сделать вывод, что часы там не дешевые, нужный подарок вы сможете найти там.

Что такое витрина в случае интернет-магазина?

Витрина — это перечень товаров на главной странице (реже на странице каталога), которые по какой-либо причине хотелось бы больше продавать или они носят привлекающий характер, например, товар “локомотив”.

Нужна ли витрина интернет-магазину?

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

Наличие витрины первый признак покупателю, что он попал в магазин, а не в новостной блог или на сайт производственной компании.

Как не нужно делать витрину: интернет-магазин мебели http://www.aleanamebel.ru/

Сохраненное изображение 2015-2-9_12-18-35.737

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

1) часть пользователей, прежде чем купить товар, предпочитают ознакомиться с другим ассортиментом интернет-магазина, да и просто посмотреть, что он из себя представляет;

2) есть поток пользователей, которые попадают в интернет-магазин через поиск, их интересует весь ассортимент.

Поэтому с точки зрения юзабилити анализа (usability testing) и анализа маркетинговой составляющей интернет-магазину нужна витрина.

К тому же, у покупателей, впервые попавших в ваш интернет-магазин, именно из товаров витрины складывается представление о ценовом уровне и ассортименте товаров интернет-магазина, а также о проводимых акциях/скидках.

Как не надо делать:

Сохраненное изображение 2015-2-4_16-57-57.420

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

Как лучше сделать:

Сохраненное изображение 2015-2-4_16-59-32.437

Из этой витрины видно: минимальную стоимость диванов 2999 рублей, акции, что работает на Яндекс.Маркете, а значит можно почитать отзывы покупателей (что значительно повышает лояльность покупателей) и т.д.

Что должно быть представлено на витрине интернет-магазина?

Понятно что, пользователь, пришедший на ваш сайт по запросу «кухня в Москве купить», увидев на витрине офисную мебель, подумает «не туда попал» и покинет сайт.

Каждый владелец интернет-магазина должен сам решать, какие товары представить на витрине Главной, это могут быть:

1) акционные товары

2) сезонные товары

3) наиболее популярные товары

4) товары, которые вы хотите продать в большем количестве

5) товары, которые известны во всем мире и будут служить приманкой

6) товары на распродаже

7) новые поступления

Для случая, когда клиент авторизованный или не первый раз заходит в интернет-магазин, следует показывать те товары или группы товаров, которые он раньше покупал, это актуально, например, для интернет-магазинов по продаже товаров питания.

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

Исключения: не всегда использование витрины с точки зрения юзабилити анализа (usability testing) целесообразно, например, для интернет-магазина товаров с подбором размера, мощности и других параметров, единых на весь ассортимент магазина. Рекомендуется использовать в качестве витрины фильтр для подбора http://domson.ru/

test2

или витрину с функцией быстрого просмотра, как это сделано на http://www.wildberries.ru/ , где в сплывающем окошке есть возможность выбрать свой размер одежды из тех, что есть в наличии.

Каким должен быть дизайн витрины?

Здесь 2 основных момента:

1. Нельзя допускать, чтобы витрина сливалась с остальным содержимым интернет-магазина, поскольку она служит украшением и привлекает покупателей.

2. Графические элементы витрины должны дополнять находящиеся на ней товары.

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

Brand book (брендбук) — это свод положений о миссии, философии и основных ценностях бренда. Здесь обозначены основы корпоративной этики, иначе говоря, выстраивается образ компании, оговариваются идеи и эмоции, которые компания хочет донести до своих клиентов и партнёров.

Если же магазин реализует широкий ассортимент товаров, то дизайн витрины должен соответствовать общей стилистике сайта.

Важное дополнение к оформлению витрины.

Основной лозунг и идея маркетинга звучит как: «Вы продаете не товар/услугу, а эмоции и решение проблем». Поэтому не рекомендуется на витрине описывать все «фичи» товаров (feature-свойства, характеристики), покупатель изучит их подробнее в карточке.

Обязательно разместите на витрине сведения о том, «почему нужно покупать именно этот товар», «чем он окажется полезен» и «почему стоит приобрести товар именно здесь». Если на товар действует скидка – обоснуйте, «почему эта скидка именно сейчас», «какие сроки действия акции» и «сколько товаров по акции осталось».

Сравните 2 витрины:

Кроссовки волейбольные Asics GEL-VOLLEY ELITE 2 MT

Ликвидация коллекции

Скидка 16%

Старая цена 4600 рублей

Новая цена: 3864 рублей.

 

Кроссовки волейбольные Asics GEL-VOLLEY ELITE 2 MT

Когда занятия спортом в радость.

1) Улучшенная фиксация голеностопа.

2) Ортопедическая стелька для комфорта и амортизации снизит нагрузки на позвоночник.

3) Вентилируемая средняя подошва максимизирует циркуляцию воздуха

Цена 4600 рублей

Купить прямо сейчас

Какая витрина привлечет больше вашего внимания?

Как говорится, «на здоровье не экономят» и для покупателей спортивной обуви (в том числе и профессиональных спортсменов) гораздо важнее узнать о том, как товар сможет решить его проблемы, а именно: снизить нагрузку с позвоночника (и снять последующие боли в спине), а также надежно закрепить голеностоп — частую травму при занятиях активными видами спорта.

Уделите должное внимание тестированию товаров витрины, используя системы аналитики и статистики, чтобы отслеживать эффективность отображения того или иного товарного предложения на витрине.

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

Нужна ли подписка на рассылку и как должна выглядеть?

Продолжение следует…

Высоких Вам конверсий и продаж!

Как продавать больше конкурентов? (Часть 1)

Возникли проблемы с созданием витрины, пишите, подскажу.

 

 

Баннеры действительно работают? или 4-ая ошибка в юзабилити интернет-магазинов

Уважаемые читатели!

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

Основной вопрос: Нужен ли баннер на Главной?  

Пример из жизни:

На рынке много-много торговых палаток, и рядом находятся 2 мясных магазина.

На одном написано: Мясо.

На втором же, написано, что в магазине всегда свежее мясо птицы, свинина и говядина.

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

Баннер на Главной является составляющей витрины, которая показывает пользователям, что вы готовы им предложить. Таким образом, баннер на главной , однозначно, нужен с точки зрения маркетинга.

Баннер должен содержать больше графической информации, чем текстовой, т.к. пользователи ее воспринимают  легче, пример, как делать не надо, можно посмотреть на сайте интернет-магазина Королева Спорта:

Сохраненное изображение 2015-2-3_14-22-18.761

где в качестве рекламного баннера используется текстовый блок, который абсолютно не читается.

Только одни картинки тоже не воспринимаются, поскольку могут быть восприняты неоднозначно или вызовут множество вопросов.

Пример хорошего исполнения баннера, я бы сказал, как надо делать, можно посмотреть на сайте activizm.ru:

Сохраненное изображение 2015-2-3_14-24-52.556

Каких размеров должен быть баннер с точки зрения юзабилити?

Рекомендуется делать баннер шириной и высотой таким, чтобы его без проблем могли просмотреть в полном разрешении экрана своего устройства не менее 75%-80% ваших посетителей.

Помните, большой баннер оставляет важную для посетителей информацию за пределами первого экрана (первый экран-это та область сайта, которая просматривается без прокрутки страницы вниз и вправо):

Сохраненное изображение 2015-2-3_17-57-51.88

Какое дизайн решение использовать?

Цветовая гамма и используемые шрифты должны соответствовать тематике и общему стилю сайта.

Не рекомендуется делать слишком большое описание в баннере, поскольку тексты, особенно длинные,  не читаются. Старайтесь ограничиться парой слов крупного шрифта, чтобы пользователь боковым зрением зацепил информацию, целиком «проглотил» и остановился взглядом на ней.

Не используйте пестрящие красные тона, их излишек воспринимается как сплошная реклама и отсеивается, вступает в силу такой эффект как баннерная слепота:

Баннерная слепота — психологическая оптическая иллюзия, благодаря которой пользователь сайта не замечает рекламные блоки (баннеры) или объекты, похожие на них.(Википедия)

Сохраненное изображение 2015-2-3_17-11-29.524

Каким должен быть баннер статическим, flash баннер или сделанный с помощью яваскриптовых фреймворков?

Немного поясню, что это означает:

Статический баннер: просто картинка-никуда не двигается, ничего не делает.

Преимущество: простота, дешевизна и быстрая загрузка.

Недостатки: полностью исключается способность человеческого глаза улавливать движение, что снижает  степень вовлеченности пользователя 

Flash баннер — это баннер, организованный с помощью flash-технологии, т.е. анимация.

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

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

Баннер на основе яваскриптовых фреймворков (Javascript фреймворков) — это последовательность статических баннеров, связанных стандартными переходами с заданным временем перелистывания.

Это средний вариант по тем показателям, что я рассматривал ранее.

Какую информацию использовать на баннере?

Здесь вы должны разместить все то, что вы хотели бы показать вашему покупателю: хотите показать, чем вы лучше других, так разместите в баннере преимущества покупки именно у вас, как например это реализовано на сайте http://moscross.ru/:

Сохраненное изображение 2015-2-3_14-26-31.691

У вас есть товары «локомотивы» — расположите их в этом баннере. Практически во всех интернет-магазинах есть акции, расскажите в баннере о них.

Как не надо делать:

Сохраненное изображение 2015-2-3_14-25-20.728

Как надо делать:

Сохраненное изображение 2015-2-3_18-0-47.656

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

Как не надо делать можно посмотреть на сайте http://slalomshop.ru/:

Сохраненное изображение 2015-2-3_14-21-16.716

Несколько переключающихся баннеров рассказывают о различных товарах, но баннеры не кликабельны и ни предоставляют пользователю дальнейших действий, а искать товар, представленный на баннере, по каталогу будет не больше 2 покупателей из 100 (самые-самые горячие покупатели).

Внимание! Уделите должное внимание тестированию баннера. В идеале следует провести А/В тестирование баннера на сайте, оценивая эффективность с помощью статистики. Однако есть и более экономный вариант тестирования-покажите этот баннер своим друзьям или знакомым, поскольку ваш взгляд «замылен», и вы не можете в полной мере оценить, эффективен ли баннер.

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

Как должна выглядеть витрина с товаром?

Продолжение следует…

Высоких Вам конверсий и продаж!

 

Возникли проблемы с созданием витрины, пишите, подскажу.