Как расширенная индивидуальная разработка Shopify улучшает взаимодействие с пользователем

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

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

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

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

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

Тщательный процесс миграции

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

В то время как Spree предлагал почти безграничные возможности для настройки, Shopify Plus, как размещенная платформа SaaS для электронной коммерции, могла предложить им гораздо больше. С помощью команды разработчиков, такой как ^{1Digital Ⓡ} , Shopify Plus может предложить им все настройки, которые предлагал Spree, и многое другое. Shopify Plus также предлагал повышенные функции безопасности, гарантированное время безотказной работы, высокую скорость сайта, аналогичную совместимость со сторонними приложениями и плагинами, принятие ряда вариантов оплаты, огромную масштабируемость и многое другое. В этот момент перед Paravel была поставлена ​​задача перенести свой существующий магазин Spree, а также его дизайн и функциональность в Shopify Plus.

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

Процесс был интенсивным, но агентство ^{1Digital Ⓡ} не могло выполнить все с честью. Проект потребовал миграции 32 полей продукта (включая названия, описания, изображения, цены и т. д.), а также более 4000 учетных записей клиентов и заказов каждого. Для этого мы установили временный сервер Linux и написали собственный сценарий для извлечения и классификации этой информации из инвентаря Spree их исходного сайта.

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

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

К счастью, наш процесс миграции предотвращает повреждение SEO так же тщательно, как и потерю данных. С Paravel, как и с каждым проектом миграции, мы собрали все URL-адреса, связанные с их веб-сайтом, а затем настроили переадресацию 301 на связанные URL-адреса на новом веб-сайте Shopify. Неудивительно, что Paravel не пострадал от потери трафика или колебаний рейтинга после завершения миграции.

Поддержка — на всякий случай

Миграция на Shopify прошла без проблем, и Paravel был на пути к новому магазину Shopify Plus с расширенными функциями и улучшенным пользовательским интерфейсом, но на всякий случай мы включили в проект миграции бесплатный 30-дневный период поддержки. . Любое миграционное агентство Shopify с проверенным процессом должно сделать это; это всего лишь неотъемлемая часть успешной стратегии миграции.

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

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

Недавно разработанный веб-сайт

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

В рамках своего проекта разработчики агентства ^{1Digital Ⓡ} создали для них совершенно новую домашнюю страницу, которая была лучше интегрирована с брендом и помогла позиционировать их продукты в более привлекательном свете. В нем были представлены обновленные изображения продуктов и фоновые изображения, которые лучше соответствовали интересам и представлениям их целевого рынка. Взгляните на гладкую, утонченную новую домашнюю страницу ниже, а под ней — старую домашнюю страницу.

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

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

В дополнение к главной странице ^{1Digital Ⓡ} разработала новый шаблон страницы категории вместе со страницей «Наша история» для Paravel поверх нескольких других системных страниц. Среди тех страниц, которые были разработаны, были их страницы корзины и оформления заказа, страницы входа, страницы подарочных сертификатов и страницы «Спасибо». Наконец, мы настроили ряд содержательных страниц, включая их страницы «Часто задаваемые вопросы» и «Условия».

Важность высококачественного адаптивного дизайна веб-сайта имеет решающее значение для электронной коммерции в настоящее время, и разработчики ^{1Digital Ⓡ} тщательно подготовили обновленный адаптивный веб-сайт для Paravel в рамках проекта. В интересах пользователей Paravel новый адаптивный дизайн от ^{1Digital Ⓡ} автоматически адаптируется к меньшим экранам, соответствующим образом изменяя размер и формат текста.

Расширенная разработка — функциональность страницы категории

Когда разработчики ^{1Digital Ⓡ} передали всю информацию, связанную с категориями продуктов Paravel, мы также добавили некоторые новые функции, чтобы они могли передать их своим клиентам, тем самым улучшив качество обслуживания клиентов.

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

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

Точно так же разработчики ^{1Digital Ⓡ} создали функции «Образцы продуктов» и «Быстрый просмотр» на страницах коллекций Paravel. Мы создали собственный скрипт для их страницы коллекций Shopify Plus, который мог получать и отображать нужную информацию.

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

Расширенная разработка — функциональность страницы продукта

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

Таким образом, в рамках аспекта продвинутой разработки проекта ^{1Digital Ⓡ} помогла создать новый и улучшенный набор функций для персонализации покупок на своем веб-сайте, в частности на странице продукта.

Мы настроили их шаблон страницы продукта так, чтобы он отображался аналогично их старому магазину Spree. Затем мы создали панель «добавить в корзину», которая оставалась внизу страницы продукта. Это была легкая часть.

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

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

Инструмент, который мы создали для Paravel, отображал всплывающее окно со словами «Персонализация», когда покупатель посещал страницу продукта. Затем мы создали инструмент, который позволил бы покупателю персонализировать продукт в соответствии со стилем и цветом надписи, которая будет отображаться как монограмма с их инициалами.

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

Было еще несколько настроек, которые мы создали для страниц продуктов Paravel, в том числе реализация четырех вкладок со страниц продуктов в их старом магазине Spree с помощью HTML-кодирования. Мы также воссоздали функцию «Выбери свое собственное приключение» из магазина Paravel's Spree, которая позволяет покупателям дополнительно персонализировать продукты Paravel с помощью аппликаций и рисунков, нарисованных вручную, в дополнение к нескольким другим настройкам, чтобы сохранить целостность оригинальной функциональности, появившейся на их магазин Spree.

Интеграция с критически важными приложениями

Чтобы обеспечить функциональность своего нового магазина Shopify Plus и обеспечить бесперебойную и приятную работу пользователей, агентству ^{1Digital Ⓡ} пришлось интегрировать новый магазин Paravel со своими критически важными для бизнеса приложениями.

Среди прочего, клиенты Paravel полагались на обзоры и отзывы, которые Paravel смог нарисовать и отобразить через YotPo, который, как мы обеспечили, был легко интегрирован для них. Paravel также в значительной степени полагалась на использование Zaius для взаимодействия с клиентами и CRM, поэтому мы выполнили эту интеграцию, а также вышеупомянутые.

Кроме того, Paravel использует функциональные возможности, предоставляемые не только RJ Metrics, но и Talkable. Эти приложения предоставляют администраторам Paravel ценные данные и позволяют проводить безопасные программы реферального маркетинга.

Агентство ^{1Digital Ⓡ} интегрировало все эти приложения с новым магазином Paravel в дополнение к кодированию и разработке своего нового веб-сайта Shopify Plus. Мы завершили этот комплексный по объему проект, включающий миграцию и расширенную разработку на заказ, без зависаний. То есть у клиента не было ненужных перерывов в работе, не было потери трафика, и он без особых проблем перешел в новый магазин с расширенными пользовательскими функциями. Для этого требуется опыт и тщательные процессы, которые ^{1Digital Ⓡ} интегрирует в наш рабочий процесс.

Комплексное решение

Некоторые провайдеры настраивают свои услуги на один или два узкоспециализированных сервиса, но мы знаем, что проблемы, с которыми сталкиваются продавцы электронной коммерции, разнообразны. Если бы мы могли предлагать только услуги по разработке, мы бы не смогли перенести Paravel со Spree на Shopify Plus, одну из ведущих платформ электронной коммерции для онлайн-продавцов. Точно так же, если бы мы ограничились выполнением миграции, мы не смогли бы настроить их новый магазин так, как они хотели.

Услуги Shopify Plus по дизайну и разработке, даже в сочетании с нашими услугами по миграции, — это лишь малая часть того, что предлагает агентство ^{1Digital Ⓡ} . Помимо наших услуг по индивидуальному дизайну Shopify, мы также предлагаем комплексные кампании цифрового маркетинга, включая высококонкурентные, тщательно изученные и целевые кампании SEO и PPC.

Эта история успеха основана на том факте, что мы смогли перенести Paravel со Spree в недавно разработанный магазин Shopify Plus с расширенными функциями. Многие из наших других тематических исследований электронной коммерции сосредоточены на других платформах электронной коммерции, таких как дизайн и разработка BigCommerce, аналогичные услуги Magento и кампании цифрового маркетинга. Ознакомьтесь с нашим репертуаром, и если вы хотите узнать, как мы можем решить проблемы, с которыми сталкивается ваш онлайн-бизнес, позвоните нам по телефону 888-982-8269.

Скачать PDF