FixVision AI

AI-powered repair assistant that analyzes photos of broken devices and generates step-by-step repair guides with visual annotations. Your pocket technician, 24/7.

Comment

Inspiration

Every year, millions of devices end up in landfills simply because users don't know how to fix them. Professional repair services are expensive, and online tutorials are often confusing or irrelevant to the specific problem at hand.

We asked: What if AI could look at your broken device and tell you exactly how to fix it?

What it does

FixVision AI is an agentic AI-powered repair assistant that:

  1. Sees the Problem — Upload a photo of your broken device (phone, laptop, appliance).
  2. Analyzes with Vision AI — Our agentic system uses Gemini's multimodal capabilities to identify the issue.
  3. Searches for Solutions — Uses Google Search Grounding to find the latest repair guides, error codes, and troubleshooting steps.
  4. Generates Step-by-Step Guides — Receive clear, actionable repair instructions with cited sources.
  5. Annotates Visually — Get an annotated image highlighting exactly where to focus.
  6. Chat for Follow-ups — Ask follow-up questions using our AI chat powered by Gemini 2.5 Flash Lite with real-time web search.

It's like having a professional repair technician in your pocket — available 24/7, with access to the latest repair knowledge from the web.

How we built it

Layer Technology
Frontend Next.js 16 (App Router), React 19, Framer Motion
Styling Vanilla CSS with Glassmorphism 3.0 design system
AI Engine Google Gemini 3 Flash (Agentic Vision + Google Search Grounding)
Chat AI Gemini 2.5 Flash Lite with Google Search Grounding
Image Processing Sharp.js for server-side annotation
Deployment Google Cloud Run, Artifact Registry, Cloud Build
Runtime Bun (ultra-fast builds) + Node.js Alpine (production)

Agentic Architecture

Our AI doesn't just respond — it thinks, searches, acts, and observes in a loop:

  1. Think: Analyze the image and identify potential issues.
  2. Search: Query Google for the latest repair documentation and solutions.
  3. Act: Generate repair steps and bounding box coordinates with cited sources.
  4. Observe: Validate the output and refine if needed.

This agentic approach ensures high-quality, contextually accurate results every time.

Challenges we ran into

  • Bounding Box Precision: Getting Gemini to return pixel-accurate coordinates required careful prompt engineering.
  • Mobile-First Design: Fitting a rich experience into a "fit-to-viewport" constraint without scrolling was a UI engineering challenge.
  • Cold Start Optimization: We implemented a multi-stage Docker build with Bun to achieve sub-4-second dependency installs and tiny production images.

Accomplishments we're proud of

  • Sub-2-minute Full Repair Analysis — From upload to annotated step-by-step guide.
  • Premium UI/UX — Inspired by high-end Framer designs with glassmorphism, motion, and responsive layouts.
  • Production-Ready Deployment — Fully containerized and deployed on Google Cloud Run with CI/CD via Cloud Build.
  • Zero External Dependencies — All processing happens server-side; no client-side API keys exposed.

What we learned

  • Agentic AI Patterns: How to structure prompts for multi-step reasoning and tool use.
  • Multimodal Vision: Leveraging Gemini's vision capabilities for real-world object detection.
  • Cloud-Native Development: End-to-end deployment with Artifact Registry, Cloud Build, and Cloud Run.
  • Performance Engineering: Optimizing Docker builds with Bun and Next.js standalone mode.

What's next for FixVision AI

  • Video Analysis — Upload a video of the issue for even more context.
  • Parts Marketplace Integration — Automatically suggest replacement parts with purchase links.
  • AR Overlay — Use your phone camera to overlay repair instructions in real-time.
  • Community Repair Database — Crowdsourced repair tips and success stories.

Built With

Share this project:

Updates