In my university course, CMPT 481: Human-Computer Interaction, we teamed up in groups of five to design an app or website of our choice for our course project. We had four weeks until the project deadline, along with weekly deliverables.
Since the project had a tight deadline, we designed certain user flows instead of a full app that showcases the main features and addresses the pain points of users.
The challenge we set out to take on was to make baking more accessible and enjoyable for a wide range of people, from beginners to experienced bakers. We wanted to break down the barriers that might discourage newcomers from trying their hand at baking and, at the same time, provide the right features to keep the experts engaged.
Our solution was to design a user-friendly baking app, which we named "Delish Bites." This app was created to provide a comprehensive baking experience for users of all levels. For beginners, the app offered step-by-step guidance and easy-to-follow recipes. For more experienced bakers, it provided advanced features, a diverse collection of recipes, and tools to expand their baking skills such as pantry management.
Investigate specific challenges that bakers face, with a focus on identifying potential obstacles that might deter them.
Our research approach was comprised of two primary methods:
Bakers often feel discouraged when looking at a recipe that they do not have all the ingredients for.
Show the users recipes they have all the ingredients for. Additionally, facilitate ordering missing ingredients.
Browsing recipes can be overwhelming especially when provided with multiple versions of the same recipe on the internet.
Recommend to users recipes they may like, while still having a variety of options.
Bakers may lose track of the many items they have in their pantry.
Enable the process of tracking the pantry more streamlined.
To foster a deeper understanding of our target users, we developed several user personas. These personas helped us empathize with the user’s needs and aspirations. However, we remained cautious not to over rely on these personas to avoid making unwarranted assumptions and over generalizations. Instead, we used them to guide us to take informed design decisions while staying open to the diverse experiences of our actual users.
We organized a 3-hour design sprint dedicated to sketching user-flows and testing them within the team. Our focus was on creating wireframes that visualized the user experience. We utilized the 10+10 method to sketch out rough ideas and heuristic evaluations to reveal potential design issues. Full Report.
After several rounds of tweaks and feedback, we settled on a design and put together a high-fidelity prototype using Figma, leveraging the Material Design System.
User onboarding is a seamless process, involving basic info collection, allergy awareness, and helpful pop-up guidance for new users.
Users often loose track of items in their pantry.
A pantry management system to add ingredients swiftly either by scanning barcode of an item or register it manually.
Users get discouraged and overwhelmed when introduced to many recipes, especially if they do not have all the ingredients for.
Recipes in your kitchen feature where the user is shown only recipes, they have all the ingredients for.
Users find it challenging to follow and understand complex recipes, especially when they lack experience in baking.
Develop an interactive step by step walkthrough of the recipe.
Bakers may lose interest if they do not have all the ingredients for a particular recipe.
Facilitate ordering the missing ingredients using an affiliate link.
Our aim for the evaluation was to pinpoint any possible design flaws or challenges that could have been overlooked. To make sure our design is intuitive, we decided it was appropriate to create an evaluation strategy that tests the following key features: User Sign-up/log-in, Adding ingredients to the pantry, Recipe Recommendations, Recipe Walkthrough.
We used a combination of observational analysis, think-aloud, and interviews to gather qualitative data that can be used as feedback for our design. We devised a list of tasks based on the goals of evaluation to test our scenario-based prototype. After the completion of tasks and during the interview, participants were given freedom to explore the app further to get as much insightful feedback as possible.
Participant test pool (3):
The evaluation findings highlight several key recommendations for enhancing the application's usability and overall user experience.
The team was overall satisfied with the design of the app, particularly the visual component, which was agreed upon by the participants in the evaluation process. Based on the evaluation, the team believes that the system would work well for the identified users and tasks, especially after reiterating based on the feedback they received. A detailed report can be found here, containing more information about testing, execution, interview transcripts, and full evaluation results.
As a team, this journey has been incredibly valuable for us, providing hands-on experience with the design process. We're happy with our current results, but we know that design is an ongoing process, and there's still room for improvement.