# Mobile Onboarding > Create multi-screen mobile onboarding flows shown as phone frames with concise copy and clear progression. A multi-screen mobile onboarding flow rendered as three phone frames side by side — splash, value-prop, sign-in. Status bar, swipe dots, primary CTA. Use when the brief mentions "mobile onboarding", "iOS onboarding", "phone signup", or "移动端引导". - Skill: `onfire7777/mobile-onboarding` (Agent Skill, multi-file: 3 files) - Install (CLI): `npx skillmds@latest add onfire7777/mobile-onboarding` - Raw SKILL.md: https://api.skillmd.com/api/skills/onfire7777/mobile-onboarding/raw - Safety review: pending - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Coding & Dev Tools - Author: onfire7777 (https://skillmd.com/u/onfire7777) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/onfire7777/mobile-onboarding --- # Mobile Onboarding Skill Produce a three-screen mobile onboarding flow on a single HTML page. ## Workflow 1. Read DESIGN.md. 2. Identify the app + audience. 3. Layout: three phone frames side by side. Each phone: - Status bar (time, battery, signal). - Hero artwork or icon. - Headline + supporting paragraph. - 3-dot pagination. - Primary CTA (full-width pill button). - "Skip" or alt action top-right. 4. Last phone is the sign-in / continue-with options screen. 5. Strong typography, gentle gradients, accessible contrast. ## Output contract ``` ... ```