An app development cost calculator starts with an honest count of unique screen states, then multiplies scoped design, engineering, QA and delivery days by region-specific blended rates. Count loading, empty, error, permission and success states separately when their UI or logic differs. For a defensible range, price design as its own phase, add a design-system setup allowance, include two revision cycles, and show low, likely and high cases rather than one global day rate. The result is an app budget estimate a client can audit and negotiate.
Key takeaways
- •Count each materially different loading, empty, error, permission and success state as a separate screen state.
- •Price two client revision cycles; a third cycle should trigger a written change request.
- •Use separate regional blended day rates instead of presenting one global app-development rate.
- •A planning model can allocate 15–25% of total cost to design and 45–60% to engineering.
- •Treat an 8–15 day design-system setup as a shared investment, then reduce repeated screen-design effort by 0.25 day per screen.
This guide is for mobile product designers, founders and engineers who can list features but need to turn that list into a scoped project estimate.
Time: 45 minutes · You'll need: A feature list or product requirements document, A spreadsheet with low, likely and high columns, Two to four current supplier rate cards or written day-rate quotes, Figma or floow.design for reviewing screen states
What's on this page
- •Count screen states before pricing features
- •Assign effort for the cost to design an app
- •Set regional blended rates for the app budget estimate
- •Price the design system before repeated screens
- •Add revisions, risk and a calendar range
- •Reference table
Build an app development cost calculator estimate
1. Count screen states before pricing features
Create one row for every unique user-visible state, not every item in the navigation. A sign-in flow might contain Sign in, Create account, Reset password, Password rules error, Email already used error, Loading, and Confirmation: that is 7 states, even if it appears as 3 menu destinations. Apply the same test to every feature: does the user see different content, controls, validation, or system behaviour? If yes, count it.
Add iOS and Android as separate engineering rows when platform behaviour differs. For example, Android runtime permissions use system permission dialogs, while iOS requests authorization through its own platform flow; the product still needs a pre-permission explanation screen if the team chooses one. Count empty, offline, loading, error, success and first-use states where they require designed content or implementation. Mark each row as simple, standard, or complex. A 30-state estimate is more defensible than a claim that the app has “10 screens,” because it exposes the work hidden behind happy-path mockups.
Tip: Do not count a modal, bottom sheet, or full-screen permission explanation as “free”; it has design, copy, QA and implementation work.
2. Assign effort for the cost to design an app
Estimate design separately before adding engineering. Use a planning allocation of 15–25% of total project cost for product design and 45–60% for engineering; reserve the remaining 20–30% for QA, product management, delivery, release work and contingency. These are allocation targets for a proposal model, not universal market facts. Replace them when your delivery team has measured historical data.
For a manual estimate, assign design days by state complexity. A workable starting assumption is 0.5 design day for a simple state, 1 day for a standard form or list state, and 2 days for a complex state with charts, maps, branching content, or several interaction modes. Add research, user flows and prototype work as named rows rather than hiding them in screen effort. Then list engineering, QA and delivery days separately for each feature group. This phase split lets a founder defer a feature, reduce scope, or commission the mobile app design cost phase first without pretending that design and build are the same service.
Tip: If design is below 15% because screens are being copied directly into code, check whether interaction states, accessibility review and developer handoff have simply been omitted.
3. Set regional blended rates for the app budget estimate
Create a blended day rate for each team location from actual supplier quotes. A blended rate includes the mix of design, iOS, Android, backend, QA and delivery roles; it is not the senior iOS developer’s day rate. For an initial scenario model, use explicit planning inputs rather than a supposedly universal global price: North America US$900–1,500/day, Western Europe US$650–1,100/day, Eastern Europe or Latin America US$350–700/day, and India or Southeast Asia US$250–550/day.
Label these figures as assumptions and replace them with at least 2 written quotes for the selected delivery region. Multiply low, likely and high effort by the matching low, likely and high rate. Do not combine a low regional rate with a high-seniority, high-availability expectation without checking the supplier’s actual team composition. Currency, overlap hours, language, regulated-data requirements and local tax treatment can move a proposal even when the feature list is identical. A single “global average” hides these decisions and creates false confidence.
Tip: Ask every supplier whether QA, project management, release support and warranty fixes are included in its blended rate before comparing totals.
4. Price the design system before repeated screens
Add a dedicated design-system line before estimating repeated product screens. For a small first release, use 8–15 design days to define foundations, semantic colour and type tokens, core components, variants, states, accessibility annotations, and a developer-facing component inventory. This is an estimate assumption, not a platform requirement. It should produce reusable controls such as buttons, text fields, navigation, alerts, sheets, list rows and loading states.
After that initial investment, reduce repeated standard-screen design effort by 0.25 day per screen only when the screen uses established components and needs no new interaction pattern. Do not apply the saving to an onboarding flow, complex transaction, map, data visualization, or novel editor merely because it uses the same type scale. Material Design 3 and Apple’s Human Interface Guidelines provide platform conventions, but neither replaces product-specific component decisions. Record the system’s setup days and the per-screen saving in separate spreadsheet cells. That makes the trade-off visible: a 12-screen prototype may not recover the setup cost, while a 40-state product often can.
Tip: If iOS and Android intentionally diverge in navigation or input behaviour, define shared tokens but price platform-specific component variants separately.
5. Add revisions, risk and a calendar range
Price 2 revision cycles after the initial visual direction and prototype review. Define one cycle as consolidated stakeholder feedback, a design update, an engineering impact check, and written acceptance. Add 10–20% of design and engineering effort for those two cycles, depending on how settled the requirements are. A third revision cycle, a new feature, or changed acceptance criteria belongs in a change request rather than the original fixed estimate.
Finish the spreadsheet with low, likely and high totals: days × blended day rate, plus any fixed software, testing-device, legal, or store-release costs. Calculate calendar duration from the critical path, not by dividing every person-day by one person. A 60-day engineering workload can take 6 weeks with parallel iOS, Android and backend work, or 12 weeks when one engineer owns all three. State dependencies beside the range, such as API readiness, content delivery, client approval within 3 business days, and access to Apple Developer and Google Play Console accounts. This turns an arithmetic estimate into a proposal that can survive a scope conversation.
Tip: Keep a change log from the first workshop; it is the evidence needed to distinguish a priced revision from a net-new requirement.
Reference table
Planning inputs for a mobile app estimate
| Estimate item | Planning input | How to apply it |
|---|---|---|
| Design share | 15–25% of total cost | Planning allocation |
| Engineering share | 45–60% of total cost | Planning allocation |
| Design-system setup | 8–15 design days | Before screens |
| Repeated screen saving | 0.25 design day | Existing components only |
| Included revisions | 2 cycles; 10–20% effort | Scope-dependent allowance |
| North America rate | US$900–1,500/day | Scenario input |
| Western Europe rate | US$650–1,100/day | Scenario input |
| Eastern Europe/Latin America | US$350–700/day | Scenario input |
| India/Southeast Asia | US$250–550/day | Scenario input |
Do it with the free App Development Cost Calculator
Estimate what a mobile app costs to build, with a phase split, a calendar range and a proposal you can send.
Open the App Development Cost Calculator → — free, no sign-up.
Common mistakes
Counting only navigation destinations.
Count each distinct UI state that changes content, controls, validation or implementation. Include loading, empty, error, permission and success states where applicable.
Quoting one total with no design phase.
Show design, engineering, QA, delivery and contingency as separate rows. A client can then fund design discovery without assuming the full build is approved.
Using one global day rate for every supplier.
Use the selected team’s blended rate and retain low, likely and high cases. Compare quotes only after confirming which roles and release activities each rate includes.
Calling unlimited feedback ‘collaboration’.
Include 2 named revision cycles and price a 10–20% allowance. Put additional cycles and changed requirements through a change-control rule.
Frequently asked questions
What is the quickest way to calculate an app budget estimate?
The quickest defensible app budget estimate is a screen-state count multiplied by role-based effort and a region-specific blended day rate. Add separate rows for design, engineering, QA, delivery, a design system and two revision cycles. Present low, likely and high cases instead of a single total, because scope uncertainty and supplier location affect both effort and rate.
How much does it cost to design an app before development starts?
The cost to design an app is commonly planned as 15–25% of the total project cost when it includes flows, visual UI, prototype, handoff and design-system work. Price it from the actual number and complexity of screen states, then add 8–15 design days if the product needs a reusable component system. The percentage is a planning allocation, not a substitute for scope.
How many screens should I use in a mobile app estimate?
Use one estimate row for every unique user-visible screen state, including loading, empty, error, permission and success states when they differ in UI or logic. A single “Profile” destination can therefore become several priced states: view profile, edit profile, validation error, saving and saved confirmation. This avoids underpricing the implementation and QA work behind a polished happy path.
Should iOS and Android be estimated as separate builds?
iOS and Android should be estimated as separate engineering workstreams whenever their codebases, platform behaviours or release work differ. Shared product flows and a shared design system can reduce duplicated design, but platform navigation, permissions, accessibility testing and store-release tasks still require platform-specific validation. State the assumed architecture—native, cross-platform, or shared code—beside the estimate.
Do I need a design system for a small mobile app?
A small mobile app needs a design system when repeated controls and states justify an 8–15 day setup investment. For a short prototype with fewer than roughly 12 states, a lightweight component library may be cheaper than a formal system. For a product with repeated forms, lists and status states, reducing repeated screen effort by 0.25 design day can repay the setup.
Where this leaves you
A credible estimate does not start with a fashionable price per app. It starts with visible screen states, named assumptions and a cost model that separates design from build. Use the rate bands only as scenario inputs until suppliers provide written quotes for the selected region and team shape. Keep two revision cycles, design-system setup and release work on their own lines; those are the items most often erased from an attractive first number. Your next action is to put the feature list into a low, likely and high spreadsheet, then compare that manual result with floow.design’s free App Development Cost Calculator at /free-tools/app-cost-calculator.
Design the screens first
Describe the screen you need in plain English and floow.design generates production-ready iOS and Android layouts you can iterate on by chat, then export to Figma or code. Design your mobile app screens in floow.design first, then build.
Related
- •Aspect Ratio Calculator — Work out the missing width or height for any ratio, with the common phone and store ratios one click away.
- •Device Size Reference — Screen dimensions, density and safe areas for current handsets — searchable, and exportable as code.
- •Safe Area Inset: Notches and Dynamic Island — Set safe area inset rules for iOS and Android full-bleed screens, including Dynamic Island
- •Aspect Ratio Calculator for Mobile App Screens — Use an aspect ratio calculator to size mobile heroes, cards and thumbnails, preserve safe
- •Design by AI: A Realistic Workflow for Mobile App Teams — Learn a realistic Design by AI workflow that helps mobile app teams move from clear briefs