Who this guide is for
You have an app idea. You have never written code before — or maybe you tried once and got lost. You've heard that AI can help you build things, but you're not sure how.
This guide will show you exactly how to work with Claude to build a real mobile app — step by step, with no jargon and no assumptions about what you already know.
The right mindset before you start
Claude is not a vending machine. You don't just type your app idea once and get a finished product. Think of it as a very capable developer you're working alongside — it needs clear direction, context, and feedback.
You are the product manager
Claude writes the code. You decide what to build, what it should look like, and whether it's right.
It's always a conversation
Great apps aren't built in one prompt. You'll go back and forth dozens of times. That's normal.
Test constantly
After every change, run the app. Don't wait until you have 10 changes stacked up.
Show, don't just tell
Screenshots and error messages pasted in full are worth a thousand words.
Keep a decision log
Write down key decisions — colours, feature choices, how things should work.
One thing at a time
Ask for one feature or fix per message. Big requests get confused, harder-to-test responses.
Setting up your environment
Before you can run any code, you need a few tools installed. This is the most technical part of the whole guide — but you only do it once.
Which framework should you use?
| Framework | What it is | Best for | Harder because |
|---|---|---|---|
| Flutter RECOMMENDED | Google's toolkit. One codebase, iOS + Android. | Beautiful custom UI, one build for both platforms | Dart language — new to most, but Claude knows it perfectly |
| React Native | Facebook's toolkit. Uses JavaScript. | If you already know JavaScript | More setup complexity, more things can break |
This guide uses Flutter. Claude is exceptionally good at it — better than almost any other mobile framework.
Install Flutter
Go to flutter.dev/docs/get-started/install and follow the guide for your OS. This installs the Flutter SDK — the toolbox that turns code into apps.
Install VS Code
Download VS Code from code.visualstudio.com. This is where you'll paste the code Claude gives you. Then install the Flutter and Dart extensions.
Create your first project
Open a terminal and run flutter create my_app, then cd my_app, then flutter run. You should see a counter app. Everything is working.
Set up a device or emulator
Plug in your phone with USB debugging enabled, or use an emulator. For beginners, your real phone is simpler and gives a more realistic feel.
⚠️ Stuck on setup?
Setup is the most common place beginners get stuck. Paste the exact error message into Claude and say:
I'm trying to set up Flutter on [Mac/Windows/Linux] and I'm getting this error. I'm a complete beginner. Can you walk me through fixing it step by step? [paste the exact error here]
How to talk to Claude about your app
The quality of what Claude builds is almost entirely determined by how clearly you describe it. This section is the most important in the guide.
The anatomy of a great first prompt
A good first message has five things
- What the app does — one sentence, the core purpose
- Who it's for — the type of user and their goal
- The main screens — list them out, even roughly
- The visual feel — calm/energetic, minimal/rich, colours if you have them
- What framework — tell Claude you're using Flutter
"Make me a recipe app in Flutter."
"Build a Flutter recipe app called Pantry. It helps users discover and save recipes based on ingredients they already have. Main screens: Home, Search, Recipe detail, Saved. Clean light aesthetic, warm cream background, orange accent. Target user: home cooks aged 20–40."
"Make it have login, a profile page, notifications, offline mode, analytics, a shopping list, dark mode, and settings."
"Now add a sign-in screen with email and password. Keep the same design style. No registration yet, just sign in."
Describing UI with precision
Useful patterns
Layout — "A card with the icon on the left, title in the middle, and a chevron on the right."
Colour — "Warm cream background (#FAF8F4), orange accent (#E8621A), dark brown text (#1A0F00)."
Feel — "Minimal, lots of whitespace, no borders except subtle dividers, soft rounded corners (16px)."
Behaviour — "When the user taps the card, it fades to a new screen in 600ms. No slide animation."
Types of requests you'll make
🏗 Building something new
Add a recipe timer screen. It shows the step name at the top, a circular progress ring counting down from the cook time, and a cancel button at the bottom. Same warm cream theme. The ring should be orange.
🎨 Changing how something looks
The activity cards look too flat. Can you add a subtle border, make the card background slightly lighter than the page, and give the title text a bit more weight?
🔧 Fixing something broken
The app is crashing when I tap the second activity. Here's the error from the terminal: [paste full error]. The activity list screen is in lib/screens/activity_list_screen.dart.
💬 Asking for an explanation
Can you explain what the Provider package does in plain English? I don't need to understand the code — just what problem it solves and why we're using it.
The development workflow
There's a rhythm to working well with Claude on an app. Follow this loop and you'll move faster and make fewer mistakes.
Start with a brief
Before writing any code, spend 10 minutes writing down what your app does, who it's for, and what the core screens are. The clearer this is at the start, the less backtracking you'll do.
Ask Claude to plan first
For any major feature, ask Claude to outline its approach before writing code: "Before you write any code, tell me how you'd approach this." This catches misunderstandings early.
Get the code, paste it in
Claude will give you a file or a code change. Paste it exactly as given. If it's a new file, create it at the path Claude specifies.
Run the app and test it
Run flutter run or hot restart with r. Test the specific thing that just changed. Does it work? Does it look right? Does anything else break?
Give feedback or move on
If something's wrong, tell Claude specifically what's wrong — not just "it doesn't work". If it works, say so and move to the next thing.
Commit your progress
Once a chunk of work is tested, save a copy of your files. Git is the professional tool for this, but even copying the project folder to a backup location works.
Hot reload vs Hot restart vs Full restart
r — Hot reload. Keeps app state. Fastest. Good for UI changes.
R — Hot restart. Clears state. Good for logic changes.
Stop + flutter run — Full restart. Use when adding packages or when something seems stuck.
How to give context in long sessions
My app is a Flutter recipe app. We're using Provider for state management. The main ViewModel is in lib/ui/home/home_view_model.dart. I want to add [new feature]. Here's the relevant existing code: [paste the file or relevant section].
When things go wrong
Errors are not a sign of failure. Every developer spends a huge amount of time fixing things that broke. The skill is knowing how to fix them efficiently.
The golden rule of debugging
Never describe an error in your own words. Always paste the exact error text. Your summary will almost always miss the key detail Claude needs to diagnose the problem.
Where to find error messages
Terminal / console output
When you run flutter run, errors print here. Look for lines starting with Error: or Exception:. Copy the full section.
Red screen on the device
Flutter shows a red error screen with the exception text when something crashes at runtime. Screenshot it or type it out.
VS Code error underlines
Red squiggles in the editor mean a code error. Hover over the squiggle to read the message — these often appear before you even run the app.
How to report a bug to Claude
I'm getting this error when I tap the login button. Here's the full error from the terminal: [paste error]. The sign-in screen is in lib/screens/auth/sign_in_screen.dart — here's the relevant code: [paste the function that's failing].
Common error types
Null check operator used on a null value
You're trying to use something that doesn't have a value yet. Claude will fix this by adding a null check or initialising the value properly.
The getter 'X' was called on null
You're reading a property from something that's empty. Paste the error and the relevant code.
No named parameter 'X'
A function is being called with a parameter name it doesn't recognise. Usually happens when code gets out of sync after a change.
The method 'X' isn't defined for the class 'Y'
You're trying to call a function that doesn't exist on that object. Often happens when Claude added a function to one file but another file still uses an old version.
When Claude's fix introduces a new error
This happens. Paste the new error the same way. Say: "The previous fix introduced a new error."
If errors are multiplying, say: "Let's go back to basics. Explain what you changed and why, and let's approach this differently."
Patterns that work well
These are the habits that separate people who build apps successfully with Claude from those who get stuck.
🗺 Define your architecture early
In your first session, ask Claude to explain the structure it's using — where files go, how screens connect, how data flows.
Before we start building, can you explain what folder structure you'll use for this Flutter app and why? I'm a beginner — please explain it simply.
📄 Keep a shared brief document
Create a simple text document with your app's key decisions: colours, feature list, screen list, terminology. Paste the relevant parts at the start of any new conversation.
💬 Ask Claude to review its own work
After a big feature is built, ask: "Can you review what we just built for any issues — inconsistencies, edge cases, or things that might break?"
🏷 Use consistent naming
Decide on what to call things — "recipes" not "dishes" — and use the same words every time. Claude will match your vocabulary, which keeps code and UI consistent.
📸 Share screenshots for UI feedback
If the UI looks wrong, take a screenshot and upload it. Visual feedback is much more precise than words alone.
🧩 Build in layers, not all at once
Get a basic working version of each screen first — layout, navigation, placeholder content. Then layer in real data. Then polish. Don't build the perfect version before moving to the next screen.
I'm confused about the current state of the app. Can you summarise: (1) what files we've created or changed, (2) how they connect to each other, and (3) what the next logical step is? Explain it as if I'm new to this.
Your launch checklist
Before your app is ready for the world, make sure you've covered these fundamentals. Many can be handled with Claude's help.
🚨 Before your first real user
- App runs without crashing on a real device
- All screens are reachable and navigable
- Sign-up and sign-in flow works end-to-end
- Data saves and loads correctly after closing and reopening
- The app works without internet (or fails gracefully)
- No placeholder text or "TODO" labels visible to users
- App icon is set (not the default Flutter icon)
💳 Before accepting payments
- Privacy Policy screen exists and is accurate
- Terms of Service screen exists
- In-app purchase is tested in sandbox mode
- Server-side receipt validation is in place
- User data is secured (database security rules configured)
- Crash reporting is integrated (Firebase Crashlytics or Sentry)
🚀 Before submitting to the App Store / Play Store
- App screenshots created (at least 3 per platform)
- App description written
- App tested on multiple device sizes
- Build version number set correctly
- All third-party assets are properly licensed
- App complies with the store's content policies
One final piece of advice
Ship something small and real rather than spending months perfecting something big that never launches. Your first version doesn't need to be your best version — it just needs to work and be genuinely useful for at least one person.
The feedback you get from real users will teach you more in a week than you could learn in months of building alone. Start small, learn fast, iterate.
Prompts to bookmark
"I want to build a Flutter app called [name]. It does [one sentence]. The users are [who]. Main screens: [list]. Visual style: [describe]. Please start with a project structure and the home screen only."
"The app is crashing when I [action]. Here's the full error: [paste]. Here's the relevant file: [paste]. I'm a beginner — please explain what caused it and what the fix does."
"Here's a screenshot of the current [screen name]. [Describe what looks wrong or upload image]. Please fix [specific issue] — keep the same design language and don't change anything else."
"Can you explain [concept] in plain English? I have no coding background. I don't need to understand the code — just the concept and why it matters for my app."
"I'm continuing work on my Flutter app. Here's the brief: [paste your brief]. The last thing we built was [feature]. The current state of [relevant file] is: [paste]. Today I want to add [next feature]."