UX Designer
Bake shop owners and bakers working as a team in a bake shop or similar setting
2022
Concept piece created as part of Google's UX Design Certificate Program
Figma, Google Suite
I began working on this app as a project for the Google UX Design certification program. I used a random prompt generator to come up with an initial concept for the app. Based on the prompt, I set out to design an app that would serve as a digital recipe organizer for a bakery. Having no background in the baking industry, I did some research with the intention of discovering more about how bakers collected and used recipes for their bakeries. I quickly discovered that there was a need for an app that went beyond the initial concept of recipe organization. The results of this research were what guided my creation of The Bakers Helper app.
The Bakers Helper app is a quick-reference mobile application that bakers can use to curate and create recipes for use in their bakeries. It also serves as a collaborative app that allows members of a baking team to plan and customize menus together, see schedules and job tasks in advance, and streamline their workflow.
I started my research by holding user interviews to get qualitative data to help me identify how users may benefit from a recipe organizer app. I created a list of questions that aligned with my research goals and held semi-structured 1-1 interviews with four randomly assigned participants who met the characteristics of my target audience.
After the interviews, I transcribed the interviews and created empathy maps to help synthesize my findings and determine common themes in the data.
Participant Characteristics
Summary of Findings
I used the findings from the user research to formulate 11 user stories to represent potential use cases. These helped influence my development of two personas that best represented the user types for the app: Jerome and Eleanor.
Mapping the user journeys of my personas revealed several opportunities for features that I could include in the app to help relieve user pain points. Multiple user journeys revealed shared pain points that helped me to prioritize potential features for the app.
After determining the high-level functions that the app needed to serve, I started outlining the task and user flows for the app. This task flow takes the user through the process of adding a customized recipe to the app.
After identifying potential features for the app based on my user journeys, I performed a competitive analysis to see what similar applications exist with the features I prioritized. I observed their user flows and assessed their strengths and weaknesses to see how my app could distinguish itself and add value for users.
View the full report.
With a feature set and user flow in mind, I was ready to design the visuals for my app. I started by creating paper wireframes, then took my favorite elements from those to create the first of many low-fidelity digital wireframes.
Using my digital wireframes, I created a low-fidelity prototype and conducted my first of two rounds of usability testing. I asked for participant volunteers on social media and gathered five participants for this usability study. View the prototype here.
Participants
Test Objectives
This was a moderated study. Each participant was given a series of tasks to complete in the prototype and asked to reflect on their experience. The research goal of the study was to determine if users could easily customize and create recipes, create daily schedules or meal plans, and determine ingredient needs for chosen recipes.
Feedback
Participant feedback was largely positive, but testing revealed a few user pain points. Testing with actual bakers as some of my participants also highlighted a couple of gaps that are essential to a fluid workflow at a bakery.
I used affinity mapping to help uncover themes and develop insights from the study.
Study Findings
Visit the case study to see specific examples of how I addressed these findings.
Findings from the study helped guide my designs from wireframes to mockups. I used Figma to design high-fidelity mockups for the app. As I developed and iterated on my designs, I expanded my style guide into a design system that could be used by UX engineers as the project entered development. I created reusable components that took into account how I wanted the app to be branded and would be ready to easily hand off to a product engineer after design. I used a light color scheme with a few bold colors to add interest and emphasis to the designs. The light background provides a neutral backdrop for bold food images. I integrated playful iconography to reflect the bakery theme throughout the design, such as a donut inside a magnifying glass and a chef hat next to a stopwatch.
The final high-fidelity prototype presented cleaner user flows for creating, customizing, and scheduling a recipe. It also provided search options for users to find and save recipes from across the web. View the high-fidelity prototype here.
The second round of usability testing was set up as a moderated usability study like the first one. Participants found the user flow less complicated and overall comments were that the app was straightforward and easy to navigate.
The suggested changes were to make tasks clickable to eliminate users having to navigate to the recipe to view details and to add a button on the home screen to view tasks for all recipes on the schedule that day in addition to tasks for individual recipes. I was able to accommodate both of these changes after the study and believe they did enhance the user experience.
I designed this as a conceptual piece so that I could do a deep dive into user research and be fully immersed in the UX design process. I loved getting that connection with users and seeing how the design for the app changed and adapted throughout the process to reflect user needs. Were I to continue to develop this project, my next steps would be to iterate on the last round of feedback from my usability study. I would continue to iterate until I was satisfied with the user flow and and then package my files to send to a UX Engineer for development.