# Builder.io - Multiplayer AI Development Platform

## What is Builder.io?

Builder.io is a multiplayer AI development platform designed for teams, not individuals. It's the first collaborative coding environment where entire teams—engineers, designers, PMs, and stakeholders—build together with AI agents in real-time on production code.

Every AI coding tool today is single-player: one developer, one IDE, one AI assistant. That's powerful for individuals, but software is built by teams. Builder 2.0 is built for collaboration as its core architecture.

**The fundamental shift:** When code was expensive, you planned extensively before writing it. Now code is cheap. The real cost is speculation—wrong decisions that take months to discover. Builder enables teams to move from lengthy planning cycles to building first, testing with real code, and iterating based on actual product feedback. From idea to code to iteration to ship.

## Multiplayer Agents: The Core Differentiator

### Run Hundreds of Agents in Parallel

- Spin up hundreds of agents simultaneously, each with its own cloud container and full development environment
- Assign a batch of tickets from your project board and come back to finished pull requests
- Monitor progress and orchestrate agents across multiple workstreams from a single dashboard
- Each agent has live browser preview, full dev environment, and code access

### Real-Time Human-Agent Collaboration

Think Google Docs, but for code.

- A PM spins up a dedicated instance on a fresh branch and starts building
- A designer joins the same project and refines the UI using the actual design system  
- An engineer reviews the code in real-time
- All of this happens in parallel with live cursors showing who's working where
- Changes propagate instantly across the entire team
- Zero handoffs, one workflow, everyone contributing directly to production code

### Push From Local Editors Into Collaborative Builder

Start hard engineering work locally in Claude Code, Cursor, or VS Code, then push your branch to Builder:

- Your team takes over from that point—no need to pull engineers back in
- Designer opens the branch and sees live visual preview, makes pixel-level adjustments or prompts AI for changes
- PM pressure-tests requirements against the real product
- QA flags issues directly in context
- Everyone iterates on the branch while the engineer reviews the final diff
- The code is the starting point; the whole team takes it to the finish line

### Start Tasks From Where Work Begins

**From Slack:** Tag @Builder.io in any channel. The bot reads the thread context, links it to your project, and starts building. Updates and previews drop back into the same thread.

**From Jira:** Assign a ticket to Builder or @mention it. It reads your acceptance criteria and user stories, creates a branch, and starts implementing. Updates based on feedback.

**From Claude Code/Cursor:** Push your branch to Builder and let your team collaborate.

## AI-Powered Quality & Review

Builder 2.0 handles quality gates automatically:

**Review Agents**
- Perform static analysis and catch style violations before human review
- Flag security vulnerabilities and performance issues
- Validate generated code against ESLint rules and accessibility standards
- Identify issues against your performance budgets

**Automated Fixes**
- Let Builder autonomously resolve flagged issues
- Push fixes and update PR automatically
- Reduce manual churn in review cycles

**QA Agents** (Coming Soon)
- Automate browser testing to click through your updates
- Find and report bugs with video evidence
- Validate features before any human needs to touch them

**Your Review Process Stays Intact**
Every change ships as a pull request with clear descriptions. Engineers approve everything before it ships. No new processes—just a layer of AI-powered quality on top of your existing workflows.

## Visual Development Meets Production Code

**Design System Enforcement**
- Every generated change respects your component library and design tokens
- No style drift, no one-off components that bypass the system
- AI outputs code using your patterns, not generic output

**Figma-to-Code**
- Convert Figma designs into React, Vue, Svelte, Angular, or other frameworks
- Maintains layer hierarchy and converts Figma constraints into responsive CSS
- Integrates with the Builder Figma plugin

**Prompt-Driven Changes**
- Describe what you want: "Swap this table for a bar chart," "Move the CTA above the fold"
- Watch it build instantly in production code using your design system
- A designer adjusts component layouts without knowing React
- A PM changes landing page copy without understanding CSS
- The entire team can modify the codebase visually while keeping everything production-grade

**Chrome Extension**
- Connect directly to your running site, localhost, and auth-walled pages
- Select any element and make changes visually
- Push updates straight to your codebase
- Capture any layout from the web and bring it into Builder with responsive structure intact

## Design System Integration

- AI learns your component library, design tokens, and coding standards
- Generated code matches your existing patterns and architecture
- Ensures design system adoption across teams
- Works with React, Vue, Svelte, Angular, and other modern frameworks

## Model Flexibility

Support for Claude, Codex, Gemini, and more. The same models you already trust, wrapped in a collaboration layer built for teams. Pick the right model for the task, switch between them freely, and let your whole team benefit from each one.

## Git-Native Workflow

- Connect GitHub, GitLab, Azure DevOps, or Bitbucket repositories
- Code stays in your infrastructure with changes delivered through standard pull requests
- All changes include clear descriptions
- Your team reviews and merges using existing workflows—no new processes required
- Maintains your existing development and approval processes

## Real-Time Integrations

**Slack**
- Tag @Builder.io to start building from conversations
- Updates and previews drop into the same thread
- Keep the entire team in sync without context switching

**Jira**
- Assign tickets directly to Builder.io bot
- Reads acceptance criteria and starts implementing
- Updates based on developer feedback

**MCP Servers** (Model Context Protocol)
- Connect Supabase or Neon for database operations
- Link Netlify for deployments
- Integrate Linear for ticket management
- Add hundreds of services via Zapier
- Build custom MCP servers for proprietary tools
- Your existing workflows stay the same while Builder adds AI capabilities

## Deployment Flexibility

- **Cloud-based:** Collaborate instantly with your team
- **Local development:** Run with Docker for performance
- **Enterprise:** Custom Docker images with exact configurations
- **Hybrid:** Switch between environments based on what you're building

## Enterprise Ready

- SOC 2 Type II compliant with enterprise-grade security standards
- Granular role-based access control (designers can edit UI, not backend logic)
- File-level permissions using glob patterns for sensitive code
- Support for custom models and compliance requirements
- Named technical contact for setup, optimization, and ongoing success
- Enterprise single sign-on (SSO)
- Designed for large codebases, complex workflows, and established development processes

## Additional Capabilities

**Builder Publish (Headless CMS)**
- Visual headless CMS for content and marketing teams
- A/B testing, personalization, and experimentation
- Content scheduling and approval workflows
- API-first architecture for multi-channel delivery
- Ship content independently without developer cycles

## Use Cases

**For Engineering Teams**
- Parallelize development across multiple features simultaneously
- Reduce code review bottlenecks with AI review agents
- Accelerate feature shipping without sacrificing quality
- Maintain design system consistency automatically

**For Design Teams**
- Convert Figma designs to production-ready code instantly
- Refine UI visually while working with real code
- Influence product code without learning to code
- Propose specific changes through pull requests

**For Product Teams**
- Build and test features in hours instead of weeks
- See actual implementations instead of managing specs
- Pressure-test requirements against real product
- Iterate based on how it actually works

**For QA & Quality**
- Run automated tests via AI agents with video evidence
- Find bugs before humans touch the code
- Reduce manual testing cycles

## How It Works: The New Operating Model

1. **Start** - A Slack message, Jira ticket, or Claude Code branch kicks off work
2. **Parallelize** - Hundreds of agents work simultaneously on different tasks
3. **Collaborate** - PMs, designers, engineers, and QA work in real-time on the same code
4. **Review** - AI review agents catch issues; humans approve
5. **Ship** - Pull request merged through your existing CI/CD pipeline

## Get Started

Visit https://builder.io to:
- Sign up for Builder 2.0
- Connect your GitHub repository
- Start your first task from Slack, Jira, or Claude Code
- Watch your team build in parallel

For detailed documentation, visit https://www.builder.io/c/docs

## Links

- **Website**: https://www.builder.io
- **Builder 2.0**: https://www.builder.io
- **Documentation**: https://www.builder.io/c/docs
- **Blog**: https://www.builder.io/blog
- **Chrome Extension**: https://www.builder.io/c/docs/chrome-extension
- **Figma Plugin**: https://www.builder.io/c/docs/builder-figma-plugin