Case study: the comfort, and stress-reducing power of La Ciotola
Finally! After many iterations, research, feedback, and a bit of procrastination, my first case study is ready! In partial fulfillment of the Google UX Design Professional Certificate, I chose a Sharpen challenge for my first portfolio project. I challenged myself to go with the first challenge that came up, and I did.
I tweaked the challenge a bit because I’m not in Italy; I decided to design a recipe organizer app for an Italian restaurant in Nigeria (fair enough, I guess).
TL;DR
I designed a recipe app for an Italian restaurant that helps increase kitchen productivity and helps BOH staff stay creative and updated with the restaurant’s recipe. It has two unique features; a time-synced audio assistant and recipe ingredients calculator.Here’s the prototype and the case study slide deck.
If you’re reading this, that means you’re interested in the process behind the design, get strapped and let’s goooooooooo.
Project Overview
The product: La Ciotola is a mobile recipe organizer for an Italian restaurant in Nigeria.
Project Duration: November 2021 to January 2022
Project Vision: La Ciotola (meaning the bowl in Italian) is a recipe app for an exclusive Italian restaurant that offers a wide multicultural variety of dishes. I decided to use a goal-directed design method to focus on persona creation and goals for this project. The MVP for this product is a mobile application to showcase our mobile design skillset as taught in the program. When I started this project, I hoped to deliver valuable features to the users that would help fuel their creativity in the kitchen daily.
Project Direction: Designing a recipe app for a restaurant is a tasking challenge. I started with secondary research (articles and videos) to understand what life is like in a restaurant’s kitchen and to have answers to some questions like:
- Who are the end-users?
- What is the product going to look like?
- What do our users need most?
- What problem is this product solving?
- How does this product help the business?
- Who are the product’s most significant competitors?
I watched some videos and read some articles before moving to primary research. I learned some of the answers to the questions highlighted above; it helped zero in on the project goals, and I proceeded to user research.
Project Goals: La Ciotola is a recipe app for an Italian restaurant launching in Nigeria that wants her kitchen staff to be up to date with dish preparation and deliver qualitatively through adequate time and resources management; the goals of the app are listed below:
- Ensure there are no barriers to entry on application startup.
- Make the user interface intuitive and easy to understand for familiar and unfamiliar users.
- Ensure seamless & linear learning experience for users.
- Maintain a seamless experience as the focus of a minimalistic user interface.
- Provide accessible features to cater to user needs.
My Role: UX designer designing a recipe organizer app for La Ciotola from conception to delivery.
Responsibilities: Conducting interviews, Ideating, user research paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.
Understanding the user
Among all the design frameworks taught in the Google Certification, I chose a Design thinking approach to my project. It revolves around a deep interest in understanding the user’s needs.
I started with foundational user research to understand more about the personas that are the target audience of the La Ciotola app.
User research (summary): I conducted my interviews virtually, and I sent out a survey(google forms); I created empathy maps to understand the users and their needs further. I left all my assumptions behind going into these interviews; a primary user group identified through research was people with experience working as a kitchen staff (Chefs/Cooks, actually).
One male and three female participants agreed to provide their time and feedback during the project. I interviewed them about their life, general behavior, and more to form an initial impression. I then interviewed them about their work experience to get a clearer picture of their pain points.
I learned a lot of things during the process. I learned there is no digital solution for onboarding new staff or keeping track of recipe changes from the interview. I learned BOH staff are a bit unreceptive towards a digital recipe organizer or use of devices in the kitchen at all. However, participants mentioned consulting recipe books/journals at least once.
User research (pain points): analyzing the interview feedbacks and mapping user problems, I was able to recognize user pain points which stems from the following:
Meet the User (Persona):
Israel is a prep cook and a University student who needs to recall and get the prep ingredients right at all times and have to calculate the proportion of serving per number of people.
Who are our Competitions? (Competitive Analysis)
After carefully studying several potential competing recipe apps, and although none compete directly with La Ciotola’s, they can still infringe on the app’s popularity. Comparing competitors, the majority of the features were similar; however, there are few gaps that could be filled.
For the complete competitive audit, click here.
Starting the design
An Information Architecture of what a basic start to finish journey looks like while trying to access recipe page. This helps in understanding ways users can interact with the product, as well as enabling to see navigation through user goals.
Paper Sketch: Taking the time to draft iterations of each screen of the app on paper ensured that the elements that made it to digital wireframes would be well-suited to address user pain points. For the home screen, I prioritized an layout that is easy to use and understand to aid a smooth navigation experience.
Low Fidelity Wireframes: As the initial design phase continued, I selected a user-friendly sketch and created a low fidelity wireframe of the home screen designs.
Low-fidelity Prototype
After designing the low fidelity wireframes and thinking through the preliminary flow, I reviewed what was necessary, unnecessary , and what areas needed improvement.
I spent a lot of time in this step to ensure I had the finishing touches on the underlying UX before moving on to the visuals. Using the completed set of digital wireframes, I created a low-fidelity prototype. The primary user flow I connected was using the audio assistant feature to use the prototype in the usability study.
PS: For the classification of feature importance, I asked myself questions like:
- Is it useful?
- Is it necessary?
- Does it help out significantly?
- Does it improve the level of work done in the kitchen?
After answering the questions comprehensively, I decided to leave behind features that I think aren’t important and move on with important ones.
View the Lo-Fi Prototype: Low fidelity prototype
Iteration
After creating the prototype from low fidelity wireframes, I asked six different participants (two people from the initial interview) to run through different scenarios in the prototype in hopes of garnering enough feedback to use for the next set of design iterations. I conducted two rounds of moderated usability studies. Findings from the first study helped guide the designs from wireframes to mockups.
For comprehensive report on the usability study, click here
Round 1 findings:
- The home screen was a little complicated to navigate.
- The audio assistant function wasn’t clear.
- No images/descriptions were available on the recipe screen.
The second study used a high-fidelity prototype and revealed what aspects of the mockups needed refining.
Round 2 findings:
- The audio assistant screen doesn’t have menu buttons for some specific functions.
- The ingredient ratio adjustment feature wasn’t clear.
- Ingredient lists screen doesn’t have an audio assistant feature.
- The direction screen in audio assistant mode should have text for a seamless experience.
Refining the design
Early designs had a lot of options and weren’t structured for easy access, but after the usability studies, I made a grouping to easily access the menu based on the type of the menu. I also removed the horizontal scrolling for easy access.
The second usability study revealed frustration with the audio assistant screen without the text to double-check what is read. I decided to add time-synced text that adjusts while the audio assistant reads the text. I also added function buttons to increase/decrease the audio speed and others.
Style Guide
I created a mood board for inspiration; for creating the mood board, I opted for a creative, warm, harmonious, and playful theme while maintaining an easy-to-read interface.
I created a design system to ease the iteration level in the app design; since it’s an Italian restaurant based in Nigeria, I decided to go with the color constant in both flags; green. The color represents growth and stability. It came from wanting to express the feeling of harmony in the kitchen to users.
High-fidelity prototype
The final high-fidelity prototype presented tidier and more straightforward user flows for accessing the recipe and using the audio assistant. It also meets user needs to customize ingredients to suit the meal per serving size ratio.
View La Ciotola app
Accessibility considerations
- Used universally understood icons and added labels to help make navigation easier.
- Provided access to visually impaired users by adding alt text to images for screen readers.
- Added a language switch feature to users whose first language isn’t English for easier use.
- Used colors that passed the accessibility test of WCAG 2.1 level AA.
Impact
The app makes users feel like their needs are being met, and they can cook in a stress-free environment and learn new recipes on the go.
One quote from peer feedback:
“The app looks like something I will want to use while I cook; it’s easy and straightforward.”
Takeaways
Even though this isn’t a live project, I had fun while designing the app, and I learned that the first ideas are only the beginning of the process. Usability studies and peer feedback influenced each iteration of the app’s designs.
That’s all!
If you’re still here, thank you for reading this far!
Your claps would go a long way if you like this, and I would appreciate any tips and suggestions on how I might have improved either this case study or my designs.
Special thanks to Jemima Olisa and Blessing Ojediran for their patience, guidance and support.
Feel free to connect with me on LinkedIn, Dribble, Twitter and you can check out my other articles.
