Chat Mode vs Build Mode

Prompt To App offers two distinct modes for interacting with AI.

Chat Mode

Purpose: Discussion, questions, and guidance without code generation.

When to Use Chat Mode

• Ask questions about your project
• Discuss architecture decisions
• Get recommendations for libraries or patterns
• Understand how features work
• Plan before building

How It Works

• Uses Claude Haiku 3.5 (fast, economical)
• Receives full file content for context (15 files, 4000 chars each)
• Never injects skills (discussion only)
• Returns markdown text, no code generation
• Perfect for learning and planning

Example Chat Queries

"How should I structure my authentication system?"
"What's the best way to handle state in this app?"
"Explain how the payment flow works"
"Should I use Context API or Redux?"

Chat Mode Response

The AI will provide detailed explanations, recommendations, and guidance in natural language. It can see your code and discuss it, but won't modify anything.

Build Mode

Purpose: Generate and modify code in real-time.

When to Use Build Mode

• Create new features
• Modify existing code
• Fix bugs
• Refactor components
• Add integrations

How It Works

• Uses dual-model engine (Claude Sonnet 4.6 or GPT-5.3 Codex)
• Analyzes request complexity (0-100 score)
• Auto-injects skills for complex requests
• Receives file list + instruction to modify only what's needed
• Returns structured code with action tags

Example Build Queries

"Add a login form with email and password"
"Change the header background to blue"
"Integrate Stripe checkout"
"Fix the mobile navigation bug"

Build Mode Response

The AI will generate code with action tags:

<file path="src/components/LoginForm.tsx" action="create">
import React, { useState } from 'react';
...
</file>

<file path="src/App.tsx" action="edit">
import LoginForm from './components/LoginForm';
...
</file>

Switching Between Modes

You can switch modes at any time during a conversation:

1. In Chat Interface: Toggle the "Chat Mode" / "Build Mode" switch
2. Via Message: Start your message with "chat:" or "build:"

chat: How does authentication work in this app?
build: Add a logout button to the header

Best Practices

Start with Chat

For complex features, start in Chat mode to plan:

1. Chat: "I want to add user authentication. What's the best approach?"
2. Review AI recommendations
3. Build: "Implement authentication with Supabase Auth"

Use Chat for Debugging

When something isn't working:

1. Chat: "Why isn't the login form submitting?"
2. AI analyzes your code and explains the issue
3. Build: "Fix the form submission handler"

Build for Quick Changes

For simple modifications, go straight to Build mode:

build: Change the primary color to #3B82F6
build: Add a loading spinner to the submit button

Mode Comparison

Feature	Chat Mode	Build Mode
AI Model	Claude Haiku 3.5	Claude Sonnet 4.6 / GPT-5.3
Purpose	Discussion	Code generation
Skills	Never	Auto-injected (score ≥ 70)
File Context	Full content	File list only
Output	Markdown text	Structured code
Speed	Very fast	Depends on complexity
Cost	Low	Higher

Technical Details

Chat Mode Implementation

if (mode === 'chat') {
  // Use Claude Haiku 3.5
  model = "anthropic/claude-3.5-haiku";
  
  // Send full file content
  const filesContent = Object.entries(currentFiles)
    .map(([name, content]) => `### ${name}\n\`\`\`\n${content}\n\`\`\``)
    .join('\n\n');
  
  message = `[CURRENT PROJECT FILES]\n${filesContent}\n\n[USER QUESTION]\n${userMessage}`;
  
  // Never inject skills
  shouldGenerateSkill = false;
}

Build Mode Implementation

if (mode === 'build') {
  // Analyze complexity
  const { complexityScore } = detectRequestType(message, isFirstMessage, history);
  
  // Select model based on score
  if (complexityScore >= 70) {
    model = "anthropic/claude-sonnet-4.6";
  } else {
    model = "openai/gpt-5.3-codex";
  }
  
  // Send file list
  const filesList = Object.keys(currentFiles).join('\n- ');
  message = `[EXISTING FILES]\n${filesList}\n\n[REQUEST]\n${userMessage}`;
  
  // Auto-inject skills if score ≥ threshold
  if (complexityScore >= 70) {
    systemPrompt += await generateSkill(...);
  }
}

Tips

1. Use Chat to Learn: Ask "why" and "how" questions to understand your codebase
2. Use Build to Execute: Give clear, actionable instructions for code changes
3. Combine Both: Chat to plan, Build to implement
4. Stay in Context: Both modes have access to your project files
5. Switch Freely: No penalty for switching modes mid-conversation