top of page

Stromboli's pizza app

Tools: Figma

Timeframe: 2 weeks

Client: Google UX design course

The Challenge:

The challenge I was assigned for the google course was to design an app for ordering pizza from a local takeout restaurant. This challenge really spoke to me because I recently moved into a new house across from a local takeout restaurant that doesn't even have a menu online, let alone online or app based ordering. This led me to be unsure of the restaurant's current menu and prices. After checking I saw that other popular pizza places, including both chain and local restaurants have apps or online ordering.

The Goal:

My goal for this project was to make an app based ordering experience for Stromboli's pizzeria that makes the ordering experience easier and more convenient than their current system.

User Research

Research:

I conducted several interviews with people from the West Michigan area of various ages to get a better idea of how an app could improve people's experiences of ordering takeout.

Finding 1: People were frustrated by not knowing prices

Several people I interviewed said that they looked at a Menu that Google had for Stromboli's and that the pricing was not accurate. Many voiced frustrations that they felt hesitant to order pizza from the establishment again for fear that what they ordered would cost more than they expected again. 

Finding 2: People wanted to try new menu items

A few people I talked to wished that they could look at a menu because they wanted to try some of the custom pizzas that Stromboli's offers, but weren't completely sure what they offered. This appeared to have made them order less profitable pizzas from the restaurant and were less excited for the orders that they got.

Finding 3: Many of the younger people were hesitant to order over the phone

Several of my subjects commented on being hesitant to order over the phone because it was less convenient to them or because talking on the phone made them anxious. Several of the younger people said that they liked that the bigger corporate competitors had timers that would tell them how much time was left before their order was ready. Others expressed that they didn't feel like talking over the phone with the restaurant and would much prefer to order through an app or online.

I decided to go with two personas because there seem to be two different groups of people who would prefer to use an app, there were people who do it strictly for the convenience and it being easy, as well as people who may avoid calling a restaurant over the phone because they're too nervous or it simply isn't worth the effort of making a phone call. I think that these two groups have very different reasons for wanting to use the app and both are valid.

wireframe.png

Wireframing

My plan with wireframing was to make my app as simple and easy to navigate as possible. An advantage Stromboli's has over a lot of its' competition is that they have a relatively simple and small menu that I don't think needs to be too extensive of a design.

build your own pizza wireframe.png

I also did a wireframe for a pizza building menu that people could either use to build their own custom pizza or modify one of the pizzas already on the menu, because who doesn't love adding bacon to their pizza? I added the general functionality that I saw examining the competitors' apps, and made it simple by using dropdown menus for categories of items instead of the long lists of things that people would have to scroll on the corporate competitors' apps.

Concept Testing Results

After I turned my wireframes into more of a functional prototype, I had some of the potential users test it. Through testing, there were two themes that I saw: the layout needed to be adjusted to be more friendly for people using a phone, and people needed a place to insert their payment information. The layout could stay somewhat similar to what it already was, because it seemed like the main reason people were having trouble navigating was that they were struggling to hit the buttons. Another thing pointed out to me was that I needed a way to enter payment for the restaurant.

strombolis mockup.png

Mockups

For my mockup, I added pictures and color to my design, because the restaurant I am designing for is a classic takeout restaurant, I made the colors for the website red, white and green like the Italian flag. I also made the buttons and interactions bigger to be more user friendly.

mockup.png

Final version

The final version of the app was very similar to the mockup, I just added some interactions and fleshed out some of the content. The user flow is consistent with most other pizza takeout apps, simple, to the point and easy for anybody to do. This is a final overview of the user flow.

modify.png
modify.png

Homepage

Modify Pizza

Toppings

dropdown.png

dropdown menu

added.png

Added to Cart

Your Order.png

Checkout

Payment details.png

Payment Details

Confirmation.png

Confirmation

Reflection

What I  Would have Changed

Looking at this project, there are a lot of things that I would go back and change. Being my first UX design project, I think that some of the design isn't quite what I was hoping for, I think the colors could be a little bright based on the client this app is for, so I would probably play around with the different colors. Another thing I would have done if this was an actual project is what the owner of the restaurant would see. I think that would be an interesting thing to see.

What I Liked

Although there is plenty I would redo, I am proud of this project. I think that it is a good looking app and I like the functionality of it. Through the process, I can see all of the things that I learned, and I could tell how much faster I got with the design process.

bottom of page