🚀 Inspiration The main bottleneck for developers today isn't the lack of AI, but the cost and fragmentation of high-end models. While many LLMs offer powerful web interfaces for free, switching between tabs to compare outputs from Claude 3.5 Sonnet, GPT-4o, and Gemini is a productivity killer.
I wanted to build a "Command Center" that orchestrates these models directly in the browser, treating the web UI as a programmable interface. The goal was to achieve "Consensus-driven development" without spending a fortune on separate API subscriptions.
🛠How I Built It (The Spec-Driven Way) Following the hackathon's spec-driven development methodology, I didn't write a single line of code until my docs/ folder was ready.
Scope: I defined a strict boundary—no headless browsers (to avoid bot detection) and no middleman servers (for privacy).
Architecture: I designed a Content Script Orchestrator. Instead of complex backend logic, the app uses a hub-and-spoke model where the extension popup acts as the "Brain" and individual browser tabs act as "Workers."
The MCP Integration: To make it truly professional, I implemented a bridge to the Model Context Protocol (MCP). This allows the browser orchestrator to act as a tool for IDEs like VS Code, letting free web models write code directly into my local files.
🧠Challenges I Faced DOM Volatility: Web interfaces change their CSS classes frequently. I solved this by implementing a "Dynamic Selector Discovery" logic in my technical spec, rather than hardcoding IDs.
Context Synchronization: Keeping four different LLMs "in the loop" during a long conversation was tricky. I used a shared state managed by the extension's background service worker.
Vibe Coding vs. Spec Coding: Initially, I wanted to just "wing it" with the DOM injection, but the Claude Code plugin forced me to write a Requirement Doc. This saved me hours of debugging when I realized I forgot to handle the "Stop Generating" state for Gemini.
📈 What I Learned This project taught me that AI is a better builder when it has a map. By using the devpost-curriculum plugin, I learned how to move from "prompting for code" to "prompting for architecture." I discovered that writing a clear Technical Spec makes the actual coding phase almost instant because the AI knows exactly where every function fits.
Log in or sign up for Devpost to join the conversation.