living-ai-garden

A reflective chat app where conversations with the Gardener grow into a personal 3D garden.

Comment

Living AI Garden 🌱

Inspiration

Many conversations with AI are useful, but they often feel temporary — you ask a question, get an answer, and the interaction disappears. I wanted to explore a more emotional and reflective relationship with AI: what if conversations could leave behind a visible memory?

The idea behind Living AI Garden came from treating conversations as seeds. Every interaction with the Gardener becomes something that grows over time — a flower representing the user's emotions, memories, and personal journey.

Instead of showing chat history as a list of messages, I wanted to create a space where users could visually see their experiences evolve into a living world.

What I Built

Living AI Garden is a reflective AI chat experience where conversations with the Gardener transform into a personal 3D garden.

Each conversation thread becomes a unique flower. The emotional tone of the conversation determines:

  • 🌸 Flower species
  • 🎨 Flower color and hue
  • ☁️ Weather and sky mood
  • 🌳 Garden growth and environment changes

The garden evolves as users continue interacting:

  • New conversations plant new flowers
  • Messages increase garden energy
  • Positive and playful moments help flowers grow
  • Memories remain even after conversations are removed through symbolic stone markers

The landing page also includes a developer showcase garden so visitors can experience the concept before signing in.

How I Built It

The project combines AI, 3D graphics, and modern web technologies.

Frontend & 3D Experience

I built the interactive garden using:

  • React 19 with TanStack Start
  • React Three Fiber and Three.js for the 3D environment
  • Drei helpers and post-processing effects for atmosphere
  • Tailwind CSS and Radix UI for the interface

The garden includes:

  • Procedurally generated flowers
  • Day/night cycles
  • Moon phases and stars
  • Weather effects like rainbows and rain
  • Interactive flower arrangement

AI System

The Gardener is powered by LLMs with a fallback architecture:

  • Gemini API(free tier)
  • Groq fallback
  • OpenAI gpt-4o-mini fallback

The system analyzes conversations and classifies emotions into a 27-emotion catalog. Each emotion maps to a specific visual representation in the garden.

For example:

$$ Emotion \rightarrow Flower \ Type + Color + Weather + Growth $$

A conversation is not only stored as text — it becomes a living visual memory.

Backend & Data

I used Supabase for:

  • Authentication
  • PostgreSQL database
  • Row Level Security
  • Persistent garden data

Each user's garden state, flowers, messages, and memories are stored securely.

The application is deployed using Cloudflare Workers with TanStack Start and Nitro.

Challenges I Faced

Creating an Emotional Mapping System

One of the hardest challenges was translating human emotions into visual elements.

Emotions are complex and ambiguous. A single message can contain multiple feelings, so I created a hybrid approach:

  • LLM-based emotion classification
  • Keyword fallback system
  • Controlled emotion-to-flower mapping

This allowed the garden to feel expressive while remaining predictable.

Building a Real-Time 3D World

Creating a lightweight 3D environment that works smoothly in the browser was challenging.

I had to optimize:

  • Procedural models
  • Rendering performance
  • Scene complexity
  • Mobile responsiveness

The goal was to make the garden feel alive without requiring a powerful device.

Designing Safe AI Interactions

Because the Gardener deals with personal emotions, safety was an important consideration.

I added pre-processing checks before sending messages to an LLM:

  • Crisis/self-harm detection
  • Explicit content boundaries
  • Safe fallback responses

The Gardener is designed as a supportive companion, not a replacement for professional help.

Working With Multiple AI Providers

LLM APIs can have rate limits and availability issues. I learned how to design resilient AI systems by implementing provider fallbacks:

Gemini → OpenAI → Groq

This helped maintain reliability even when one provider becomes unavailable.

What I Learned

Building Living AI Garden taught me how powerful the combination of AI and creative interfaces can be.

I learned:

  • How to integrate multiple LLM providers into a production-style application
  • How to combine AI outputs with procedural graphics
  • How to design emotional UX instead of purely functional interfaces
  • How important safety layers are when building AI experiences
  • How to optimize interactive 3D experiences for the web

Most importantly, I learned that AI applications do not always have to focus on productivity. They can also create moments of reflection, creativity, and connection.

Future Vision

Living AI Garden is an experiment in making AI interactions feel more personal and memorable.

Future possibilities include:

  • Long-term AI memories that shape the garden
  • More advanced emotional understanding
  • Collaborative gardens shared with friends
  • Personalized environments based on life milestones

The goal is to create an AI space that grows alongside the person using it — one conversation, one seed, and one flower at a time.

Built With

Share this project:

Updates

Submission history