Papa John’s Profile and Website
Task
Create a website for the global pizza chain, enabling users to quickly and easily order pizza and access information about cashback and promotions.
Technologies
Webpack
Next.Js
Express.Js
Redux
Stylus
React.Js
Integrations
RESTful API
Design System
We developed a custom design system, which includes unique elements and styles, tailored exclusively for this project.
Analytics
We analysed the current website and its metrics and identified several problems: it was not attractive to clients, the ordering process was difficult and deterred half the customers, and there was insufficient information on cashback and promotions.
The key requirements were: convenient and quick ordering, simple interaction with the service at every stage, and the option to accumulate bonus points or receive cashback.
Architecture
We considered a wide range of user-interface interaction scenarios, from basic actions like selecting a pizza, finalising an order, or signing up, to less critical ones such as evaluating previous orders, applying promotional codes, and accumulating bonuses. Based on this data, we created website prototypes.
Main Screen
We displayed the most popular offers on the main screen so users can see them immediately. A bright menu anchor helps in navigating the sections.
A pinned cart allows users to finalise their order from any point on the page and constantly shows the number of items selected.
Quick Filters
We added quick tags for pizzas, providing easier navigation through the assortment. For those with more refined tastes, we introduced an ingredient-based filter.
Product Card
Product cards allow users to add or remove ingredients to their liking. By clicking «Add ingredient», users can access the pizza constructor.
Pizza Constructor
Users can create a pizza from any ingredients and distribute them between halves. To simplify using the constructor, we categorised the ingredients.
Cart
During checkout, users can sign up in just two steps. When revisiting the website, the login process occurs automatically.
Splitting the Check
We introduced a unique feature that allows users to split the total cost between several people, making it easier for groups of friends to pay.
Order Status
Once the order is finalised and the checkout is completed, users can see the estimated delivery time and monitor any changes in the order status.
Pizza Halves
For those who cannot decide on a single pizza, there is an option to create a pizza with two different halves, such as half meat and half vegetarian.
Profile
All functions are placed on one page—users can view their user status, bonus account balance, and available gifts without leaving the page.
