Real-World Workflows: Putting It All Together

The Power of Composition

Each Antigravity feature is useful alone. Combined, they’re transformative. This lesson shows real workflows that combine Rules, Skills, MCP, Browser, and Artifacts.

Workflow 1: Building a Full Feature

Scenario: Add user authentication to an existing Next.js app with Supabase.

Step 1: Set Up Context (Rules + Skills)

Your GEMINI.md already defines:

- Use TypeScript strictly (no `any`)
- Use Supabase for backend
- Follow clean-code skill

Step 2: Plan (Agent PLANNING Mode)

You: "Add email/password authentication with login,
      register, and protected routes"

Agent:
1. Reads GEMINI.md → knows to use Supabase + TypeScript
2. Loads skills: clean-code, testing-patterns
3. Checks knowledge items → finds existing DB patterns
4. Creates implementation_plan.md
5. Waits for your approval

Step 3: Execute (MCP + Terminal)

Agent (approved):
1. Supabase MCP → Creates auth schema
2. Terminal → Installs @supabase/auth-helpers
3. Creates src/lib/auth.ts → Auth utilities
4. Creates src/app/(auth)/login/page.tsx
5. Creates src/middleware.ts → Route protection
6. Supabase MCP → Enables email auth provider
7. Terminal → pnpm build (verifies)

Step 4: Verify (Browser + Artifacts)

Agent:
1. Browser → Opens localhost, navigates to /login
2. Browser → Fills in test credentials
3. Browser → Verifies redirect to dashboard
4. Screenshots → Login page, dashboard
5. Creates walkthrough.md with proof

Total time: ~5 minutes. Without Antigravity: 2-4 hours.

Workflow 2: Debugging a Production Issue

Scenario: Users report the checkout page is broken.

The Debug Flow

You: "Checkout page returns 500 error in production"

Agent:
├── Knowledge Check
│   └── Finds "checkout_flow" knowledge item
│       → Knows the architecture instantly
│
├── Investigation (MCP + Browser)
│   ├── Supabase MCP → get_logs for API errors
│   ├── Browser → Reproduces the error
│   └── Terminal → Checks recent git changes
│
├── Root Cause Analysis
│   ├── Reads error logs → "column 'total' not found"
│   ├── Checks migration history → Missing migration
│   └── Identifies the fix
│
├── Fix (EXECUTION)
│   ├── Creates new migration
│   ├── Supabase MCP → apply_migration
│   └── Terminal → pnpm build
│
└── Verify
    ├── Browser → Tests checkout flow end-to-end
    ├── Screenshots → Successful checkout
    └── Walkthrough → Documents the issue and fix

Workflow 3: Code Review & Refactoring

Scenario: Refactor a messy component to follow project standards.

You: "Review and refactor src/components/Dashboard.tsx"

Agent:
├── Loads Skills
│   ├── clean-code → Code quality standards
│   ├── frontend-design → UI patterns
│   └── performance-profiling → Performance checks
│
├── Analysis
│   ├── Reads the file (847 lines, too large)
│   ├── Identifies issues:
│   │   ├── Mixed concerns (data + UI)
│   │   ├── Duplicate logic
│   │   ├── Missing error boundaries
│   │   └── N+1 data fetching
│   └── Creates plan with priority order
│
├── Refactor
│   ├── Splits into smaller components
│   ├── Extracts custom hooks
│   ├── Adds error boundaries
│   ├── Optimizes data fetching
│   └── Updates all imports
│
└── Verify
    ├── Terminal → All tests still pass
    ├── Terminal → Bundle size reduced 23%
    └── Walkthrough → Before/after comparison

Workflow 4: Automated Content Pipeline

Scenario: Create series content in multiple languages (like this series!).

/add-series-lesson workflow:

1. Ask for topic and language
2. Check existing lessons for structure consistency
3. Create content with proper frontmatter:
   - category, order, title, description
4. Create translations (en + vi)
5. Verify build succeeds
6. Update navigation if needed

This workflow produced the very series you’re reading.

Workflow 5: Full Deployment Pipeline

/deploy workflow:

1. Run linter → Fix any issues
2. Run tests → Must all pass
3. Run security scan → No critical issues
4. Build production → pnpm build
5. Deploy → ./deploy.sh
6. Browser → Verify production URL
7. Lighthouse audit → Check performance
8. Create deployment walkthrough

Pro Tips for Combining Features

1. Layer Your Context

GEMINI.md (what)
  → Skills (how)
    → Workflows (when)
      → Knowledge (memory)

2. Start Conversations with Context

"I'm working on the checkout module
(check knowledge items). I need to add
coupon codes."

3. Use Workflows for Repetitive Tasks

If you do something more than twice, create a workflow.

4. Let Knowledge Accumulate

After 10+ conversations, the agent knows your project deeply. Don’t fight this — lean into it.

5. Combine Agent Modes Deliberately

PLANNING → Get alignment on approach
EXECUTION → Let the agent work autonomously
VERIFICATION → Confirm before deployment

Summary

Antigravity isn’t just an AI assistant. It’s an AI teammate that:

• Follows YOUR rules (GEMINI.md)
• Has deep expertise (Skills)
• Connects to YOUR tools (MCP)
• Sees YOUR app (Browser)
• Documents everything (Artifacts)
• Remembers context (Knowledge)

The more you use it, the better it gets. Start with simple tasks, build up your rules and skills, and watch your productivity compound.

Happy building! 🚀