Vibe Code Camp: Live Marathon With the World’s Best AI Builders
Vibe Code Camp Overview
Vibe Code Camp is an intensive deep-dive into the workflows, setups, and philosophies of the world’s top AI-assisted developers (vibe coders). The sessions cover everything from non-technical building and agent-native architecture to production-level iOS development and automated self-improving product loops.
Agent-Native Architecture and Principles
An “agent-native” application is one where the core of the software is an AI agent, rather than pre-built programmatic rules. Every feature is essentially a skill the agent can execute in a loop until completed.
Core Principles of Agent-Native Apps:
- PAR (Parity): Whatever the user can do through the graphical user interface (GUI), the agent must also be able to do.
- Granularity: The tools the agent has access to should be smaller than the features themselves. This allows the agent to combine tools in novel, unpredictable ways to accomplish tasks that weren’t explicitly hard-coded (e.g., using a general “delete” and “select all” tool to clear all comments from a document).
Collaborative AI Environments
Traditional AI outputs often feel detached from the workspace. In an agent-native markdown editor, the environment is built for human and AI collaboration:
- Attribution: Text color-codes based on who wrote it (e.g., human text is green, AI text is purple), making it easy to see the ratio of human-to-AI contribution.
- Live Agent Presence: External agents (like Claude or Codex) can connect to the document. The UI follows the agent’s cursor as it makes changes in real-time, functioning like a multiplayer document.
- Internal Agents: Internal agents can be triggered to run specific tasks, such as reviewing the document against a proprietary editorial style guide.
Non-Technical Vibe Coding
You do not need to know how to write syntax to build highly functional software. The key is developing an engineering mindset tailored to prompting and managing agents.
Strategies for Non-Technical Builders:
- Take Responsibility for Bugs: When an agent fails, it is usually a prompting or context issue. The job of the builder is to figure out how to guide the agent better.
- Use AI for QA: Utilize tools like Vercel’s Agent Browser to have the AI test the site as a first-class user. Have the agent log exactly what is happening, read the console logs, and fix the bugs itself.
- Create Infinite Fix Loops: Give the agent a markdown file with a plan and a progress tracker. Ask it to list all possible reasons for a bug, validate them one by one using tests, and loop until the issue is resolved.
- Export and Review Sessions: Export terminal sessions to a visual UI to read through the exact interactions between you and the agent. This helps recognize patterns (like how specific search tools or frameworks operate) and improves future prompting.
Relational Intelligence and Visualizing Data
AI can be used to manage personal goals, workflows, and visual data representation.
- Personal Operating Systems: You can build backend systems (like a Next.js cron job hooked to a Slackbot) to capture passing thoughts, track daily habits, and manage personal data.
- Visualizing Networks: LLMs traditionally struggle with generating network visualizations. However, with iterative prompting, you can build custom 2D (and eventually 3D) neural dendrite co-occurrence networks to visualize relationships and contacts.
- AI Video Generation for Education: Tools like Remotion can be hooked into Claude Code to generate animated commercial-style videos or educational explainers directly from codebase data. This requires passing the tool’s documentation to Claude and providing a reference image or specific style constraints (e.g., “muted colors”).
Compound Product: Automating App Improvement
“Compound Product” is a framework that allows an app to autonomously improve itself daily, acting as a virtual VP of Product and Engineering.
The Automated Loop:
- Data Extraction (Cron Job): A daily cron job pulls analytics from your database (e.g., Postgres user acquisition/retention data).
- Insight Generation: The data is sent to a high-level model (like Opus 4.5) to write a markdown report identifying the single biggest problem or opportunity in the app.
- Task Creation: A bash script analyzes the report and creates a
JSONfile outlining suggested fixes, priorities, and criteria. - PRD Generation: The agent creates a feature branch and uses a dedicated Product Requirements Document (PRD) skill to write atomic tasks with strict acceptance criteria (mandating things like Agent Browser testing).
- Execution: The agent loops through the tasks, writes the code, tests it, and commits it.
- Pull Request: By morning, the system opens a completed Pull Request for human review.
Note: Bash scripts are highly effective for this orchestration because they allow you to spawn multiple non-interactive agent instances from the command line without running into context limits.
Presentation Automation
Formatting slide decks is traditionally highly time-consuming. Using Claude Code, you can build customized plugins to generate production-ready presentations.
- The Workflow: Discuss the presentation’s goal in Claude Code to generate a blueprint. The agent creates a markdown plan with slide-by-slide descriptions and speaker notes.
- Visual Direction: Pass a comprehensive, proprietary UI/UX style guide (which can be hundreds of lines long) to the agent as a “skill.”
- On-the-Fly Asset Generation: Give the agent access to image generation APIs (like Nano Banana via Gemini). The agent will write prompts and generate required illustrations while building the slides, turning a multi-day design process into a 15-minute task.
Advanced Agent Orchestration and Claudebot
To scale vibe coding, developers are moving beyond simple terminal commands and utilizing dedicated UI wrappers and 24/7 dedicated hardware.
Conductor vs. Terminal
While the Command Line Interface (CLI) is powerful, GUI wrappers like Conductor offer significant quality-of-life improvements:
- Parallel Git Worktrees: Easily manage multiple isolated worktrees simultaneously without merge conflicts.
- Model Pairing: Use one model (e.g., Codex 5.2) to write the initial implementation, and immediately open a second tab in the same worktree to have another model (e.g., Opus 4.5) review the code before pushing.
- Visual State Management: Easily spin up localhost dev servers and open/review PRs with single clicks.
Claudebot (24/7 Autonomous Agent)
Claudebot is an always-on Claude Code instance running on a dedicated machine (like a Mac Mini), controlled remotely via messaging apps like Telegram or Slack.
- Voice Control: You can send voice notes to Claudebot while away from the computer to initiate complex coding tasks.
- Automated QA: Claudebot can be scheduled to run full testing suites overnight. It creates staging accounts, navigates the app, looks for bugs, and automatically spins up sub-agents to fix them.
- Error Monitoring Integration: Hook Claudebot into Sentry and Slack. When a bug triggers, Claudebot receives the error, spins up a Codex agent to fix the code, opens a PR, and tags the human for final review.
- Engineering Manager Role: Claudebot can read daily user conversation logs, write a report on UX frustrations, propose an architectural fix, and upon human approval, delegate the coding tasks to sub-agents.
Vibe Coding in Production Environments
Vibe coding is no longer just for weekends or hackathons. It is actively being used to ship complex features to hundreds of thousands of users. However, treating AI like an intern requires proper onboarding and infrastructure.
Production Setup Requirements:
- Specialized Agents: Do not use one model for everything. Use specific agents for specific tasks (e.g., an agent that strictly builds the app to find compilation errors, Opus for logic reviews, Sonnet for pattern reviews).
- Skills (Tribal Knowledge): Encode years of team decisions, specific Swift/React flavors, and dependency injection patterns into Markdown files. These act as strict guidelines the AI must read before coding.
- Hooks (Automated Guardrails): Use scripts that run before or after the AI uses a tool to block known bad patterns and enforce security.
- MCPs (Model Context Protocols): Give the AI access to external services (Linear, Sentry, Figma, GitHub). This allows the AI to read a bug ticket, check the Figma file, pull the stack trace, and submit a PR in a single conversation.
Designing Complex UI with AI
Contrary to the belief that AI lacks “taste” or physics intuition, models can build complex UI (like SpriteKit animations) with highly open-ended prompts.
- Provide the agent with raw image assets and a basic screenshot of the intended final state.
- Give a simple, natural language prompt (e.g., “Animate these coins flying into the counter”).
- The AI can successfully intuit physics, ease-in/ease-out acceleration, and rotational animations without requiring the developer to tweak manual variables.
Monorepos and Visual Planning (Flowy)
For full-stack AI development, Monorepos are essential. They allow the agent to understand data flow from the database to the backend and finally to the frontend, eliminating the need for the human to act as a translator between different codebases.
Enhancing AI Context with Visual JSON
Writing complex UI descriptions in markdown is tedious and prone to error.
- Visual Flow Tools: Build or use local, lightweight flowcharting tools where UI mockups are saved locally as
JSONfiles. - Prompting with JSON: Instead of writing text, point the AI to the visual layout’s
JSONfile. Advanced models can spatially reason where components should live based on the JSON coordinates, translating a rough UI sketch perfectly into React code.
The Evolution of “Slop” and the Race to the Top
The definition of AI “slop” is a moving target. Currently, it refers to code or design that is “in-distribution” for the model—the lazy, default behavior that requires no taste or refinement.
- The AI Engineering Lifecycle: AI capabilities jump massively every few months. Engineers must become comfortable deleting vast amounts of architecture and code written to “unhobble” older models, allowing the new, smarter models to handle those processes natively.
- The New Quality Bar: Because anyone can write software quickly, the baseline for quality is astronomically high. True value is no longer in writing the code, but in the taste, intention, and specific user experience design applied to the product.
Malleable Software and Kanban Agent Management
The future IDE will likely resemble a collaborative document rather than a traditional code editor. The goal is “malleable software,” where users have local agency to change the tools they use.
Managing AI via Kanban (Notion Integration)
Managing dozens of terminal tabs is inefficient for complex projects.
- Visual Orchestration: Use a Kanban board (like Notion) as a centralized command center.
- Task Linking: Pass the URL of a specific task card to the agent. The agent updates the card’s status to “Planning,” writes the implementation plan directly in the card, and moves it to “In Progress.”
- Human-in-the-Loop: If the AI hits a blocker (e.g., “Which color scheme should I use?”), it changes the card to red and leaves a comment. The human replies in the UI, and the AI resumes coding.
Preventing Laziness with Automated Quizzes
As AI writes more code, humans risk losing their mental model of the codebase.
- Educational PRs: Instruct the AI to generate a highly digested, “Presidential Daily Brief”-style summary of every PR, explaining exactly how the existing system worked and what was changed.
- Knowledge Checks: Have the AI generate a multiple-choice quiz at the end of the PR. The human developer must pass the quiz to prove they understand the logic before merging the code.
Compound Engineering Deep Dive
Compound Engineering is a philosophy that reintroduces traditional software development phases to AI vibe coding: Planning, Working, Reviewing, and Compounding.
- The Importance of Planning: Instructing an AI to “just build it” leads to poor results. Utilizing a distinct planning phase allows humans to catch architectural mistakes early and steer the ship before code is written.
- Compounding (The Secret Sauce): When an AI makes a mistake or a bad design choice, do not just fix it. Use a command (like
/compound) to force the AI to extract the lesson. - Automated Documentation: The AI writes a markdown file detailing the mistake and the correct pattern. During future planning phases, a fast, cheap model (like Haiku) acts as a librarian, searching these documents and auto-injecting relevant best practices into the context window. The AI never makes the same mistake twice.
- DHH Mode: Utilize contrasting personas for code review. Instruct the reviewing agent to act like an opinionated, strict open-source creator (like David Heinemeier Hansson) to forcefully challenge your AI’s architectural decisions.
Optimizing Workflows: Voice and Reverse Engineering
Voice-to-Text (The End of Typing)
To maximize context and speed, typing prompts is obsolete.
- Use smart dictation tools to speak directly to the IDE. Rambling for several minutes provides the AI with rich, nuanced context that would be too tedious to type.
- Use “Modes” to auto-apply custom instructions based on the active application (e.g., formatting transcripts differently for Cursor vs. Claude Code).
Reverse Engineering Billion-Dollar Apps
Instead of guessing how to architect a complex feature, use AI to study the best in the industry.
- The Method: Feed an LLM a local copy of a highly successful Mac application (e.g., Spotify, ChatGPT) along with a specific teardown methodology.
- The Output: The AI will parse the app’s files and generate an exhaustive technical document detailing exactly what frameworks, privacy permissions, and third-party packages the company used.
- The Application: Use this document as a blueprint. This saves days of R&D, ensures you are using production-tested architectures, and allows you to focus solely on user experience rather than reinventing the wheel.
Meta
Added: 2026-05-16