Case study: Designing French patisserie & cafe app
Bonjour! is a local French patisserie and cafe located in Vancouver, Canada. It specializes in cakes and meal options for breakfast and lunch (e.g. salads, sandwiches, quiches) and strives to deliver healthy, specialty dishes inspired by French cuisine. To increase the number of orders it needed a mobile app.
The task was to create an ordering and payment app for a French patisserie and cafe.
Bonjour! targets customers who live in nearby districts and do not have time for cooking and workers in close area offices who want to have a healthy and tasty lunch.
My role was UX and UI designer of an app from conception to delivery.
Process of work
Conducting secondary and primary research (user interviews) allowed me to distill major pain points: delivery takes too long; no reminder in the app (that the restaurant is about to close soon/order is ready for pick up/delivery is at the door, etc.) is frustrating for users; hard to switch between two or more addresses in the app; no information on nutrition value.
Based on the research data I created personas and problem statements.
Creating empathy maps, personas, user journey maps, and conducting competitive audit helped me envision potential users that I would design for, come up with ideas for designs that truly support the users’ needs and solve their problems and informed my ideation process on how to stand out from competitors on the market.
Testing early concepts
I started wireframing with sketches to iterate quickly on many design ideas.
I sketched out paper wireframes for each screen in the main user flow in my mobile app, turned them into digital wireframes and transitioned to low-fidelity prototypes.
It was critical to test my early design concepts, so I conducted a moderated remote usability study which brought a number of valuable insights.
View the study presentation
Mockups and high-fidelity prototype
I developed mockups and high-fidelity prototype with the implementation of the insights of the usability study to improve user experience in the further versions of the app’s prototype. To ensure that the visual part of the prototype works well for users I conducted the next round of usability study which revealed user frustrations about the checkout flow. I used the insights from the usability study to implement changes in the high-fidelity prototype.
All the colors in the app were checked for contrast ratio. I used icons in the bottom navigation bar to make navigation easier. All the animations and motions applied in the app meet the accessibility requirements according to W3C.