mobile-onboarding
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 "移动端引导".
68
Quality
84%
Does it follow best practices?
Run evals on this skill
Adds up to 20 points to the overall score
View guide
Securityby
Passed
No findings from the security scan
Mobile Onboarding Skill
Produce a three-screen mobile onboarding flow on a single HTML page.
Workflow
- Read DESIGN.md.
- Identify the app + audience.
- 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.
- Last phone is the sign-in / continue-with options screen.
- Strong typography, gentle gradients, accessible contrast.
Output contract
<artifact identifier="mobile-onboarding-name" type="text/html" title="Mobile Onboarding">
<!doctype html>...</artifact>- Repository
- nexu-io/open-design
- Commit
1a7a23d
- Last updated
- First committed
Is this your skill?
If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.