Pizza Time (Revisited)

⚠️ This project was done as a part of the Google UX Design Professional Certificate, where I was learning about the UX design process, "done right" from start to finish, including the empathize, define, ideate, prototype, and testing phases. The certificate was divided into multiple courses, and this blog post is a compilation of the work done on those courses. Here on this blog post, I *redid (in 2024) the last part of the process (mockups) due to the rushy job done on the originals. I don't really want to present the originals.

(*..pardon my George Lucasin')

1.) Project overview

The product

An app for ordering pizza from multiple restaurants, with the added functionality of providing a way for people living in rural areas to order pizza (by paying an extra fee).

Project Duration

The project was done with varying focus and resources in 2/2022–2/2023 while working as a full-time UX designer by day (at Aiwo).

The problem

At the time, there seemed not to be an easy-to-use mobile pizza app for residents living in rural areas.

The Goal

To design an app that doesn’t limit ordering pizza to city residents.

Roles / Responsibilities

My role was to be a generalist UX Designer, from concept to finished product. My responsibilities included: conducting interviews, research, sketching wireframes (paper, Figma), producing low- or high-fidelity prototypes, conducting usability studies, iterating, and finishing the product design.

2.) Understanding the user

The research

According to my initial research, where I personally interviewed a handful of people living in various places, there seems to exist a gap in the market where people living in rural areas cannot order pizza through the most popular delivery apps. Apps don't even provide a workaround to pay extra for this kind of delivery. This was the starting point for my product design project. Along the way, I also discovered other criticisms people have with current apps, such as unrealistic delivery estimates, slow processes, a non-humane customer experience, and confusing summary pages. Not every issue was dealt with in this design, but most of them were. 

Pain-points

I isolated the most common pain points from these discussions as follow:

🤷🏼 Inability

Users feel powerless to find a way to get pizza into rural areas; they are unable to pay an extra fee for it because it’s not even an option.

⏱️ Slowness

Users want to order the same pizza over and over again from the same place, fast and easily.

🚙 Delivery estimates

Users are annoyed by the overly optimistic delivery time estimates. They want real-life information.

☑️ Double-checks

Users don’t want to double-check their information every time they make an order.

Problem statement

From distilling the research, done user cards, and journeys, it all formed into a single problem statement, which would be the core of this design process.

3.) Starting the design

Making storyboards

First, I drew storyboards with crude stick figures for the typical use cases, one from the user’s perspective and one from the app’s perspective. The mistake I made here was that I wasn't quite sure if I was trying to map out the current situation or already envisioning the direction I would like to go. The end resulted in a messy mishmash of both.

Ideation Process

Then I took everything I had at that point and started ideating. I ran a simple session of "Crazy Eights," where I generated ideas quickly with low barriers. Note! At this point, I decided to drop out the voice functionalities. I took a marker and marked my favorite ideas, so I could use them later on.

Going digital

At this point, the vision started to form in my head. I collected my paper drafts and began laying out the elements on Figma so they could be re-arranged and tested more easily. In the designs, I made it possible for the restaurants to appear for rural area users just like for the rest, but with a disclaimer of extra fees. I also added an option to the front page to order the same pizza as before again, with no additional hustle.

Connecting the dots

To be able to test out the design with real users, a functional prototype needed to be made. I connected the lines in Figma, and fleshed out all the basic interactions. Then this lo-fi prototype was taken to the real users, with a user test plan in hand.

4.) Let's take it to the field

All this isn't that useful unless it's tested. We should test our designs, at least with our grandmothers. Here I made a testing plan where I fleshed out what I'm going to test, where I'm going to test it, what kind of people I'm going to ask to test it, and what I'm offering them as a perk.

I also took advantage of some key performance indicators (KPIs) so I could track the progress.

Two rounds of usability studies were done during this project. The first study helped me progress from low-fidelity wireframes to mockups, and the second study was done when I was testing out the high-fidelity prototype before doing the final design.

Note! In this project, some of the test subjects were my friends, resulting in confirmation bias!

Round One Synthesis

💬 "This sure feels like a prototype."

💬 "I think the summary page would be annoying to use if I were ordering a bunch of pizzas for a group"

1️⃣ Users had trouble navigating back and forth in the application due to a lack of back buttons

2️⃣ Users didn't find the purchase history

3️⃣ Users didn't understand the nature of the app—if it was made for single or multiple restaurants

Round Two Synthesis

💬 "That was fast!"

💬 "Too easy!"

1️⃣ Users didn't find the application visually pleasing

2️⃣ Users were wondering if the application supported group orders

3️⃣ Users wanted to see additional information about the order during the process

5.) Refining the design

Taking it to the finish line (Old design)

(Here's an image of the original finished design.)

I feel that I addressed the core issue of users not being able to get a pizza delivery (also) to rural areas. But, due to time constraints, the last phase in the design process ended up being quite lackluster (in 2022), and it has been haunting me since then. Thus I decided to continue from here on and do the visual side of things all over again.

Problems in the original design

• The color scheme felt repulsive (in a food app!)
• The background and stock images were awful!
• The lack of progress indicators confused users!
• The buttons weren't looking that much like buttons!
• The overall un-even visual style is all over the place!
• The good base (UX) work went to waste!

6.) Re-Refining the design


⚠️ I re-iterated the design in 2024!

Taking it to the finish line (Again!)

There wasn't much about the original finished mockups that I liked. Though the logo itself, in all its simplicity, hooked me with its 90s vibe. I decided to take that as a basis and keep iterating on the design. I didn't touch the UX side of things at all and only iterated the UI side of it, and here are the results:

Finished mockups!

That's all folks!

As always, there's still a lot of room for improvement, but for now, I'm happy with it, and I can leave this particular case from the history to rest.