Онлайн-квиз для подбора и рекомендации средств по уходу за кожей

СРОК ВЫПОЛНЕНИЯ: август 2023

ШТАТ ПРОЕКТА (ПРОЕКТНАЯ РАБОТА): 3 разработчика

ТЕХНОЛОГИИ: PHP 8.2, Laravel, PostgreSQL, HTML5, CSS, JavaScript, Vue, Git, Docker, Docker Compose

СТОИМОСТЬ ПРОЕКТА: < 500 000 руб.

КЛИЕНТ

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

ЦЕЛЬ

Реализовать интерактивное веб-приложение с онлайн-квизом и e-mail рассылкой результатов.

ОСНОВНЫЕ ЗАДАЧИ

1. Верстка интерфейса по макетам дизайнера.
2. Адаптация сервиса под систему iPadOS.
3. E-mail-верстка писем.
4. Разработка функционала для рекомендательной системы.
5. Создание административной панели.

РЕШЕНИЯ

Клиент предоставил дизайнерские макеты в Figma, список вопросов теста в Excel и объяснил свое видение разработки. Мы внимательно ознакомились с информацией, сделали верстку и продумали способы оцифровки требуемых процессов.

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

ВЕРСТКА

Онлайн-квиз является интерактивным инструментом маркетинговой кампании и транслируется с экранов iPad. Мы адаптировали интерфейс под iPadOS и максимально точно расположили его элементы для корректного отображения с планшетов. 

Отдельной задачей со звездочкой стала e-mail-верстка писем, которые отправляются на почту опрошенным людям. Нужно было найти аналог стороннего шрифта, использованного в макетах, чтобы он по умолчанию правильно отображался на всех устройствах. Мы подобрали схожие с оригиналом варианты и согласовали итоговый шрифт с дизайнером.

ФУНКЦИОНАЛ

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

Когда пользователь проходит квиз, ему предлагается получить личную подборку средств на почту. Оставленный e-mail потенциального покупателя автоматически вносится в базу данных сервера компании. 

АДМИНПАНЕЛЬ

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

Разработка админпанели и внесение корректив в онлайн-квиз без участия разработчиков – это прагматичное решение. Оно дает возможность актуализировать данные и использовать веб-приложение в других рекламных кампаниях.

РЕЗУЛЬТАТЫ

Разработка онлайн-квиза длилась 10 рабочих дней. Благодаря налаженному контакту с нашим клиентом, мы смогли осуществить все его пожелания быстро и точно.

1. Сверстали визуально приятный интерфейс с корректным отображением на iPad: подобрали шрифт, убрали висячие предлоги, заточили все элементы дизайнерского макета под iPadOS.
2. Реализовали функционал подбора косметический средств, e-mail-рассылки и сбора данных.
3. Сделали административную панель с возможностью вносить изменения в веб-приложение.

Заказчик получил гибкий маркетинговый инструмент для мероприятия и после его проведения дал положительную обратную связь.