Skip to content

Fix-It Flow

Fix-It Flow is a "Living User Manual." It addresses "Multi-Modelity" by creating a tight feedback loop between Gemini 3 Pro (Reasoning) and Nano Banana Pro (Rendering).

Code Video Cerebral Valley

Core trick

Passes the user's photo plus a Gemini-written structured prompt to an image model, which overlays repair arrows and labels on the same device.

Tags

repair/tradesvision

Description

Fix-It Flow is a "Living User Manual." It addresses "Multi-Modelity" by creating a tight feedback loop between Gemini 3 Pro (Reasoning) and Nano Banana Pro (Rendering). Users upload a photo of a broken object. Gemini 3 analyzes the fault and formulates a repair plan. It then acts as a prompt engineer, feeding a structured visual prompt—along with the user's original photo as inlineData—into Nano Banana Pro. The result is a generated 2K resolution diagram that preserves the user's exact device context but overlays precise, legible 3D arrows and text labels (e.g., "Unscrew Here") showing exactly what to do. It transforms static troubleshooting into a dynamic, visual guide, leveraging Nano Banana’s state-of-the-art text rendering to ensure instructions are readable and actionable.
essexcanning/Fix-It-Flow★ 00 forksTypeScriptCreated Dec 13, 2025 · last push Dec 25, 2025

README excerpt

# 🍌 Fix-It Flow: The Living User Manual

**Powered by Gemini 3 & Nano Banana Pro**

Fix-It Flow is a React-based web application that generates bespoke, photorealistic 2K visual user manuals for literally anything. Simply upload a photo of a broken object, state your goal, and watch as AI generates a step-by-step guide tailored specifically to your item.

![License](https://img.shields.io/badge/license-MIT-blue.svg)
![React](https://img.shields.io/badge/React-19-blue)
![Gemini](https://img.shields.io/badge/AI-Gemini%203-hotpink)

## ✨ Features

-   **Visual Analysis**: Instantly identifies objects from uploaded photos using `gemini-3-pro-preview`.
-   **Custom Step Generation**: Creates logical, scientifically-backed repair steps based on your specific goal.
-   **Photorealistic Visuals**: Uses **Nano Banana Pro** (`gemini-3-pro-image-preview`) to generate 2K resolution instructional images that maintain the visual identity of your specific object using reference-based generation.
-   **Refinement Loop**: Users can "Adjust View" to refine image prompts (e.g., "Zoom in on the screw") or regenerate steps.
-   **Search Grounding**: Includes a "Give up & Buy New" feature that uses Google Search Grounding to find real-time pricing and retailers for replacements.
-   **PDF Export**: Compiles the generated guide into a professional-looking PDF manual.
-   **Interactive AR Overlay**: "Why?" mode reveals the logic behind each step with bounding box overlays.
-   **Mascot**: A chatty,

Team