E-commerce приложение винного бутика. Стиль, легкость и микросервисная архитектура
ЗаказчикЛРВ — официальный представитель винодельческого хозяйства «Chateau Cotes de Saint Daniel» в России.ЗадачаСоздать мобильное приложение с каталогом продукции и возможностью заказа.
ЛРВ — официальный представитель винодельческого хозяйства «Chateau Cotes de Saint Daniel» в России. Ассортимент их флагманского бутика Джаннет — лимитированные крымские вина, крепкий алкоголь и винные аксессуары.За годы работы бутик накопил базу постоянных клиентов. ЛРВ хотели подкрепить лояльность покупателей: оперативно принимать заказы и заранее готовить их для самовывоза.
ЛРВ поставили задачу запустить сдержанное и стильное мобильное приложение с гибкими возможностями подбора продукции, удобным чекаутом и интегрированной программой лояльности.
Дизайн и юзабилити
Ориентирами дизайна были: чистота линий и цветов, акцент на продукции, привычные паттерны поведения, информативность. Аудитория бутика — консервативные ценители алкоголя, которые могут себе позволить продукцию стоимостью выше среднего. Поэтому мы не стали использовать ультрасовременные, трендовые элементы, или усложнять навигацию. Остановились на темной теме, чтобы подчеркнуть эксклюзивность и элитарность, добавили доработанный фирменный оттенок шато.
Но приложение получалось слишком сухим и однообразным, не хватало аппетитности и изысканности. Поэтому в карточках товара появились фотографии виноградной долины, а в каталоге бордовые, розовые и пшеничные подложки. Они указывают на цвет вина.
Задачи пользователя
Пользователь через приложение хочет решить три задачи: найти и выбрать товар, оформить заказ, отследить — иметь под рукой данные для выкупа.
Найти и выбрать
Каталог разделен по типам продукции, но посмотреть все доступные товары можно и в одной ленте. На мини карточках есть информация, которая поможет профи в винном деле быстро принять решение. Цвет, сахар, страна, объем. Вверху каталога находятся тэги — самые популярные свойства данного типа алкоголя. По ним быстро фильтруется нужный ассортимент.
Основной фильтр меняется в зависимости от каждого раздела. Где-то добавляются категории, где-то значения. Свойства фильтра взаимосвязаны: при выборе одного, не соответствующие свойства деактивируются.
Карточка товара выстроена по принципу «от главного к второстепенному» и охватывает все параметры для принятия решения. Гастрономические сочетания обозначены иконками, чтобы не ломать строгость и не утяжелять карточку картинками.
Оформить заказ
Данные о наличии товаров обновляются при переходе в корзину. Если позицию невозможно забрать сегодня, карточка становится неактивной. Потому что в первую очередь приложение предназначено для предзаказа и самовывоза. По этой же причине пользователь видит срок хранения товара.
Оформление заказа состоит из:
- двух шагов для зарегистрированных пользователей — оформить и подтвердить заказ;
- трех шагов для незарегистрированных — оформить, указать телефон, подтвердить.
- Онлайн покупка алкогольной продукции запрещена, поэтому эквайринг не предусмотрен.
Отследить
Заказы активные, прошлые и отмененные собраны в разделе «мои заказы». Доступен номер и статус. При смене статуса пользователю приходит пуш-уведомление.
Данные активных заказов выведены на главной странице, чтобы освободить пользователя от поисков по разделам.
Мы персонализировали главную страницу. Неавторизованный пользователь видит общедоступные блоки: акции, подборки, каталог. Для авторизованного пользователя появляется блок с активными заказами, картой лояльности и историей заказов. По тапу на карту открывается штрихкод, которым удобно воспользоваться в магазине. История заказов позволяет прямо с главной повторить заказ, а не искать по разделам ту бутылку вина, которую купили месяц назад.
Архитектура и интеграции
Приложение «Винный бутик» состоит из серверной части и мобильного пользовательского приложения.
Пользовательское приложение — совокупность интерфейсов и их логика — написано нативно. То есть на языках тех библиотек, которые используют Android и iOS. Нативное приложение живет дольше и на длительной дистанции оказывается надежнее — его легче и менее затратно адаптировать под обновления платформ.
Серверное приложение отвечает за взаимодействие с 1С и элементами пользовательского приложения. Оно построено по принципам микросерверной архитектуры — разбито на несколько сервисов с определенной функцией. Например, сервис обновления пользователей, регистрации заказов, актуализации данных. Все составляющие архитектуры общаются между собой через API. Главный источник информации для приложения — 1С.Оттуда мы получаем данные о продукции, заказах, пользователях, персональных скидках по программе лояльности и отправляем данные о новых заказах. 1С может уходить на периоды обновления, быть недоступной, долго отвечать из-за нагрузки. Поэтому между 1С и серверным приложением есть кэширующая база данных PostgreSQL. Кэширующий слой общается с 1С, обновляет данные по двум видам запросов:
- с регулярной периодичностью — список товаров и бутиков, доступность товаров в бутике, список пользователей;
- сиюминутные запросы — регистрация нового пользователя, оформление заказа.
Ассортимент бутика относительно небольшой и этих запросов хватает, чтобы пользователь всегда оперировал актуальной информаций, без лишней нагрузки на приложение.
Сейчас клиенты ЛРВ используют понятное, легкое мобильное приложение. Оно помогает в комфортном для покупателя режиме сориентироваться в ассортименте и сделать выбор. При желании приложение можно масштабировать, добавить новые функции и интерфейсы.
Скачать приложение: Android, iOS.
Перейти на сайт
Полный текст статьи читайте на CMS Magazine
