Личный кабинет и сайт Papa John’s

Задача

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

  • Личные кабинеты
  • FMCG
Награды
Рейтинг Рунета
Рейтинг Рунета
Золотой сайт
Золотой сайт

Технологии

  • Stylus

    Stylus

  • Webpack

    Webpack

  • React.js

    React.js

  • Next.js

    Next.js

  • Redux

    Redux

  • Express.js

    Express.js

Интеграции

  • RESTful API

    RESTful API

Дизайн-система

Для работы над проектом была создана дизайн‑система, включающая различные элементы и стили.

Аналитика

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

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

Проектирование

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

На основе полученных данных сделали прототипы сайта.

Главный экран

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

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

Быстрые фильтры

Добавили быстрые теги по пиццам, чтобы ориентироваться в ассортименте было проще. Для гурманов предусмотрен фильтр по ингредиентам.

Карточка товара

В карточке товара можно убирать и добавлять ингредиенты по вкусу. При нажатии на ссылку «Добавить ингредиенты» мы попадаем в конструктор пиццы.

Конструктор пиццы

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

Корзина

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

Счет пополам

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

Так компании друзей будет удобнее расплачиваться.

Статус заказа

По завершении оформления и оплаты заказа пользователь может увидеть ориентировочное время доставки, а также следить за изменением статуса заказа.

Пиццы-половинки

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

Личный кабинет

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

Похожие кейсы