My Garden — A Digital Garden That Grows With Your Day

This is a submission for Weekend Challenge: Passion Edition

What I Built

My Garden is a digital garden that grows alongside your real life, not just your clicks. Every day, you check in with a line or two about how you're doing, and your garden plants a flower to match — chosen by AI, narrated by AI, and set in a scene that reflects the actual weather where you are.

Gardening is something I genuinely love, so instead of building a generic decorative garden toy, I wanted the growth to mean something: a small, low-effort daily ritual that turns into a visual record over time, the same way a real garden is a record of the days you showed up to tend it.

Demo

🌼 Live demo

Code

View the code

How I Built It

The whole thing is a single static HTML file — no backend, no build step — so it deploys anywhere as a plain static site.

The garden itself is hand-built with CSS keyframes and inline SVG. Each flower type (daisy, tulip, sunflower, lavender, poppy) is a small SVG generator function, and planting one triggers a staged grow-in animation: stem scales up, leaves fade in, then the flower head blooms — all through class-toggled CSS transitions rather than a JS animation loop.

Google AI (Gemini) is the heart of the daily check-in. When you write a short entry about your day, it's sent to gemini-3.5-flash with a prompt asking it to pick one of the five flower types that matches the entry's mood, and to write a one-line "gardener's note" reflecting on what you wrote — as if the garden itself is responding to your day. That note becomes the flower's hover label and gets logged in a running garden journal underneath.

ElevenLabs gives that note a voice. On connecting an API key, the app pulls the actual voices already in your ElevenLabs account (GET /v1/voices) and lets you assign a different one to each flower type. Beyond just voice identity, each flower type also has its own delivery tuning — stability and style values passed to the text-to-speech call — so a lavender note is read calmly and steadily, while a sunflower note comes out more animated and expressive, even if two flowers happen to share the same underlying voice.

Weather (via Open-Meteo, no key required) pulls real current conditions for your location and actually changes the scene: rain streaks and a dimmed sky on a rainy day, drifting snow in the cold, faster wind-sway on breezy days. It's a small touch, but it ties the garden to the real world outside your check-in text.

Both AI integrations have local fallbacks (simple keyword matching for the flower/mood pairing, and no audio) so the app never breaks for a visitor without their own API keys — though of course the fallback doesn't show off what Gemini or ElevenLabs are actually doing.

Prize Categories

• 
  Best Use of Google AI — Gemini reads each daily check-in and generates both the flower choice and the reflective note text


• 
  Best Use of ElevenLabs — the generated note is spoken aloud using a per-flower voice and delivery style pulled from the user's own ElevenLabs voice library