Интернет-магазин
для Pis Saro

История о том, как мы помогли клиенту выйти из сложной ситуации. Или запуск интернет-магазина со второй попытки
Мы разработали интернет-магазин для двух разных рынков — русскоязычного и мирового. С онлайн-оплатой через Paypal, удобной административной панелью и рядом других фишек. О некоторых расскажем ниже.

Проект имеет большую и интересную историю до момента, в котором появляется «Студия Вилкина».

О клиенте Pis Saro — крутой художник и тату-мастер из Крыма, которая обрела популярность на весь мир благодаря талантливым флористическим тату-работам и линии уникальных купальников.
Что было до нас

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

В какой-то момент клиент понял — нужно менять сайт. И решил найти подрядчика на разработку нового интернет-магазина. Спустя некоторое время у клиента появился новый сайт. ↓

Разработчики нового сайта в процессе отказались решать (или не смогли) возникшие сложности и выкатили полурабочий продукт. Клиент потерял деньги, время и нервы, после чего пришел к нам. Обычно мы не работаем с чужими проектами, но пошли на компромисс и помогли распутать сложившуюся ситуацию.

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

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

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

Что мы нашли?

Основным каналом трафика на сайт является Инстаграм, поэтому на мобильную версию сайта приходится 90% посещений. Разумеется, мы уделили особое внимание именно ей, в частности: корзине, оформлению заказа и карточкам товара.

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

Как мы это исправили

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

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

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

Так как купальники продаются по всему миру, то сайзгид должен легко считываться как для стран с метрической системой, так и для стран, использующих английскую систему мер. Для этого мы сделали переключатели sm/inch c запоминанием в куки сайта, т. е. человек, однажды выбрав сантиметры в сайзгиде, будет видеть сантиметры во всех карточках — мелочь, а приятно.

Оформление заказа

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

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

1. В то же время, на этапе оформления, пользователь сможет посмотреть список товаров в корзине.
2. Из-за международной доставки для оформления заказа требуется много полей. Чтобы пользователю было легче, мы разделили их по смыслу и сделали более легкий дизайн.
3. Контактные данные максимально упростили, объединили несколько полей, добавили удобный выбор страны из списка (ранее страну заполняли вручную, поэтому каждый заказчик писал по-своему. К примеру, для США мы насчитали 7 разных вариантов написания), а так же сделали удобное поле для комментария к заказу.

После внесения изменений у нас появилась гора новых возможностей для аналитики. К примеру, мы узнали, что $ 10 за доставку слишком дорого для половины посетителей из-за границы. Так же заметили, что клиенты не хотят оставлять номер телефона, но он нужен для экспресс доставки. Всё это позволит внедрить ряд доработок, каждая из которых немного повысит конверсию.

Страница с контактами
Страница с контактами отсутствовала. Мало кто хочет отправлять деньги неизвестно куда. Но была еще одна сложность — местоположение. Крым проблемный регион, была вероятность, что это будет отпугивать покупателей из других стран, поэтому на международной версии указан петербургский адрес, а на российской — крымский.
Главная страница
Раньше главная страница не несла смысловой нагрузки, с нее можно было только уйти в любой из двух разделов каталога. Мы же решили познакомить посетителей с новинками и флагманскими предложениями, добавив промо-блоки с названием, ценой и ссылкой на позицию. Теперь, если на сайт переходит юзер, который не знаком с брендом, у него есть возможность узнать подробности без изучения каталога.
Резюме

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

Кейс Интернет-магазин Pis Saro Длинная история