Project Overview
I built a personal recipe hub filled with recipes that are Polycystic Ovary Syndrome (PCOS)-friendly, high-protein, and high-fiber. The recipe hub centers around my preferred cuisines and dishes I grew up with to encourage me to actually use them, while also teaching me why these dishes support my health.
High-Level Impacts
-
A personally curated hub of 63 PCOS-friendly recipes across Japanese, Korean, Filipino, and other Asian cuisines.
-
Educational "Why it's great for PCOS" notes grounded in nutritional science on every recipe.
-
A live, fully responsive recipe hub accessible across any device.
Scope
Personal Project
Role
Product Designer, Developer
Duration
March 2026
Problem
After eating one afternoon, I felt an overwhelming wave of brain fog and grogginess. I succumbed to a nap, and when I woke up, I found myself scrolling through videos and recipes, trying to figure out what I should have eaten instead. That's when I realized my biggest friction point wasn't motivation. It was that there was no single place that combined the cuisines I actually cook with the nutritional guidance that's specific to PCOS.
Most dietary advice for PCOS is generic, Western-centric, and focused on restriction over understanding. I didn't want a list of foods to avoid. I wanted recipes I would actually make, in cuisines I either grew up with or preferred to eat, and explanations on why it was good for my body.
Process
Defining the Problem & Scope
I started by defining what I needed and the scope of what I wanted to build:
-
A web page housing PCOS-friendly, high-protein, and high-fiber recipes focused on Asian cuisines
-
Recipes organized by meal type, displayed in a card format
-
Each card showing a title, image, and ingredients — with the full recipe behind a "View More" toggle
-
A starting point of 7 days' worth of recipes (21 total)
Product Requirements as a Prompt
Rather than jumping straight to visual exploration, I drafted a detailed prompt to Claude: a card format with title, image, and ingredients; a "View More" drop down arrow that expands to steps and a PCOS education note; a filter bar by meal type; and design tokens reused from a previous personal project for visual consistency.
Design & Content Iterations
I iterated on the website design and content in parallel. While refining the card layout several rounds, I was simultaneously building out the recipe library and refining an appropriate image for each dish.
Deployment
After all iterations were complete, I published the site to jquindala.github.io/bloom-kitchen. I chose to host it because I wanted it to be a real, referenceable tool, not just a design exercise.
Design Decisions
Reusing an Older Visual Design System
I decided to bring over a visual system from a previous personal project I worked on. I thought it would not only fit the vibe for this hub but also would make the initial proof of concept significantly faster. I wouldn’t have to spend extra time curating a color palette or type system from scratch.
PCOS Education
In every recipe card, I wanted a note on exactly why this dish was helpful for PCOS. Different ingredients can have negative or positive effects regarding PCOS symptoms so I wanted it to be very specific. Not only would it list the macros, but also explain which ingredient does what and why it matters for my body.
Transparency
Because this was a recipe hub, I wanted to make it clear that I didn’t develop the recipes myself. I asked Claude to provide the original recipe links for each recipe that Claude referenced. This was a very meaningful feature for this product because it transformed a simple recipe hub into a fully educational resource. This choice combined with the PCOS education notes transformed a simple recipe hub into a fully educational resource.
Reducing Friction & Visual Clutter
There's already a lot of information on the page, so I made deliberate choices to keep it from feeling overwhelming. Meal categories let users navigate directly to what they want and flip between them without any load time. The "View More" toggle hides the recipe steps and PCOS education note until a user actively chooses to expand — protecting scannability and reducing the cognitive load of seeing 63 recipes worth of content all at once.
Device Accessibility
I wanted to be able to actually reference these recipes in real life, which meant the site needed to work on my phone. I made sure it was responsive across all screen sizes.
Reflection
Bloom Kitchen proved that a strong design vision and design communication accelerates working with AI. Because my initial prompt was specific and grounded in an existing visual system, I had a working proof of concept almost immediately. With that said, the most time-intensive part wasn't the layout or interactions — it was content curation. Sourcing accurate images required judgment and collaboration. Though AI accelerated the execution, it didn’t substitute for taste in design details.
What started as a passing thought turned into a fully functional tool that I built myself through vibe coding. Though I consider it finished, I would be open to iterating on it in the future as I encounter more use cases while I use the app — whether that's more recipes, broader PCOS wellness topics, or a deeper educational layer.
You can view the live site here: jquindala.github.io/bloom-kitchen.