Chat Interface
The chat interface is where you spend most of your time in Nativeline. It’s your command center for building, testing, and refining your iOS app.
Workspace Overview
When you open a project, you’ll see the main workspace:
┌─────────────────────────────────────────────────────────────────┐
│ Toolbar (project name, bits, ✈️ deploy, settings, account) │
├────────────────┬────────────────────────────────────────────────┤
│ │ │
│ Tabs │ Main Area │
│ │ │
│ - Build │ ┌──────────────────────────────────────┐ │
│ - Database │ │ Conversation History │ │
│ - Code │ │ │ │
│ - Settings │ │ Your messages → (right) │ │
│ │ │ ← AI responses (left) │ │
│ │ │ Code previews, tool cards │ │
│ │ │ │ │
│ │ └──────────────────────────────────────┘ │
│ │ │
│ │ ┌──────────────────────────────────────┐ │
│ │ │ Message Input │ │
│ │ └──────────────────────────────────────┘ │
└────────────────┴────────────────────────────────────────────────┘
Main Tabs
Build Tab
Your primary workspace. This is where you chat with the AI to build your app. The AI responds with explanations, creates files, and builds your app automatically.
Database Tab
View and manage your Supabase database tables (appears when Supabase is connected). See Supabase.
Code Tab
View and edit your app’s Swift code directly. This is a Pro feature — free users will see an upgrade prompt. See Code Editor.
Project Settings Tab
Configure your app’s identity, permissions, capabilities, and appearance. See Project Settings.
The plane icon (✈️) in the top-right toolbar lets you publish to TestFlight for beta testing. See Publishing.
The Conversation Area
Your Messages (Right Side)
When you send a message, it appears on the right:
- Your text
- Any attached images
- Timestamp
AI Responses (Left Side)
The AI’s responses include:
Text Explanations
The AI explains what it’s doing, answers questions, or asks for clarification.
Thinking Sections
For complex requests, you may see collapsible thinking sections that show the AI’s reasoning process. Click to expand/collapse.
Code Previews
When the AI writes or edits code, you’ll see a live streaming preview of the code being written. This shows:
- The file being edited
- The code changes in real-time
- Status (Writing, Wrote, Editing, Edited)
Tool Cards
Actions the AI takes appear as cards showing:
- File operations (creating, reading, editing files)
- Build commands
- Other tool executions
Build Status
Indicators showing:
- Building… (compiling)
- Success (app running in Simulator)
- Error (build failed — AI will attempt to fix)
Sending Messages
Type your message and:
- Enter — Send message
- Shift+Enter — New line
- Cmd+Enter — Quick send
Attaching Images
Drag and drop images into the chat:
- Up to 5 images per message
- Formats: PNG, JPG, JPEG, GIF, WebP, HEIC
See Using Images for best practices.
Message Best Practices
Be specific. Instead of “make it better,” try “increase the button height to 50pt and add a subtle shadow.”
One thing at a time. Ask for one feature or change per message for best results.
Reference what exists. Say “change the blue header” instead of “change the header” so the AI knows exactly what you mean.
Understanding AI Responses
When Things Work
You’ll see:
- Code previews showing files being created/edited in real-time
- Tool cards indicating what actions are being taken
- App automatically building and launching in the Simulator
- Success when the build completes
When Errors Occur
Build failures are handled automatically:
- AI detects the error
- Shows what went wrong
- Proposes a fix
- Applies fix and rebuilds
Don’t panic — errors are normal. See Debugging Guide for details.
When AI Needs Clarification
The AI may ask questions:
- “Did you mean the header at the top or the section title?”
- “What color for the button?”
- “Should this save locally or to the cloud?”
Answer naturally to continue.
The Simulator Preview
The iOS Simulator shows your app running live:
- Instant feedback — See changes as builds complete
- Real interaction — Tap, scroll, use your app
- Error visibility — Spot crashes and UI issues
Watch the build status:
- Building… — App compiling
- Success — App running
- Error — Build failed
Conversation Management
Scrolling History
Your conversation is saved. Scroll up to see:
- Previous requests
- What the AI built
- Earlier iterations
Slash Commands
Nativeline supports several slash commands for power users:
| Command | What it does |
|---|
/help | Shows all available commands |
/plan | Shows current plan status and progress |
/planclear | Clears the current plan (keeps your code) |
/debug | Toggles debug logging on/off |
/planclear is useful when the AI seems stuck or you want to start a new approach. It clears the internal plan but preserves all your code.
Starting Fresh Conversation
If the conversation gets too long:
- Clear conversation option in menu
- Confirm
- Your code is preserved — only chat history clears
Clearing conversation doesn’t delete your app. Only the chat history is cleared.
Keyboard Shortcuts
| Action | Shortcut |
|---|
| Send message | Enter |
| New line | Shift+Enter |
| Quick send | Cmd+Enter |
| Stop AI | Escape |
The Code Preview
When the AI writes code, you can watch in real-time. This helps you:
- Understand what’s being created
- Catch issues early
- Learn Swift by watching
Tips for Effective Building
Start Simple
Begin with core functionality. Add polish later.
Test Frequently
Check after each change. Catching issues early saves time.
Use Images
Visual references reduce iterations. See Using Images.
Give Feedback
If something isn’t right, tell the AI:
- “That’s not what I meant…”
- “Make it more…”
- “Change the color to…”
