Food enthusiasts often struggle to find the right recipes that match their preferences, dietary restrictions, and available ingredients. Current recipe platforms are cluttered, difficult to navigate, and lack personalised recommendations, leading to a frustrating and time-consuming search experience. This not only discourages culinary exploration but also affects the daily meal planning of many users.

‍

Problem Background

Food enthusiasts frequently encounter difficulties when searching for recipes that align with their specific preferences, dietary needs, and available ingredients. While the internet is saturated with recipe platforms, many of these platforms suffer from cluttered interfaces and poor navigation, making it challenging for users to find what they’re looking for. The absence of personalised recommendations forces users to wade through countless irrelevant recipes, turning what should be an enjoyable experience into a frustrating and time-consuming task.

This problem goes beyond mere inconvenience. It impacts users' willingness to explore new dishes and experiment with different cuisines, ultimately hindering their culinary creativity and enjoyment. Moreover, the lack of an efficient recipe discovery process can make daily meal planning more stressful, particularly for those with strict dietary restrictions or busy schedules.

In an era where personalised and streamlined digital experiences are increasingly expected, the shortcomings of existing recipe platforms reveal a significant gap in the market. By addressing these pain points—offering intuitive navigation, advanced filtering options, and tailored recipe suggestions—we can vastly improve the user experience. This, in turn, will encourage more culinary exploration, simplify meal planning, and make cooking a more enjoyable and rewarding activity for food enthusiasts.

‍

Research Insights & User Pain Points

“Using family connections and LinkedIn groups, we have identified a few different categories of prospective users and did over 3 user interviews and received 20+ user survey inputs that have uncovered the following 2 major ones.
*An overwhelming amount of irrelevant recipe search results on the web. - around 40% of users
*The users struggle to find exactly what they need and where to find, leading to decision fatigue. - around 35% of users

‍

Solution Explanation

To effectively address our target users' pain points and achieve our product's goal of delivering an intuitive UX and better display of results, we developed a web application featuring advanced search filters to refine recipe results. The interface is clean and user-friendly, with added 'Save' and 'Share' options for improved functionality and convenience.

*Enhances the overall cooking experience with a clear, user-friendly interface.

‍

Lofi & Hifi Mockups

Final design link

Iterative Design Learnings

After we showcased our prototype to the users again, we learned that they loved the UI design and appreciated the ability to save recipes and create albums. Although there was some initial confusion about the purpose of 'My Cookbooks,' they found the advanced filter search and the flexibility in adding recipe instructions very useful.

They suggested adjusting the alignments for better clarity, which would make these features even easier to use. Based on this feedback, I iterated the design to address these issues. Overall, we achieved one of our goals by creating an interface that is both functional and user-friendly.

Implementation Details

Where is it hosted?

Backend: Render‍
Frontend: Vercel

What is your tech stack?

Backend: Django, MongoEngine (MongoDB), Python, GridFS for media storage, Spoonacular API
Frontend: React, JavaScript, SCSS for styling

‍

High level journey of a request

We chose this journey for our project because we believed that not only did this feel most comfortable as a route, it also gave us an opportunity to learn more. The application has two major CRUD functions with recipes and users. You can create an account, add recipes to it, update the profile and much more. With recipes, users can create recipes, edit them, retrieve from the database and even delete the user’s created recipes.

User sends a request to the Django backend.
Request is processed, either querying the database or calling the Spoonacular API.
Data is transformed and returned to the frontend.

‍

Technical challenges

What was the hardest part of development?

Our biggest struggle has been hosting our front and backends on their respective servers and connecting them.

Integrating GridFS for media, handling complex searches, API integration, and resolving CSS issues after deployment.

‍

Does your app have any scaling issues?

Having to halt production for specific pages until connecting the backend.

No significant scaling issues identified; future growth may require optimizing database queries and caching.

‍

What are some key takeaways?

That starting with our backend and front end integrated is better practice for the future.
Using the backend with multiple people has been harder than expected.
Importance of clear API documentation, efficient API integration, and proactive debugging during deployment.

‍

Future Steps

The next steps involve maintaining post-launch support to promptly address any immediate user concerns. We will continue user testing, prioritise feedback, and gather data to identify improvement areas, ensuring we meet our users' needs.
Also to continue developing the “Recipe Save” and “Recipe Share” features to be implemented.

‍

Learnings

Product Manager Learnings:

Sita Devi Penmetsa

My experience with Co.Lab was both enriching and hands-on, offering valuable insights as I pursue my goal of becoming a Product Manager. Discovering and driving the product vision. Importance of understanding and digging deeper into the problem space before we come up with any solution assumptions. Learned how to communicate with my team to prioritise the work and make smart tradeoffs. A great learning curve around the user research process.

Designer Learnings:

Puii Jaiwijitr

During my time as a product designer with Co.Lab, I had the opportunity to work on an end-to-end project within a collaborative, cross-functional team environment. I learned,

Collaboration and Communication: I actively participated in team meetings, where we discussed project goals, timelines, and challenges. I communicated design decisions and user insights to the team, ensuring that our designs aligned with both user needs and technical feasibility.
Design Process: I led the design effort by creating wireframes, and developing high-fidelity prototypes. I utilized tools like Figma and FigJam to create and iterate on designs based on team feedback and usability testing.
Challenges and Problem-Solving: I took the initiative to introduce design systems to maintain consistency across the product, which helps the development process and improved our overall efficiency.

Designer Learnings:

Jo Sturdivant

Adapting to an Established Team: Joining the team in week 6 of 8 was challenging, as I had to quickly adapt to existing workflows, dynamics, and goals. This mirrors real-world situations where you often integrate into teams mid-project, and flexibility is essential.
Work-Blocking for Efficiency: With only two weeks to complete the project, I learned the importance of a structured work-blocking system. This approach allowed me to manage my time effectively and meet deadlines under pressure.
Making Data-Driven Design Decisions: Unlike my past projects, I had to rely on research conducted by others. This was a valuable experience in using pre-existing data to guide design decisions, helping me focus on the core insights without starting from scratch.

Developer Learnings:

Caleb McMillan

My experience with Co.Lab has shown me all sides of my future as a developer. I understand that every team is going to have their great days and some not so productive ones. With that being said, we can use those bad days as inspiration to be better for the next. The biggest take away that I have from this experience is that even when you feel like the project is going nowhere and you’re struggling to get going. As long as you and your team believe in each other and can communicate together, you can prevail! I can say I feel much more comfortable taking on a role in a job in the near future.

Developer Learnings:

Vanady Beard

&

As the back-end developer, I learned how important it is to create efficient and reliable systems that support the entire application. This experience also taught me the importance of optimising the database and ensuring the backend is scalable and easy to maintain.

Developer Learnings:

Stephen Asiedu

&

As a back-end developer, I've come to understand the importance of being familiar with various database systems and modules. This knowledge enables me to build diverse applications and maintain versatility in my work. I've also learned that the responsibility for making the right choices rests on my shoulders, guided by my best judgement.

Developer Learnings:

Winter Krimmert

&

Mastered Django & MongoEngine integration for non-relational data models. Gained experience in API integration, caching, and advanced search/filtering. Learned to handle media files with GridFS and deploy effectively on Render. Enhanced collaboration with frontend engineers, focusing on clear API documentation. Improved troubleshooting and debugging skills, resolving deployment and CSS issues.

Developer Learnings:

Maurquise Williams

&

Process of Creating an MVP: Developing a Minimum Viable Product (MVP) taught me how to focus on delivering core functionalities balancing between essential features and avoiding scope creep.
Collaboration in a Real-World Tech Setting: This experience taught me how to collaborate efficiently in a fast-paced tech environment, keeping the team aligned and productive, even while working remotely across time zones.
Sharpening Critical Thinking and Problem-Solving Skills: This experience honed my ability to think critically and solve problems efficiently. By tackling challenges and finding quick solutions, I sharpened my decision-making and troubleshooting skills in a dynamic, real-world setting.

Developer Learnings:

Jeremiah Williams

&

All in all this experience was very awesome I learned that in coding with others being transparent is key

Developers Learnings:

Justin Farley

&

I learned how important communication is when working with a team. Communication provides understanding, advice, ideas, and much more. While working with the product team, I’ve found that communication keeps everything flowing smoothly. Working with a team also showed me that every member brings something different to the table and we all have to work together in order to align and meet our end goal.

Full Team Learning

Empathising with users
Aligning on goals
Cross-functional collaboration
Addressing issues and continuous improvement