Бетховен
Клиент
«Бетховен» – один из лидеров розничной торговли товарами для животных. Работает с 1993 года.
Вызовы
Реализовать удобное и понятное клиентам flow заказа
Совместно с командой «Бетховена» мы провели CJM-воркшоп и серию глубинных интервью. Это помогло нам определить основные потребности клиентов, найти многие возможные проблемные ситуации и барьеры. Проработка каждого шага в пути клиента в приложении помогла нам выстроить идеальный flow.
Повысить в приложении конверсию в покупки
Конверсия «визит -> покупка» в старом приложении «Бетховена» была 5%. Через 2 недели после запуска первой версии нового приложения конверсия выросла в 3 раза. Это было выше ожиданий заказчика.
Повысить рейтинг приложения в сторах
Рейтинг приложения в сторах был низким. Клиенты оставляли отзыв в сторе только тогда, когда возникала какая-то негативная ситуация, которую они хотели изменить. А вот довольные пользователи оценок не ставили: ведь для этого нужно специально зайти в стор. При этом клиентам новое приложение нравилось, и выручка от этого канала продаж росла. Чтобы исправить ситуацию, мы добавили в приложение нативные диалоги: клиент может оценить работу в нем, не переходя в стор. Это быстро и удобно. С появлением этого инструмента оценка приложения в сторах выросла до 4,8.
Как мы это сделали
Провели исследование
Работу над проектом начали с CJM-воркшопа. CJM (Customer Journey Map) — инструмент, который позволяет выявить потребности клиента, его мысли, желания и проблемы в каждой точке взаимодействия с продуктом от осознания потребности до покупки с учетом его целей, эмоций, сомнений и страхов. Он помогает высокороувнево взглянуть на путь пользователя, лучше его понять, а следовательно, дает хорошую базу для дальнейшего проектирования. Подробнее про эту услугу читайте здесь.
На следующем шаге в серии глубинных интервью с клиентами зоомагазинов выявили, что есть 2 основных фактора, которые привлекают клиентов в приложение конкретного магазина:
- привычный ассортимент;
- удобное и быстрое оформление заказа.
Большое внимание уделили не только позитивным, но и негативным юзкейсам, из-за которых пользователи могут отказаться от услуг магазина.
В ходе исследования мы выявили, что аудитория слабо привязана к бренду самой сети, а связь у нее больше с брендами производителей. Концепцию приложения строили, отталкиваясь от этой проблемы. Так родилась идея экосистемы для pet-parents с pet-friendly заведениями, грумерами, местами выгула и профилем питомца. А сам e-commerce стал не самоцелью, а лишь прочным фундаментом для этого.
Эти результаты помогли определить критерии важности. Совместно с командой «Бетховена» мы составили бэклог, расставили приоритеты и определили, как будет выглядеть дорожная карта развития будущего приложения — какие фичи войдут в первый релиз, а что можно оставить на потом.
Для первого релиза — самые приоритетные опции
Для первого релиза сосредоточились на двух основных этапах: создании удобного каталога, в котором просто ориентироваться и выбирать товары, и быстром оформлении заказа, где каждый шаг понятен и прозрачен для клиента. Ключевая задача – максимум прозрачности в расчете стоимости доставки, применении скидок, точности и легкости оформления заказа.
Чтобы выстроить качественное флоу, провели большую работу с прототипами. Команда «Бетховена» вместе с нашим аналитиком подробно проходили по каждому из них, обсуждали, какие проблемы уже были у клиентов или потенциально могут возникнуть. Благодаря такой тщательной проработке, флоу получилось простым и понятным на всех этапах. Поэтому уже с первого релиза приложение стало получать хорошие отзывы пользователей.
Функциональность в основе дизайна
«Бетховен» пришёл со своим UI-kit, фирменными цветами и логотипом. Эти элементы и легли в основу дизайна приложения. Но даже в дизайне заказчик оставался верен своему основному направлению: на первом месте – функциональность. Поэтому команда «Бетховена» в первую очередь смотрела, насколько то или иное дизайнерское решение понятно и удобно для всех уровней пользователей. Например, некоторые кнопки и текст сделали крупней, чтобы не возникло проблем у людей с плохим зрением.
Оформление заказа
В новом приложении полностью переработали флоу выбора товара – заказ. Так как товаров у интернет-магазина более 10 000, для корректного оформления заказа потребовалась сложная логика работы с большими таблицами.
К стандартным блокам, которые участвуют в процессе оформления заказа, мы добавили хранилище и модели. В хранилище запоминаются данные, уже выбранные пользователем. Модели позволили обрабатывать информацию из таблиц быстрей и эффективней, так как каждая из них привязана к конкретному сектору таблицы. В целом, это упростило и ускорило оформление заказа для пользователя.
Сейчас клиент сети «Бетховен» может за пару тапов сформировать заказ, повторить предыдущий, отложить товары и следить за их поступлением, добавить товар в избранное.
В приложении реализовали несколько вариантов доставки – курьером, в пункт выдачи или магазин сети. Чтобы клиент мог оценить стоимость доставки курьером, провели большую работу с картой: разделили ее на полигоны в зависимости от цены доставки и оформили их разными цветами. Пользователь может нажать на нужную область карты и сразу посмотреть условия.
Часто бывает так, что корм или необходимые расходные товары для животных нужно получить очень быстро. Мы реализовали «Экспресс-доставку» — функциональность, которая за последнее время стала привычной опцией для покупателей и необходимым требованием к e-commerce-приложению.
Фильтры для удобной работы с каталогом
Чтобы пользователь мог быстро ориентироваться в многообразии товаров магазина, мы реализовали фильтры в каталоге товаров. С точки зрения пользователя – это всего один экран, где он может быстро найти нужный товар. Но при разработке нужно учесть множество моментов:
- Какие данные клиент может вводить – если для поля количества это могут быть только целые числа, то вес упаковки корма не обязательно кратен килограмму, там допустимы нецелые значения.
- Нужно предусмотреть возможные ошибки – например, когда минимальное и максимальное значения фильтра равны нулю или между собой.
- Слайдер должен перемещаться с увеличением или уменьшением значения, которое вводит пользователь.
- К подборке товаров пользователь может перейти из разных мест – из обычного каталога, с акции или подборки на главной странице. Если он переходит с акции, то товары сразу фильтруются по бренду и размеру скидки. Если из обычного каталога – все фильтры должны быть сброшены.
Информативная карточка товара
Команда заказчика хотела, чтобы информация в карточке товара была максимально подробной. Для этого нужно было интегрировать приложение с программами лояльности, складского учета и каталогом товаров.
Одной из сложных в реализации фич стал листинг товаров. У одного товара могут быть разные по весу упаковки – например, 250 г, 1 кг, 3 кг, 5 кг корма. Некоторые из них могут продаваться по полной цене, а на некоторые может действовать акция. Все это необходимо отразить в карточке товара.
В приложении Бетховена пользователь может в одной карточке переключаться между разными по весу упаковками и видеть акции, которые на них распространяются. Каждый такой тап – это отдельный запрос в базу, который подтягивает изображение и цену, и карточка товара меняется. Но для пользователя этот процесс происходит быстро и бесшовно.
В карточке товара реализовали возможность оставить отзыв на товар и добавить фото. Когда накапливается более 3 отзывов, товару присваивается общий рейтинг.
Программа лояльности
Важной частью приложения стала программа лояльности. Клиенты сети Бетховен активно пользуются ей, оплачивая до 90% покупки бонусами и получая кешбэк.
К реализации программы заказчик подошел с присущей ему основательностью, поэтому в приложении мы постарались учесть все возможные юзкейсы. Например, добавили возможности подарить баллы другому пользователю или объединить 2 профиля — старый и новый — и посмотреть общую историю заказов. Если 1 картой пользуется вся семья, все ее члены могут привязать карту в приложении, но списывать баллы может только один.
Большая работа потребовалась для синхронизации «задвоившихся» учетных записей. Так как в интернет-магазине сети можно зарегистрироваться и по номеру телефона, и по электронной почте, у многих пользователей было 2 разных учетных записи: первая – с привязкой к телефону, вторая – к почте. Объединить их самостоятельно пользователи не могли. Кроме того, у них не получалось привязать существующую карту к обоим профилям или выпустить новую. Чтобы решить эту проблему, в приложении реализовали сложный механизм объединения учетных записей.
В приложении можно выпустить виртуальную карту лояльности или добавить уже существующую. Карту привязываем к двум параметрам: телефону и электронной почте. Поэтому восстановить ее можно по любому из них. Раньше восстановить карту можно было только по ее номеру, что было неудобно для пользователей.
Экология и благотворительность
Возможность отказаться от чеков
Команда «Бетховена» продумала возможность отказа от печати чеков. Для того, чтобы это сделать, нужно нажать на специальный баннер в приложении, перейти в форму, где оставить почту, на которую будет приходить электронный чек. В личном кабинете в любой момент можно отменить отправку на email и в посылке придёт бумажный чек. Бывают юзкейсы, когда классический печатный чек необходим: например, мелкооптовая закупка или покупка для благотворительности — тогда чек нужен для отчётности.
Программа благотворительности
В России есть много фондов, которые помогают животным. «Бетховен» решил поддержать это начинание и интегрировать в приложение программу благотворительности. В программе наглядно видно: каким фондам помогает магазин и каких животных уже спасли от тяжёлой жизни в приюте. Внести пожертвование можно, купив набор продукции для животных. Это не только продукты питания, но и ветеринарные препараты и игрушки.
Команда «Бетховена» хотела максимально гибко управлять параметрами программы: выводить главную цифру месяца, например, общее количество килограмм благотворительного корма или количество спасённых животных. Мы спроектировали решение, которое полностью генерируется на бэкенде, а приложение его только отображает.
Анимация при ошибках
В приложении добавили анимацию. Анимированные картинки домашних питомцев появляются каждый раз, когда клиент заходит в пустую корзину или происходит ошибка (например, нет связи с интернетом).
Инструменты для анализа поведения пользователей
Приложение интегрировали с несколькими системами пользовательской аналитики: Google Analytics, App Metrica и Firebase.
Это помогает команде Бетховена анализировать действия пользователей: какое количество пользователей работает в приложении, сколько пришло новых, на каких этапах воронка продаж прерывается чаще и т.п. Таким образом они могут проанализировать любой этап работы с приложением – от онбординга до момента оплаты заказа.
Таке аналитика помогает увидеть, что в приложении происходит что-то нетипичное и принять меры. Например, удаление приложения сразу многими пользователями. Или наплыв пользователей из стран, где компания не работает.
Повысили рейтинг приложения в сторах
При запуске первой версии приложения мы столкнулись с тем, что пользователи часто оставляют отрицательные отзывы, причем в случаях, которые напрямую не связаны с работой приложения (например, неправильная цена товара связана с работой бэкенда и никак не зависит от приложения). Тем не менее такие отзывы влияют на общую оценку приложения в сторах. Она у Бетховена была низкой.
Чтобы исправить ситуацию, мы добавили в приложение нативные диалоги: просим оценить приложение после того, как клиент сделал заказ или забрал его. Пользователю не нужно специально переходить в стор, чтобы оценить приложение, он может сделать это одним тапом в процессе заказа. Этот инструмент помог нам повысить оценку приложения. Сейчас она составляет 4,8 – это лучший результат по приложениям зоомагазинов.
С технической точки зрения реализовать этот инструмент несложно: Google и Apple предлагают готовое API для интеграции.
Кроме привычных сторов: Google и Apple, приложение «Бетховена» теперь появилось и в Huawei AppGallery. Это позволит владельцам Android пользоваться им несмотря на ограничения.
Результат
По итогам 2022 года процент заказов из мобильного приложения вырос до 40%.
Летом 2023 конверсия в покупку составила 16,51%, а MAU (количество уникальных пользователей за месяц) — 88 239.
Директор по электронной коммерции «Бетховена»
- Приложение в Google Play
- Приложение в App Store
