Subjects, Re-imagined for the Age of AI. For curious minds, ages 8–12.
SearchSaga turns subjects into connected adventures. Every topic unfolds as a 7-stage evolution story — and every story branches into surprising connections. Kids don't just learn; they discover how everything is secretly linked.
What if the camera is connected to glass, which is connected to sand, which is connected to microchips?
Free forever for kids. No subscriptions. No paywalls. No pro plans.
- The Vision
- Demo
- Tech Stack
- Roadmap
- Building in Open
- Contributors Welcome
- Explore Further
- Community & Feedback
- Development
- License
Subjects in school feel disconnected. Kids memorize facts but never see how everything links together. SearchSaga is built for the way curious minds actually think: one question leads to another, and the journey matters more than the destination.
Core mechanics:
- 7 Stages — Every topic follows the same evolutionary arc: The Itch → The Mutation → The DNA → The Birth → The Growth Spurt → The Territorial Fight → The Offspring
- Cousin Connections — Swipe left on any card to discover a related topic from a completely different field. Camera → Glass → Sand.
- Galaxy Map — Your exploration path lights up as a constellation. See where you've been and where you could go next.
Live prototype: 3 interconnected stories, 90+ cards, full swipe navigation.
pnpm install
pnpm dev
# Visit http://localhost:3000
The demo includes:
- 📷 How the Camera Grew Up — From dark rooms to your pocket
- 🔮 How Glass Grew Up — From lightning strikes to skyscrapers
- 🏖️ How Sand Became Glass — From beach grains to microchips
Navigate 3 levels deep through cousin connections. Track your journey on the galaxy mini-map.
| Layer | Tech |
|---|---|
| Monorepo | Turborepo + pnpm workspaces |
| Frontend | Next.js 15 (App Router, Turbopack) |
| CMS | Sanity.io (embedded at /studio) |
| Styling | Tailwind CSS v4, CSS-only animations |
| Types | TypeScript, shared across packages |
| AI Pipeline | Python — 7 content agents + 2 safety guardians |
| Voice | ElevenLabs TTS (planned) |
| PWA | Offline-first, per-topic caching (planned) |
searchsaga/
├── apps/web/ Next.js 15 frontend
│ ├── src/app/(content)/ Public pages (home, demo)
│ ├── src/components/demo/ Card system, navigation, galaxy map
│ └── src/data/ Story data (camera, glass, sand)
├── packages/
│ ├── sanity-studio/ Sanity config + schemas
│ ├── types/ Shared TypeScript types
│ └── ui/ Shared components (incremental)
├── services/content-pipeline/ Python AI pipeline (stubs)
└── docs/ PRD, specs, progress tracking
- Project scaffold — monorepo, CMS schemas, type system
- Card system — 7 card types with snap-scroll navigation
- Bold card design — immersive, screen-filling typography
- 3-depth prototype — Camera → Glass → Sand with full stories
- Stage navigator — 7-dot nav with expand-to-browse
- Galaxy mini-map — SVG exploration tracker
- Community feedback — share prototype, gather reactions
- Voice narration — ElevenLabs TTS per card, warm "older cousin" voice
- Whisper integration — Voice search for kids who'd rather talk than type
- Visual cards — Grok Imagine for infographics and illustrations per topic
- Video snippets — Short animated explainers for Surprise cards
- Researcher Agent — deep facts, surprises, cousin candidates
- Storyteller Agent — 7-stage narrative in kid voice
- Card Architect — stage → atomic cards with rhythm enforcement
- Visual Architect — infographic data + style-locked image prompts (Grok Imagine)
- Connector Agent — non-obvious cross-subject cousin links
- Editor Agent — quality + voice check, confidence scoring
- Publisher Agent — CMS-ready JSON output
- Word Shield guardian — language-level content safety
- Context Shield guardian — semantic/contextual safety review
- Image generation safety — prompt review → generation → vision moderation
- COPPA compliance — no personal data, aggregate analytics only
- Three-axis swipe engine — vertical depth, horizontal branching
- Card transitions — parallax, slide, thread animations (Framer Motion)
- Natural session ending — wind-down after 15–20 minutes
- Voice mode — auto-play narration toggle, ElevenLabs TTS
- PWA + offline — per-topic caching with depth limits
- Full interactive galaxy — D3 force graph, pan/zoom, mobile pinch
- Path replay — animated journey trace, shareable as video
- Social teasers — 15-sec Surprise Card animations for Shorts/Reels
- Educator toolkit — "follow 5 connections, write about your path"
- Parent feedback channel — flag any card for review
- Daily pipeline automation — scheduled generation, content buffer
- Multi-language — Hindi first, then regional languages
- Localized voices — ElevenLabs TTS per language
- Content calendar — seeded by most-referenced unconnected dots
SearchSaga is built entirely in the open — every commit, every decision, every pivot. We believe the best tools for kids should be shaped by the community that cares about them: parents, educators, developers, and the kids themselves.
This isn't a startup with a secret roadmap. It's an experiment in whether AI can make learning genuinely magical — and we want you to hold us accountable to that standard.
- Every feature is discussed in Issues before it's built
- Architecture decisions are documented in
docs/SPECS.md - Progress is tracked transparently in
docs/PROGRESS.md
We're looking for people who care about education, curiosity, and building things that matter for kids.
Areas where we need help:
| Area | What we need | Good for |
|---|---|---|
| Scalability brainstorming | How do we go from 3 stories to 3,000? Content pipelines, caching strategies, CDN architecture for global delivery. | Backend / infra engineers |
| Content writing | Draft new 7-stage stories on topics kids love — space, dinosaurs, cooking, music, sports, the ocean. | Writers, educators, subject enthusiasts |
| Accessibility | Screen reader testing, motor-impaired navigation, cognitive load review, WCAG compliance. | A11y specialists |
| Illustration & design | Card visual templates, topic cover art direction, animation design for transitions. | Designers, illustrators |
| Multi-language | Hindi first, then regional languages. Translation + cultural adaptation, not just word swaps. | Translators, localization experts |
| AI safety for kids | Content moderation pipelines, age-appropriate language filters, bias detection in generated content. | ML engineers, child safety researchers |
| Educator perspective | Classroom integration ideas, curriculum alignment, assignment templates ("follow 5 connections, write about your path"). | Teachers, homeschool parents |
How to contribute:
- Pick an Issue or open one with your idea
- Fork → branch → PR (keep PRs focused and small)
- Join the discussion — even feedback-only contributions matter
Every SearchSaga story is rooted in real knowledge. Here are curated links to go deeper on the topics in our prototype — filtered for quality and age-appropriateness.
| Topic | Wikipedia | Grokipedia / xAI | Other |
|---|---|---|---|
| Camera obscura | Camera obscura | Ask Grok: "How did the camera obscura work?" | — |
| Daguerreotype | Daguerreotype | Ask Grok: "What was the first photograph?" | — |
| Film photography | Photographic film | Ask Grok: "How does film capture light?" | — |
| Digital cameras | Digital camera | Ask Grok: "How do phone cameras work?" | — |
| Photography history | History of photography | Ask Grok: "Timeline of camera evolution" | — |
| Topic | Wikipedia | Grokipedia / xAI | Other |
|---|---|---|---|
| Glass | Glass | Ask Grok: "How is glass made from sand?" | — |
| Stained glass | Stained glass | Ask Grok: "How were stained glass windows made?" | — |
| Optical lens | Lens (optics) | Ask Grok: "How do lenses bend light?" | — |
| Fiber optics | Optical fiber | Ask Grok: "How does the internet travel through glass?" | — |
| Gorilla Glass | Gorilla Glass | Ask Grok: "What makes phone screens so strong?" | — |
| Topic | Wikipedia | Grokipedia / xAI | Other |
|---|---|---|---|
| Sand | Sand | Ask Grok: "What is sand actually made of?" | — |
| Silicon | Silicon | Ask Grok: "Why is silicon so important?" | — |
| Semiconductors | Semiconductor | Ask Grok: "How do microchips work?" | — |
| Silicon Valley | Silicon Valley | Ask Grok: "Why is it called Silicon Valley?" | — |
| Fulgurite | Fulgurite | Ask Grok: "What happens when lightning hits sand?" | — |
For parents & educators: These links are pre-filtered starting points. Wikipedia articles can be read in Simple English for younger readers. Grok queries are phrased at an 8–12 reading level.
We believe the best way to build for kids is to listen — to kids, parents, and educators.
How to share feedback:
- Try the demo and tell us what surprised you
- Open an issue for bugs, ideas, or content suggestions
- If you're an educator, we'd love to hear how this could work in classrooms
What we're looking for:
- Does the 7-stage arc feel natural? Do kids want to keep scrolling?
- Are cousin connections surprising enough? Do they spark "wait, really?"
- Is the reading level right for ages 8–12?
- What topics would your kids explore first?
# Install
pnpm install
# Dev (all packages)
pnpm dev
# Build
pnpm build
# Type check
pnpm type-check
SearchSaga — Subjects, Re-imagined for the Age of AI.
Built with curiosity. For curious minds.