Best Prompts for Mobile App UI Generation
Proven prompt templates for every type of mobile app screen — ready to copy, customise, and use in Dezyn right now.
Why Prompt Quality Determines Design Quality
AI design tools are only as good as the input they receive. A vague prompt like "design a fitness app" produces a generic, forgettable output. A specific prompt that describes the user, the screen purpose, the key UI elements, and the visual style produces output that could pass as the work of a senior product designer. This guide gives you copy-paste templates for the most common screen types, with notes on which variables to customise for your specific project.
Prompt Template: Onboarding & Welcome Screens
Use this template: "Design the [screen number] of a [number]-screen onboarding flow for [app name], a [app description] targeting [user type]. This screen should [screen purpose]. Key UI elements: [list 3–5 specific elements]. Visual style: [style description — e.g., clean, minimal, dark theme with [color] accents]. Tone: [e.g., encouraging, professional, playful]. The app's primary color is [hex code] and the font family is [font name]. This is screen [N] and should flow naturally from the previous screen which showed [previous screen description]." Example for a fitness app: "Design screen 3 of a 5-screen onboarding for FitFlow, a run-tracking app targeting recreational runners. This screen asks the user to set their weekly mileage goal. Key elements: three goal options as selectable cards (10km, 25km, 50km), a motivational subheading, and a Next button. Dark background, teal (#00C896) primary color, Inter font, encouraging tone."
Prompt Template: Dashboard & Home Screens
Dashboard prompts work best when you specify exactly what data is visible and in what priority order: "Design the home dashboard screen for [app name]. The most important information — [top priority data] — should be immediately visible above the fold. Below that, show [secondary data]. Key UI elements: [specific components — e.g., balance hero card, line chart, transaction list]. Include bottom tab navigation with [N] tabs: [tab names]. Style: [dark/light], [primary color], [font]. The user's current data state is [describe example data — e.g., $12,450 portfolio value, up 2.3% today, 5 assets held]." Adding example data forces the AI to generate a realistic-looking screen rather than an empty wireframe.
Prompt Template: Social & Feed Screens
Social feed screens require specifying content card structure clearly: "Design the home feed screen for [app name], a [social app type]. The feed shows [content type] cards. Each card should contain: [list card elements — e.g., user avatar, username, timestamp, content text/image, reaction strip, comment count, share button]. The feed is infinite scroll. Include: a sticky top bar with app logo and notification icon, a floating compose button in the bottom right, and bottom tab navigation. Content density should be [compact/comfortable/spacious]. Dark mode, primary color [hex]." Specifying the exact card anatomy is the single most important detail for social feed prompts.
Prompt Template: Checkout & Payment Screens
Payment flows require explicit trust signal specification: "Design the checkout screen for [app name], an [ecommerce category] app. This is a single-screen express checkout. Show: (1) Order summary at top with item photo, name, quantity, and subtotal. (2) Delivery address section with the user's saved address and an Edit link. (3) Payment method with Apple Pay as the primary CTA button (black, full width), then a divider, then a credit card option. (4) Promo code input field. (5) Order total breakdown (subtotal, shipping, tax, total). (6) Confirm order button at bottom. Include a lock icon and 'Secured by Stripe' text near the payment section. Light theme, clean, minimal friction."
Advanced Techniques: Building Visual Consistency Across Screens
Once you have generated your first screen, include its description as context in every subsequent prompt: "Continue from the established design system: dark navy (#0A1628) background, white headings in Fraunces Serif Bold, body text in white/70 opacity, teal (#00C896) primary action color, 16px corner radius on cards, bottom tab navigation with 5 tabs (Home, Explore, Create, Library, Profile)." This "design system brief" at the start of every prompt ensures visual coherence across all generated screens. You can also ask Dezyn to generate a design system brief from your first screen, which you then reuse.
Frequently Asked Questions
Related Resources
Try these prompts in Dezyn now
Copy any template from this guide, customise it for your app, and generate your first screens in Dezyn — free to start.