My Garden — A Digital Garden That Grows With Your Day

A developer built My Garden, a digital garden that grows based on daily check-ins. The single static HTML file uses Google AI (Gemini) to select flowers matching the user's mood and ElevenLabs for voice narration, with weather data from Open-Meteo affecting the scene.

This is a submission for Weekend Challenge: Passion Edition 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. 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.