Pizza.de is an online food ordering service that operates in the German market. With 1 million orders per month, it has a significant market share, and has a loyal and knowledgeable user base. Acquired by Delivery Hero in 2014, it was agreed that the pizza.de iOS apps would be redesigned last year.
The initial stage of the project planning discussed how best to deliver the new iOS apps - both for iPhone and iPad - by reducing as much as possible the developer workload by making both apps as similar as possible.
For this reason, it was necessary to design both the iPhone and iPad apps in parallel, reducing the amount of tasks for the developers and driving consistency across platforms.
The designers of each app would need to work together and closely collaborate to ensure that the functionality and flow were consistent across both devices.
One of the exciting aspects of this project is that I would have the opportunity to collaborate with other designers.
The UX of the iPhone app was being designed by UX Designer, and the UI Design would be finished by a User Interface Designer.
The iPhone designer had a few more months of working on this project before I joined the team. As such, she had already designed quite a large part of the flow.
Pairing with another UX Designer had the added benefit of promoting consistency across both devices, and ensured that the workload for the developer team would be kept to a minimum.
- Gathering Product Requirements and Understanding Business Expectations
- Sketching and Initial Wireframing
- Weekly Developer Meeting to ensure technical feasibility
- User Testing Sessions
- Refinement and Iteration
- Handover with UI Designer
One of the main challenges of this particular project was the fact that we were going to change the user behaviour from asking for the user's postcode at the beginning of the flow, to asking for their prefered type of food.
This change in flow became one of the primary focus areas of the user testing sessions.
- Customer selects the food type they would like
- Customer enters their location information
- Customer selects a restaurant, and taps it to view the menu information
- Customer adds items to their cart, and my modify some items by adding extra ingredients (such as choose a sauce for their fries, or select extra pizza toppings)
- When the customer is satisfied with their order, they may check out
- After checkout, the customer is presented with the estimated delivery time, along with customer help information
The first thing the customer sees when they load the app is a range of food types : pizza, pasta, burgers and sushi. This is an attractive introduction for users, who are immediately greeted with food photographs and now a location entry field. This would mean that when the customer opens a food ordering app, the first thing they see are pictures of food. This was deemed a more fitting for a food-order landing screen than if the customer was first asked to enter their address.
Not many customers in this market use Geolocation, and for that reason the Address Input was a huge focus for our user testing sessions. When a customer is returning, or has an active session, we would take their most recently used address and store it in their address history, easily accessible when they tap the address field.
At 3 separate intervals during the design process, we held user testing sessions. These sessions would last all day, and we would interview 3 different users. To prepare for these sessions, I created a click-through prototype with Marvel, and wrote a script for the UX Researcher to use for the test.
The wireframes outlining the functionality and flow for each stage of the user journey was then handed over to the UI Designer, who ensured that the app would be visually attractive and engaging.
Below is the checkout flow. The apps were rolled out gradually so as not to shock our existing customer base. This gradual roll-out took place over the course of the final quarter of 2016. It was so satisfying to see positive user feedback on the app store, and a steady increase in conversions for the business.