Made on Collabza

Личный кабинет для интернет-магазина Silky Drum

Интернет-магазины

Заказчик:

Silky Drum — компания по обжарке кофе, специализирующаяся на зернах премиального качества. Команда лично отбирает зерно на фермах в Гондурасе, Колумбии и Эфиопии, выстраивая прямое сотрудничество с фермерами. Все процессы — от закупки до обжарки и упаковки — находятся под их контролем, что обеспечивает стабильное качество и прозрачность происхождения продукта.

Задача:

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

На этом этапе мы учли технические особенности сайта и описали подробную логику работы личного кабинета. От первого касания до подписания договора прошло всего 10 дней.

В процессе разработки мы тесно работали с дизайнером компании, чтобы создать уникальный UX/UI дизайн, органично сочетающийся с фирменным стилем бренда.

Что было сделано:

  1. Разработали уникальный UX/UI дизайн в Figma с анимацией. Подготовили дизайн-проект для передачи в разработку;
  2. Сверстали дизайн-проект на Tilda с адаптацией (320 — 1920px), подключили модификации и написали дополнительный HTML, CSS, JS код для улучшения работы платформы;
  3. Разработали базу данных в Airtable и подключили интеграции Collabza для передачи данных из базы в личный кабинет на Tilda;
  4. Собрали сценарий в Make для регистрации, редактирования профиля, покупки, списания бонусов;
  5. Протестировали работу кабинета и корректность отображения данных.

Итоговый результат:

Вход в аккаунт

Регистрация:

Восстановление пароля:

Мои заказы:

Раздел показывает последние оформленные заказы. Каждая карточка включает в себя номер и дату заказа, фото товаров, стоимость и кнопку для перехода на страницу заказа.

Страница заказа:

Страница с детальной информацией по заказу. Клиент видит все данные, что вводил при оформлении заказа в корзине: контактные данные, способ и адрес доставки, комментарий, состав и детализацию стоимости.

Программа лояльности:

Программа лояльности включает 4 уровня, на каждом из которых клиент получает персональную скидку: 0, 10, 15 или 20%. Помимо персональной скидки, клиент может получить бонусы за разные события: регистрация, день рождение и др. Бонусы сгорают автоматически через 180 дней без новых заказов.
В заказе возможно использовать только 1 вид скидки: промокод / персональная скидка / бонусы. Для активации достаточно кликнуть на нужную кнопку.

Профиль:

Профиль клиента включает в себя персональные данные пользователя и кнопки управления: настройки, изменение пароля и выход из аккаунта.

Настройки профиля:

Контакты: