Inspiration
Our team comes from immigrant families from China, Mexico, Ghana, and Haiti, and we’ve grown up listening to powerful stories from our elders, stories of resilience, migration, joy, and struggle. But those stories rarely made it into classrooms. We noticed a gap: cultural knowledge often lives and dies in oral traditions, especially in marginalized communities, and it’s rarely preserved in ways that students can actually learn from.
We built Mosaic to bridge that gap. We wanted to create a platform where intergenerational stories could become educational resources, tools that not only preserve identity but also celebrate it in classrooms and communities.
What it does
Mosaic is a digital platform that transforms oral and textual stories from elders and people of all generations into curriculum-aligned educational tools. Users can:
- Upload an audio file, voice memo, or written story
- Input metadata about the speaker (age, region, language, background)
- Claude AI transcribes, translates, and summarizes the story
- Choose from outputs:
- Children’s Storybook
- Lesson Plan (objectives, vocab, discussion Qs)
- Design a custom tile for the story and place it on a global Mosaic Grid (Google Maps API)
- Students and teachers can explore tiles by region, theme, or subject area
How we built it
- Frontend: HTML, CSS, JavaScript
- Backend: React.js
- APIs used:
- Claude API (Anthropic): To transcribe, translate, and generate structured educational content
- Google Maps API: To visualize each story as a tile placed on a global map
- Wikipedia API: To pull contextual background for student curiosity
- Claude Mood Colorizer: Used for personalizing site themes based on user preferences (e.g. “What colors remind you of home?”)
Challenges we ran into
- Making sure Claude preserved cultural nuance while simplifying content for kids
- Designing a UI that’s intuitive for students, teachers, and elders alike
- Getting audio inputs clean enough for consistent transcription and translation
- Mapping stories with dynamic metadata to the interactive Google Maps grid
Accomplishments that we're proud of
- We created a full pipeline from story upload → lesson output → map visualization
- Successfully used Claude to generate grade-level educational materials in real time
- Designed a platform that’s emotionally resonant and technically functional
- Built a product that’s deeply rooted in our own backgrounds and passions
What we learned
- How to integrate generative AI into interactive, educational flows
- The power of storytelling as both pedagogy and preservation
- The importance of user-centered design, especially when your users span generations
- How to collaborate across front and backend while managing external APIs
What’s next for Mosaic
- Build a reflection journal feature for students to respond to stories with personal insights
- Expand support for more languages and regional dialects
- Add community curation tools so users can create playlists of stories around a theme
- Partner with schools and cultural orgs to pilot Mosaic in real classrooms
Built With
- claude-api
- google-maps
- javascript
- react
Log in or sign up for Devpost to join the conversation.