pftom
a98096a042
- Created .gitignore to exclude build artifacts and dependencies. - Added index.html as the main entry point for the application. - Included LICENSE file with Apache 2.0 terms. - Initialized package.json and package-lock.json for project dependencies. - Added pnpm-lock.yaml for package management. - Created QUICKSTART.md for setup instructions. - Added README.md and README.zh-CN.md for project documentation in English and Chinese.
1.4 KiB
1.4 KiB
name, description, triggers, ocd
| name | description | triggers | ocd | ||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 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 "移动端引导". |
|
|
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>