Inspiration

Physics is everywhere — in a bouncing ball, a rocket launch, a passing ambulance — but most people walk past these moments without seeing the science. Traditional physics education starts with abstract formulas and works backward, which loses most learners before they ever feel the wonder. We asked: what if you could just point your camera at anything and instantly understand the physics behind it, explained at your level?

What it does

Equation to Reality (E2R) lets you upload any real-world photo (a roller coaster, a pendulum, an ambulance) and instantly receive: The physics principle identified by Gemini 2.5 Pro (e.g., Doppler Effect, Newton's Third Law) 5-level explanations — from a child-friendly analogy all the way to expert-level derivations — so anyone from a 5-year-old to a PhD student can understand Text-to-Speech playback with animated waveform visualization for each level The governing equation rendered in LaTeX, with a full variable breakdown (hidden at child level for age-appropriateness) A Knowledge Graph that connects every lesson you save — click any node to revisit your learning, and watch connections form between related physics concepts (e.g., Thrust ↔ Momentum ↔ Newton's Third Law)

How we built it

Frontend: Astro + React with a dark-mode-first design, using react-force-graph-2d for the knowledge graph visualization and KaTeX for formula rendering Backend: Firebase Functions v2 with Hono (lightweight web framework), handling image analysis and lesson persistence AI: Google Gemini 2.5 Pro via Vertex AI — a single structured prompt returns the principle name, 5-level explanations, TTS transcripts, LaTeX formula, variable definitions, and graph metadata tags Storage: Firestore for lesson data and graph connections, Firebase Storage for source images TTS: Browser Web Speech API wrapped in a swappable service abstraction (ready for Google Cloud TTS or ElevenLabs) Auth: Firebase Authentication with Google sign-in

Challenges we ran into

Gemini image generation limitations — our initial design used Gemini to generate custom icons for each lesson. The gemini-2.5-flash model doesn't support direct image output, so we pivoted to displaying the original uploaded source image instead, which turned out to be a better UX anyway Firebase Admin SDK v13 breaking changes — admin.firestore.FieldValue.serverTimestamp() silently returns undefined in v13+ because the namespace-style API was removed. Debugging this "Cannot read properties of undefined" error required tracing through compiled JS Emulator URL mismatches — Firebase Storage emulator serves files from localhost:9199, not storage.googleapis.com, so uploaded images appeared broken until we added environment-aware URL generation Port conflicts — the Firestore emulator's embedded Java process would silently hold ports after crashes, requiring manual process termination Accomplishments that we're proud of The 5-level system actually works — watching the same physics concept explained from "the rocket gives the Earth a giant fiery push!" (child) to tensor calculus notation (expert) in one click is genuinely delightful The Knowledge Graph grows organically — graph chaining automatically finds shared tags between lessons and creates weighted connections, so your personal physics understanding map builds itself Zero-cost TTS with future-proofing — the service abstraction means we ship today with free browser TTS but can upgrade to studio-quality voices without touching a single UI component End-to-end flow in one session — upload → AI analysis → 5-level explanations → TTS playback → save → knowledge graph node → click to review

What we learned

Gemini 2.5 Pro is remarkably good at structured JSON output when given a precise schema — our single prompt reliably returns valid data across all fields The "explain it 5 ways" pedagogical approach is more powerful than we expected; each level genuinely forces different framings of the same concept Firebase emulators are excellent for full-stack local dev, but their error messages can be cryptic — knowing the emulator-specific URL formats and SDK version quirks is essential Building for swappability early (TTS provider interface, domain color system) pays off even in a hackathon — it makes the code cleaner and the demo more impressive

What's next for Equation to Reality (E2R)

Google Cloud Text-to-Speech — swap in studio-quality WaveNet voices with per-level voice personas (warm and friendly for child, authoritative for expert) Real-time camera mode — point your phone camera and get live physics annotations overlaid on the viewfinder Collaborative graphs — share your knowledge graph with classmates and see how your physics understanding compares and complements each other Spaced repetition — E2R tracks which concepts you've learned and resurfaces them at optimal intervals, adapting the difficulty level to your progress Multi-subject expansion — the 5-level explanation engine generalizes beyond physics to chemistry, biology, and engineering Classroom mode — teachers upload one image, students explore at their own level, and the teacher dashboard shows comprehension distribution across learnersStep Id: 416

Built With

Share this project:

Updates