TerraView

Your yard can't tell you what it needs, but TerraView can. Just snap a photo to map sprinklers, spot hidden risk zones, and highlight ideal growth areas. Save time, stop guessing, and start growing.

Comment

Inspiration

Our parents have always loved gardening. Our backyard is their little project and they spend a lot of time out there trying to keep everything alive and looking good. But we always noticed something frustrating: the water bill would spike in the summer, the grass would still look patchy in some spots, and it felt like no matter how much effort they put in, something was always off. We never really knew if we were overwatering, using the wrong plants for our climate, or just set up inefficiently from the start.

That got us thinking: what if you could just take a photo of your yard and actually get answers? Not generic gardening tips from a blog, but specific feedback about your lawn, your climate, and your ZIP code. That's where TerraView came from.

What It Does

TerraView lets you upload a photo of your yard, enter your ZIP code, and get a full sustainability audit in seconds. The AI analyzes the image and breaks your yard into zones, drawing bounding boxes over each one and color-coding them by urgency. Red means there's a real problem (like water-intensive turf or runoff-prone pavement), yellow means moderate issues, and green means you're doing something right.

Each zone comes with a detailed breakdown: what the issue is, what you should swap it with, how much water you'd save, and the carbon impact. We also generate a scorecard with letter grades for water efficiency, biodiversity, heat island risk, carbon sequestration, and soil health.

On top of that, the app pulls in real nearby stores (nurseries and hardware stores) using Google Places so the recommendations are actually actionable, not just theoretical. There's also an AI chat assistant where you can ask follow-up questions like "what if I have a dog?" or "which fix should I do first on a $300 budget?"

How We Built It

We built TerraView as a TypeScript monorepo with three packages: a React frontend (Vite + Tailwind), a Hono API server for local development, and a shared package that holds all our types, OpenAI prompts, and Google Places logic.

The AI pipeline runs in multiple steps rather than one big call. First, a machine learning model analyzes the photo and returns structured JSON with 4-8 zones, each with bounding boxes (as normalized 0-1 coordinates), severity ratings, issues, recommendations, and action plans localized to the user's ZIP code. Then a second call generates seasonal projections, water benchmarks, and per-swap ROI breakdowns. Features like plant ID, contractor cost estimates, and the chat assistant are separate on-demand API calls so the initial audit stays fast.

The zone overlay is drawn on an HTML5 Canvas element on top of the uploaded photo, using the bounding box coordinates the model returns. Clicking any box opens a detail panel with the full action plan for that zone.

For auth and data storage, we used InsForge, which gave us Postgres, email/password login, Google OAuth, and row-level security without having to stand up our own backend. Audits get saved automatically for signed-in users. The whole thing deploys on Vercel, where the React app is a static SPA and the API routes run as serverless functions.

Challenges We Ran Into

Getting our machine learning model to return consistent, well-structured JSON was harder than expected. The bounding box coordinates had to be normalized, the zone count had to stay in a reasonable range, and the action plans had to be detailed enough to be useful but not so long they'd blow up the response. We spent a lot of time tuning the prompts in the shared package until the output was reliable enough to render without breaking the UI.

The other big challenge was making the store recommendations actually local. The AI will hallucinate store names confidently if you let it, so we built a Google Places enrichment step that geocodes the ZIP, searches for real nurseries and hardware stores nearby, calculates distances, and replaces the AI-generated store names with real ones before the results hit the frontend.

Canvas rendering was also trickier than we expected since we had to make sure the bounding boxes scaled correctly to whatever image dimensions the user uploaded, handle click detection on the overlays, and keep everything in sync with the detail panel state.

What We Learned

We learned a lot about structuring multi-step AI pipelines. Splitting the analysis into separate focused calls (vision, insights, chat, plant ID) made each one much more reliable and easier to debug than trying to do everything in one prompt. We also got a lot more comfortable with prompt engineering for structured outputs and learned how to validate AI responses against TypeScript schemas so the UI never crashes on unexpected data.

On the product side, we realized pretty quickly that the most important thing isn't just showing people problems, it's giving them a clear path to fix them. The ROI calculator, the real store links, and the step-by-step action plans are what turn TerraView from an interesting demo into something someone might actually use.

Built With

Share this project:

Updates