💡 Inspiration: The "Show, Don't Tell" Problem In the B2B SaaS and agency world, cold outreach is fundamentally broken. Agencies spend hours doing manual website audits, generating 20-page PDF reports, and sending them via cold email. The result? A staggering 98% ignore rate. Clients don't want to read boring text; they want to see immediate ROI and visual solutions.
We realized that to close high-ticket clients, we needed to shift from a "telling" model to a "showing" model. What if, instead of a PDF, we could send a prospect a link where a live "Swarm" of AI agents audits their site in real-time, debates the flaws, and actually rewrites the code to fix it in the browser? That vision birthed AutoPitch AI.
🛠️ How we built it AutoPitch AI is built for speed and visual impact.
Frontend Ecosystem: We utilized React, Vite, and TypeScript to ensure a robust foundation. The UI/UX is heavily inspired by the minimalist, premium dark-mode aesthetics of modern platforms, styled meticulously with Tailwind CSS and animated using Framer Motion.
The AI Brain (Multi-Agent Swarm): The core engine is powered by Nvidia NIM APIs. We utilized Llama 3 models with highly optimized system prompts to act as three distinct personas: a UX Spy, a CRO Hacker, and an SEO Scout.
Generative UI: We integrated react-live to take the raw code output from the AI and render the "Fixed" UI dynamically directly on the client's screen.
The Development Workflow: The entire project was developed utilizing a modern "vibe coding" approach. By leveraging AI-powered IDEs and autonomous coding agents, we managed to rapidly prototype, iterate, and deploy complex architectures within the tight 48-hour deadline.
🚧 Challenges we ran into Building a live, real-time AI product in a hackathon setting brought some heavy technical hurdles:
The CORS & Deployment Boss Fight: While local development worked flawlessly, deploying to Vercel triggered massive CORS (404) errors when fetching the Nvidia API. We had to engineer a custom vercel.json edge rewrite to securely proxy the requests and handle Single Page Application (SPA) routing fallbacks.
LLM JSON Hallucinations: Large Language Models are notoriously bad at strictly adhering to JSON. Even with a low temperature, Llama 3 would occasionally inject markdown backticks (```json) or conversational filler. We had to build a robust, brutal regex-based cleanup and parsing function before feeding the data into the React state.
Generative UI Sandboxing: Safely rendering AI-generated React code in the browser without breaking the entire application state required careful sandboxing and state management.
🧠 What we learned Prompt Engineering is Software Engineering: Crafting the exact constraints for a Multi-Agent system to return structured, collaborative data is an art.
Edge Deployments: Mastered Vercel serverless configurations, proxy rewrites, and routing mechanisms to bypass browser security policies safely.
AI-Native Workflows: The speed at which an idea can go from a whiteboard to a live, production-ready Vercel link when paired with AI development tools is unprecedented.
🚀 What's next for AutoPitch AI This prototype proves the concept, but the future is much bigger. We plan to integrate headless browser scraping (Puppeteer) so the AI can analyze authenticated dashboards. We also aim to add automated email sequencing, turning this from a single audit tool into a complete, autonomous AI outbound sales agency.
Built With
- framer-motion
- javascript
- llama-3
- nvidia
- nvidia-nim
- react
- react-live
- tailwind-css
- typescript
- vercel
- vite
- vscode
Log in or sign up for Devpost to join the conversation.