{"slug":"responsive-fintech-onboarding-flow-for-genz","title":"Responsive Fintech Onboarding Flow for Gen‑Z","description":"Generate a four‑screen, mobile‑first onboarding sequence for a Gen‑Z‑focused fintech app. The prompt defines a 12‑column grid, bottom‑tab navigation, pastel brand colors, and includes concise micro‑copy for each step, delivering a ready‑to‑use high‑fidelity mockup.","author":{"username":"ava_designs","name":"Ava Rivera"},"url":"https://onaiagents.com/p/responsive-fintech-onboarding-flow-for-genz","repo_clone_url":"https://onaiagents.com/p/responsive-fintech-onboarding-flow-for-genz.repo","raw_url":"https://onaiagents.com/p/responsive-fintech-onboarding-flow-for-genz.txt","markdown_url":"https://onaiagents.com/p/responsive-fintech-onboarding-flow-for-genz.md","archive_url":"https://onaiagents.com/p/responsive-fintech-onboarding-flow-for-genz.zip","models":["gpt-4o-(vision)","claude-3.5-sonnet","midjourney"],"kind":"image","tags":["ui","onboarding","fintech","responsive","branding","microcopy","designers","prompt-studio"],"stars":6,"views":0,"prompt":"## Prompt\n```\nYou are an AI UI designer. Create a **four‑screen mobile onboarding flow** for a **fintech app targeting Gen‑Z users**.\n\n### Context Slots\n- **App name**: ${app_name}\n- **Primary brand color** (hex): ${brand_color}\n- **Accent pastel palette** (list of 3 hex values): ${accent_palette}\n- **Key value propositions** (bullet list, max 3 items): ${value_props}\n- **Micro‑copy tone**: upbeat, concise, inclusive\n\n### Tasks\n1. **Layout**: Use a 12‑column grid with bottom‑tab navigation on the final screen. Provide column widths and spacing.\n2. **Screens**:\n   - **Screen 1 – Welcome**: Logo, headline, brief tagline, \"Get Started\" button.\n   - **Screen 2 – Sign‑up Options**: Social login buttons (Apple, Google), email sign‑up field.\n   - **Screen 3 – Personalization**: Ask for preferred account type (Saving, Investing) with toggle cards.\n   - **Screen 4 – Permissions & Finish**: Request notification & location permissions, final \"Start Using ${app_name}\" CTA.\n3. **Micro‑copy**: Write concise copy for each UI element (headlines, button labels, helper text) in a Gen‑Z friendly voice.\n4. **Visual Style**: Apply the pastel palette to backgrounds, buttons, and illustrations. Use rounded corners (8 dp) and subtle drop shadows.\n5. **Export**: Return a **high‑fidelity mockup** as a single image (PNG) showing all four screens side‑by‑side, plus a **JSON spec** describing layout dimensions, colors, and copy.\n\n### Output Format\n- **Image**: Base‑64 PNG (or a direct image URL if using Midjourney).\n- **JSON**:\n```json\n{\n  \"screens\": [\n    {\n      \"id\": \"welcome\",\n      \"layout\": {\"gridColumns\":12,\"spacing\":8},\n      \"components\": [\n        {\"type\":\"logo\",\"position\":\"top-center\"},\n        {\"type\":\"headline\",\"text\":\"${headline}\"},\n        {\"type\":\"button\",\"text\":\"Get Started\",\"color\":\"${brand_color}\"}\n      ]\n    },\n    ...\n  ]\n}\n```\n\n### Quality Bar\n- All copy must be <= 12 words per element.\n- Colors must meet WCAG AA contrast against white background.\n- Images must be 1080 × 2400 px (portrait) for each screen.\n\n### Constraints\n- Do **not** include any stock brand logos.\n- Keep the total file size under 2 MB.\n- Use only the supplied color palette; no additional colors.\n- Ensure the design is fully responsive to 360‑dp width devices.\n```","files":[{"filename":"README.md","kind":"text","mime":"text/plain","size":491,"raw_url":"https://onaiagents.com/api/site/raw/responsive-fintech-onboarding-flow-for-genz/README.md"},{"filename":"source-notes.md","kind":"text","mime":"text/plain","size":384,"raw_url":"https://onaiagents.com/api/site/raw/responsive-fintech-onboarding-flow-for-genz/source-notes.md"},{"filename":"usage-guide.md","kind":"text","mime":"text/plain","size":949,"raw_url":"https://onaiagents.com/api/site/raw/responsive-fintech-onboarding-flow-for-genz/usage-guide.md"},{"filename":"sources.json","kind":"text","mime":"text/plain","size":172,"raw_url":"https://onaiagents.com/api/site/raw/responsive-fintech-onboarding-flow-for-genz/sources.json"},{"filename":"thumbnail-source.txt","kind":"text","mime":"text/plain","size":71,"raw_url":"https://onaiagents.com/api/site/raw/responsive-fintech-onboarding-flow-for-genz/thumbnail-source.txt"}],"updated_at":"2026-07-08T10:24:50.406528"}