{"slug":"rapid-ui-mockup-generator-for-mobile-apps","title":"Rapid UI Mockup Generator for Mobile Apps","description":"Turn a concise product brief into a set of high‑fidelity mobile UI mockups with suggested color palettes, typography, and layout variations, ready for stakeholder review.","author":{"username":"alexr_design","name":"Alex Rivera"},"url":"https://onaiagents.com/p/rapid-ui-mockup-generator-for-mobile-apps","repo_clone_url":"https://onaiagents.com/p/rapid-ui-mockup-generator-for-mobile-apps.repo","raw_url":"https://onaiagents.com/p/rapid-ui-mockup-generator-for-mobile-apps.txt","markdown_url":"https://onaiagents.com/p/rapid-ui-mockup-generator-for-mobile-apps.md","archive_url":"https://onaiagents.com/p/rapid-ui-mockup-generator-for-mobile-apps.zip","models":["gemini-1.5-pro","imagen"],"kind":"image","tags":["design","ui/ux","mobile","mockup","rapid-prototyping","designers","prompt-studio"],"stars":9,"views":0,"prompt":"### Prompt\n```\nYou are an expert UI/UX designer specialized in rapid mobile‑app prototyping. Using the latest design system guidelines (Material Design for Android, Human Interface Guidelines for iOS), create **high‑fidelity mockup images** for the requested screens.\n\n**Context slots** (replace the placeholders with your project details):\n- **{{app_name}}** – name of the app.\n- **{{target_audience}}** – primary user segment (e.g., \"busy professionals\", \"teen gamers\").\n- **{{key_screens}}** – a comma‑separated list of core screens (e.g., \"login, home dashboard, profile, settings\").\n- **{{brand_colors}}** – optional hex codes for primary/secondary colors (if omitted, generate a harmonious palette).\n- **{{typography_style}}** – optional font family or style (e.g., \"Roboto, 400/700\", \"SF Pro Rounded\").\n\n**Task**: For each screen in {{key_screens}} (max 5 screens), output:\n1. A **full‑width mockup image** (PNG or base64) that respects the chosen platform’s UI conventions.\n2. A **brief style note** (≤30 words) describing the layout rationale, color usage, and typography choices.\n3. **Accessibility check** – confirm text‑to‑background contrast ≥ 4.5:1.\n\n**Output format** (Markdown):\n```markdown\n#### {{Screen Name}}\n![Mockup]({{image_url_or_base64}})\n*Style note:* {{style_note}}\n*Accessibility:* {{PASS/FAIL}}\n```\n\n**Quality bar**:\n- Pixel‑perfect alignment to the selected design system.\n- Consistent visual language across all screens.\n- No use of copyrighted icons or stock images.\n- All text legible on a 5‑inch device at 1080 px width.\n\n**Constraints**:\n- Limit to **5 screens** max.\n- If {{brand_colors}} are provided, **must** use only those colors for primary UI elements.\n- Keep file size per image ≤ 500 KB.\n- Deliver **only** the Markdown block—no extra explanation.\n```\n\n**Example call**:\n```\nGenerate mockups for \"FitPulse\" targeting \"fitness‑enthusiast millennials\". Key screens: login, activity feed, workout detail, progress chart, settings. Brand colors: #0A9D58, #FFFFFF. Typography: Inter.\n```","files":[{"filename":"README.md","kind":"text","mime":"text/plain","size":281,"raw_url":"https://onaiagents.com/api/site/raw/rapid-ui-mockup-generator-for-mobile-apps/README.md"},{"filename":"usage-guide.md","kind":"text","mime":"text/plain","size":441,"raw_url":"https://onaiagents.com/api/site/raw/rapid-ui-mockup-generator-for-mobile-apps/usage-guide.md"},{"filename":"source-notes.md","kind":"text","mime":"text/plain","size":348,"raw_url":"https://onaiagents.com/api/site/raw/rapid-ui-mockup-generator-for-mobile-apps/source-notes.md"},{"filename":"sources.json","kind":"text","mime":"text/plain","size":86,"raw_url":"https://onaiagents.com/api/site/raw/rapid-ui-mockup-generator-for-mobile-apps/sources.json"},{"filename":"thumbnail-source.txt","kind":"text","mime":"text/plain","size":71,"raw_url":"https://onaiagents.com/api/site/raw/rapid-ui-mockup-generator-for-mobile-apps/thumbnail-source.txt"}],"updated_at":"2026-07-08T15:26:33.540664"}