Цели и задачи
Клиенту требовался дизайн нового адаптивного интернет-магазина детских товаров.
Во главе корпоративных ценностей Lapsi стоит забота о клиенте. Им важно обеспечить комфорт и безопасность каждого малыша. Именно поэтому вся продукция, представленная в интернет-магазине, выполнена из высококачественных и надежных материалов. Нам было важно донести эту идею компании Lapsi на новом сайте.
Клиент
Lapsi — сеть из 9 специализированных салонов и один из крупнейших в России интернет-магазинов товаров для новорождённых детей и будущих родителей. Компания с 2005 года предоставляет огромный выбор товаров от лучших мировых производителей колясок, детских автокресел, детской мебели и аксессуаров.
Аналитика
На этапе аналитики мы плотно погрузились в специфик у бизнеса клиента, провели качественные и количественные исследования и выявили ряд особенностей.
Покупка коляски в среднем занимает месяц. За это время происходит омниканальное взаимодействие с компанией: пользователи не раз приходят в салон, смотрят сайт с разных устройств в течение дня несколько раз.
Выбор коляски ложится на плечи нескольких человек. Обычно мама малыша и ее подруги делают выбор на эмоциях, тогда как отец подходит к выбору товара практично и смотрит на характеристики.
После покупки коляски родители возвращаются в магазин за товарами для растущего малыша еще несколько раз. В среднем после первой покупки родители возвращаются в Lapsi еще в течение 4 лет.
В течение всего этапа аналитики мы снимали различные метрики, опрашивали менеджеров, проводили полевые исследования и глубинные интервью. Наша команда досконально изучила рынок детских товаров в России, сайты конкурентов. Мы провели серию опросов, которые помогли максимально глубоко изучить поведение пользователей на сайте.
Исследования помогли выявить некоторые особенности при выборе разных категорий детских товаров покупателями. Например, коляски в первую очередь выбирают по тому, насколько с ней удобно гулять при той или иной погоде, по внешнему виду, бренду, новизне. Только после выбора по этим признакам смотрят на другие характеристики, такие как габариты, вес и размер люльки.
В оффлайне клиенты очень часто обращаются к менеджерам за консультацией, знаниями и экспертным мнением. Менеджеры, в свою очередь, с радостью помогают не только сделать правильный выбор, но и разобраться в специфике. Мы хотели транслировать этот же подход и в онлайн, подошли к вопросу с заботой о пользователе.
работать с клиентом в качестве консультанта. Сайт должен информировать, отвечать на любые возникающие вопросы и помогать с выбором товара.
Проектирование и дизайн
Еще в процессе аналитики выяснилось, что посещение сайта в 60% случаев проходит с телефона, однако финальная покупка чаще совершается с компьютера. На основе этого мы сделали вывод, что на текущем сайте механизм покупки с телефона не очень удобен для пользователей и взяли за правило сделать упор на улучшение пользовательского опыта в первую очередь с мобильных устройств.
Подход mobile first мы применили уже на этапе проектирования: к сайту подошли больше как к приложению, мыслили не страницами, а состояниями, прорабатывали множественные сценарии работы пользователя с сайтом и все соответствующие этому состояния.
Уже на этом этапе мы начали транслировать идею заботы о клиентах, которая отражена в каждом принятом дизайн-решении.
Весь интернет-магазин заточен под просмотр с мобильных устройств, а значит очень важно было свести количество открытий новых страниц с перезагрузкой к минимуму для комфортной работы пользователей. В итоге мы остановились на всплывающих полноэкранных страницах, которые подгружаются бесшовно без перезагрузки.
Каталог
На основе проведенной аналитики и требований по SEO мы сильно переработали структуру каталога. В верхнем меню вывели только самые главные общие разделы, появилась возможность добавить товар в избранное и сравнить с другой понравившейся моделью коляски/автокресла или аксессуаром.
В новом дизайне вся важная и актуальная информация всегда остается на виду: необходимые элементы закрепляются и не исчезают из поля зрения при пролистывании страницы.
Часто пользователи не просто выбирают товар по характеристикам, а держат в голове определенный набор ситуаций из жизни: нужна прогулочная коляска, удобная для загородных прогулок, коляска-спутник при частых путешествиях на самолёте, одна универсальная коляска 2-в-1. Для таких покупателей мы добавили в каталог тематические карточки-подборки, которые могут упростить и ускорить подбор коляски.
Карточки товаров
Мы уделили большое внимание карточкам товара, помня при этом о заботе о клиентах Lapsi. Вначале выводится вся общая необходимая информация, после идут детали. При такой подаче у опытных пользователей не должно возникнуть дополнительных вопросов, а для новичков в базовом описании не будут фигурировать непонятные и отпугивающие слова. Помня о заботе о клиентах Lapsi, мы добавили к каждому товару столько информации, чтобы интернет-магазин выполнил функцию консультанта не хуже менеджера в оффлайн-точке продаж.
К каждому товару прилагаются визуальные материалы (фото, видео, 360), чтобы можно было рассмотреть товар практически также детально, как в магазине. В описании раскрываем все технические особенности товаров и комплектации. В каждой карточке присутствует информация об акциях, гарантии и доставке.
Самые приоритетные товары — детские коляски и автокресла. Если у коляски есть совместимое автокресло, мы предлагаем его и необходимый переходник в качестве сопутствующего товара. Так пользователь экономит своё время, которое потратил бы на подбор, а также он точно может быть уверен, что выберет только совместимую модель.
Два уровня фильтрации
Для удобства пользователей мы разделили фильтр на две части: ключевые показатели и подробности.
Ключевые особенности с описаниями, такие как тип коляски, выделили в отдельную сущность, а подробности, такие как бренд, цвет, цена, страна производства, механизм коляски и др. выводим только тогда, когда появляется потребность детальной фильтрации.
Кроме того, в фильтре мы даем пользователям подсказки, которые помогают им с выбором.
Вишлисты
Пользователи часто советуются с близкими перед тем, как совершить покупку на сайте. Для удобства обсуждения всех выбранных товаров мы добавили функционал «вишлист». Покупатели могут добавлять в него все интересующие их товары, делиться ссылкой на вишлист в социальных сетях и мессенджерах с близкими и обсуждать необходимость покупки и свой выбор.
Конструкторы
Существуют модели колясок, которые не продаются в собранном виде, их можно собрать из различных составляющих. Специально для таких случаев мы вывели в сетку каталога отдельные карточки сборных моделей, а также проработали удобный конструктор.
Он позволяет собрать полную комплектацию, добавляя аксессуары к базовым элементам коляски. Им одинаково комфортно пользоваться как на десктопе, так и на мобильных устройствах.
Подбор аксессуаров
При покупке детских товаров пользователи часто сталкиваются с определенной проблемой. Казалось бы, ты уже
выбрал коляску мечты, она удовлетворяет всем твоим потребностям, понравилась жене, друзьям, бабушкам у
парадной. Ты уже потратил кучу времени на изучение отзывов и пора нажать кнопку «купить», как оказывается, что
к коляске нужно выбрать еще 1000 и 1 аксессуар.
Зонтики, сумочки, держатели для телефона, рукавица для зимних прогулок, чехлы, и прочие стаканы… Что с чем
совместимо? Что без чего бесполезно? На сайте Lapsi мы предлагаем все товары организованно, чтобы максимально
упростить процесс выбора сопутствующих товаров под конкретные модели.
После выбора модели товара на сайте мы предлагаем дополнить комплект только подходящими к ней аксессуарами.
Совместимость колясок и автокресел
Некоторые модели автокресла можно использовать как люльки для колясок, главное, чтобы автокресло и коляска были совместимы. Чтобы все это скрепить в единой конструкции, требуется купить дополнительный адаптер. Сделать верный выбор сложно, особенно когда на сайте очень большой выбор колясок и автокресел, а для каждой комбинации подходит только определенный адаптер. Простым перебором вариантов сделать выбор почти нереально, но мы нашли другой выход.
При выборе кресла или коляски сайт Lapsi сразу же предлагает сопутствующий универсальный или подходящий непосредственно под эту модель товар, а также подсказывает, какие адаптеры подойдут.
Результаты
По результатам проделанной работы мы получили функциональный и современный дизайн интернет-магазина, заточенный под удобство и заботу о пользователях.
Среди технологических улучшений для магазина в будущем мы рассматриваем внедрение Google AMP. Так страницы, на которые будут попадать из мобильного поиска, станут загружаться гораздо быстрее. Также отличным улучшением для проекта станет дальнейшее развитие функционала вишлиста, который позволит нескольким пользователям совместно выбирать товар и другие фишки, положительно влияющие на пользовательский опыт.
