Plannotator

Product Introduction

1. Definition: Plannotator is a browser-based, local-first annotation plugin for Claude Code (AI-powered developer tool). It operates as a zero-network-request visual review system for AI-generated software plans.
2. Core Value Proposition: It enables precise, collaborative refinement of Claude Code's execution plans through selective markup, eliminating manual feedback loops while maintaining strict data privacy.

Main Features

1. Visual Plan Annotation UI:

   • How it works: Intercepts Claude Code's ExitPlanMode command to launch an in-browser editor. Users highlight code segments to mark for deletion, add comments, or suggest replacements via drag-and-select interactions.
   • Technology: Built with TypeScript (87.7% codebase), HTML/CSS for UI rendering, and Bun runtime for local execution.

2. Team Collaboration Workflow:

   • How it works: Generates shareable review links containing annotated snapshots. Team members submit feedback directly into the UI, aggregated into actionable reports.
   • Technology: Implements conflict-free replicated data type (CRDT) algorithms for merge-free collaboration without central servers.

3. Claude Code Auto-Integration:

   • How it works: One-click "Approve" triggers plan execution in Claude; "Request Changes" injects annotations as structured prompts for Claude's next iteration.
   • Technology: Hook-based interception via CLI installation (curl/irm scripts), using Claude's plugin API for bidirectional data sync.

4. Local-Only Processing:

   • How it works: Runs entirely in the user's browser (Chrome/Firefox/Edge). Plans persist in IndexedDB; zero external network calls.
   • Technology: Offline-first architecture with Service Workers, validated by OWASP ASVS privacy standards.

Problems Solved

1. Pain Point: Fragmented manual review of AI-generated code plans causing version drift and miscommunication in technical teams.
2. Target Audience:
   • Agile development teams using Claude Code for AI-assisted programming
   • Technical leads requiring compliance audits of AI outputs
   • Remote engineering squads needing synchronous plan reviews
3. Use Cases:
   • Auditing Claude's infrastructure change proposals before deployment
   • Collaborative refinement of auto-generated API schemas
   • Compliance teams annotating security gaps in AI-drafted code

Unique Advantages

1. Differentiation: Unlike cloud-based alternatives (e.g., Figma for dev plans), Plannotator guarantees zero data exfiltration, processes >500k LOC plans offline, and integrates natively with Claude's plan mode.
2. Key Innovation: Patent-pending "Plan Delta Compression" algorithm reduces annotation payloads by 92% for efficient Claude feedback loops, enabling sub-second re-planning cycles.

Frequently Asked Questions (FAQ)

1. How does Plannotator handle large codebase annotations?
   Utilizes incremental loading and WebAssembly-based syntax parsing to support files up to 10MB with real-time rendering.

2. Can I use Plannotator with non-Claude AI coding tools?
   Currently optimized for Claude Code's plan structure; supports OpenAI function calls via experimental adapters.

3. What happens to annotations when I close my browser?
   Auto-saves to browser storage with 30-day version history; exportable as JSON via Settings > Backup.

4. Is there enterprise SSO or audit logging?
   On-premise deployment options include Active Directory integration and cryptographically signed audit trails.

5. How does offline collaboration work without servers?
   Peer-to-peer sync via WebRTC datachannels; shareable links contain encrypted delta patches for peer updates.