Inspiration
Cultural Cookbook was inspired by the idea of reimagining how food can connect communities across distance, identity, and culture. We wanted to build something more meaningful than just a recipe app - something that tells stories, honors culture and heritage, and creates a sense of belonging. Our landing page displays flags from around the world, a visual representation of how many cultures coexist in one place. We imagined what it would look like to open a map, click your city, and immediately see the foods that define the people who live there.
What it does
Cultural Cookbook is a location-based app that showcases authentic, story-driven cultural recipes from major U.S. cities. Each city feed includes three dishes tied to specific countries or communities, with short personal anecdotes to highlight the emotional and historical roots behind each meal. It’s more than food. It’s culture, memory, and identity served on a digital plate. Users begin with a landing animation that transitions into a clickable city map. From there, they can explore recipes for cities like New York, San Francisco, Houston, and Miami. Each recipe is rooted in real tradition and styled for clean readability, with scrollable long-form content for ingredients and preparation steps.
How we built it
We used Figma to design every screen from scratch, starting with our visual identity and landing animation. We created frames for each major city and designed consistent layouts for each recipe card. The recipes were carefully selected and formatted using authentic sources, and we wrote original descriptions to reflect the stories and voices behind the food. We made use of interactive prototyping in Figma to simulate page transitions, map clicks, scrollable views, and animations.
Challenges we ran into
- Prototyping Logic in Figma: One major hurdle was figuring out how to prototype map pins and page transitions correctly within Figma’s interaction constraints.
- Content overload: Managing long recipe instructions while keeping the design clean and scrollable took careful formatting and layout planning.
- Cultural responsibility: We wanted to include authentic, real recipes without misrepresenting any culture, which meant extra research and editing to ensure respect and accuracy.
Accomplishments that we're proud of
- We created a polished, scrollable multi-page app in under 24 hours with no prior experience in Figma.
- Every screen was designed by us from scratch. Including the map interface, logo, layout, and animations.
- We hand-picked 8 cultural dishes from 8 different countries and represented them authentically in our app.
- We tied every detail into a cohesive vision of cross-cultural connection.
What we learned
We learned how powerful design can be in storytelling, especially when that story is personal, cultural, and global. We gained hands-on experience in Figma, including interactive prototypes, scroll groups, component consistency, and layout constraints.
What's next for Cultural Cookbook
We’d love to:
- Expand our city coverage and let users submit their own recipes with stories and family photos.
- Build the app in code using React Native or Swift, turning our Figma prototype into a functional mobile experience.
- Add filters by dietary needs or region, and allow users to explore the history of each dish.
- Create a community map, where users can pin their cultural dishes to more specific neighborhoods in real time as the app grows.
Built With
- figma
- photoshop
Log in or sign up for Devpost to join the conversation.