[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6FCWS0RT3JWNFN93JMB09BH":3,"skill-same:01M6FCWS0RT3JWNFN93JMB09BH":79},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":15,"categories":16,"keywords":27,"publishedAt":50,"linkOnly":51,"markdownContent":52,"markdownBody":53,"frontMatter":54,"refName":31,"commitSha":59,"skillDirectory":60,"forksCount":61,"repositoryHtmlUrl":62,"repositoryHomepageUrl":6,"ownerHtmlUrl":63,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":64,"install":65,"resources":78},"01M6FCWS0RT3JWNFN93JMB09BH","ux-flow",null,"Design user flows and navigation structure following proven UX patterns","boisenoise\u002Fskills-collections","boisenoise","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F193180?v=4","01M6CDBDQK6BDN55ZMA6B6PKBM","01M6CDBDVSJ3JPTBYN26FZ7TZK",12,"MIT","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-ux-flow\u002FSKILL.md",[17,22],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000015","视觉设计","SCENARIO","使用场景",{"categoryNo":23,"categoryName":24,"taxonomyType":25,"taxonomyTypeDesc":26},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49],"ux","flow","ux flow","main","2026","blob","tree","ss","flows","critical","structure","patterns","wed","design","community","styleseed","navigation","user","engine","https","license","github","2026-11-10 10:12:30",false,"---\nname: ux-flow\ndescription: Design user flows and navigation structure following proven UX patterns\nrisk: critical\nsource: https:\u002F\u002Fgithub.com\u002Fbitjaru\u002Fstyleseed\u002Ftree\u002Fmain\u002Fengine\u002F.claude\u002Fskills\u002Fss-flow\nsource_repo: bitjaru\u002Fstyleseed\nsource_type: community\ndate_added: 2026-07-01\nlicense: MIT\nlicense_source: https:\u002F\u002Fgithub.com\u002Fbitjaru\u002Fstyleseed\u002Fblob\u002Fmain\u002FLICENSE\n---\n\n# UX Flow Designer\n## When to Use\n\nUse this skill when you need design user flows and navigation structure following proven UX patterns.\n\n\n## When NOT to use\n\n- For implementing a single page → use `\u002Fss-page` after the flow is settled\n- For copy on each step → use `\u002Fss-copy` after the structure is settled\n- For information architecture of an entire product — narrow scope to one flow first\n- For high-fidelity mockups — this produces a flow map, not pixel-perfect designs\n\nDesign a user flow: **$0**\nDescription: $ARGUMENTS\n\n## Instructions\n\n1. Read the design system reference:\n   - `CLAUDE.md` for component inventory\n   - `DESIGN-LANGUAGE.md` for layout patterns (sections 13-14, 19-20)\n   - `components\u002Fpatterns\u002F` for available building blocks\n\n2. Apply these UX principles:\n\n### Information Architecture\n- **Progressive Disclosure**: Show only what's needed at each step. Hide complexity behind logical drill-downs.\n- **Miller's Law**: Chunk information into groups of 5-9 items maximum.\n- **Hick's Law**: Minimize choices per screen. Fewer options = faster decisions.\n\n### Navigation Patterns\n- **Hub & Spoke**: Dashboard → detail pages → back to dashboard (default for mobile apps)\n- **Linear Flow**: Step 1 → Step 2 → Step 3 (for forms, onboarding, checkout)\n- **Tab Navigation**: 3-5 top-level sections via BottomNav\n\n### Screen Flow Rules\n- Every flow must have a **clear entry point** and **clear exit point**\n- Maximum **3 taps** to reach any key feature from the home screen\n- Back navigation must always be available (except root screens)\n- Error states must provide **recovery paths** (retry, go back, contact support)\n- Loading states must use skeleton screens (never spinners in cards)\n\n### Page Composition (from DESIGN-LANGUAGE.md)\n- Follow the **Information Pyramid**: Hero → KPI Grid → Details → Lists\n- Each screen should answer ONE primary question\n- Above the fold: the most important metric or action\n- Use the 4 section types: Full Card (A), Grid (B), Carousel (C), Hero (D)\n\n3. Output format:\n   - **Flow diagram** in ASCII showing screen connections\n   - **Screen inventory** listing each screen's purpose and key components\n   - **Edge cases** (empty states, errors, loading) for each screen\n   - **Scaffolded pages** using `PageShell`, `TopBar`, `BottomNav` patterns\n\n4. Generate the actual page files using `\u002Fss-page` conventions.\n\n## Example\n\n**User request:**\n\n> Design user flows and navigation structure following proven UX patterns.\n\n## Limitations\n\n- Use this skill only when the task clearly matches its upstream source and local project context.\n- Verify commands, generated code, dependencies, credentials, and external service behavior before applying changes.\n- Do not treat examples as a substitute for environment-specific tests, security review, or user approval for destructive or costly actions.\n\n## Execution boundaries\n\nThis guide targets an existing StyleSeed project. The listed project paths, components, tokens and \u002Fss-* commands are not bundled in this single-file entrypoint. Discover the actual project root and verify those prerequisites before edits; report absent resources instead of inventing them. Use host-supported invocation and existing project conventions. Layout numbers are design-system choices, not universal usability guarantees. Test keyboard access, responsive overflow and reduced motion on the actual interface.\n","# UX Flow Designer\n## When to Use\n\nUse this skill when you need design user flows and navigation structure following proven UX patterns.\n\n\n## When NOT to use\n\n- For implementing a single page → use `\u002Fss-page` after the flow is settled\n- For copy on each step → use `\u002Fss-copy` after the structure is settled\n- For information architecture of an entire product — narrow scope to one flow first\n- For high-fidelity mockups — this produces a flow map, not pixel-perfect designs\n\nDesign a user flow: **$0**\nDescription: $ARGUMENTS\n\n## Instructions\n\n1. Read the design system reference:\n   - `CLAUDE.md` for component inventory\n   - `DESIGN-LANGUAGE.md` for layout patterns (sections 13-14, 19-20)\n   - `components\u002Fpatterns\u002F` for available building blocks\n\n2. Apply these UX principles:\n\n### Information Architecture\n- **Progressive Disclosure**: Show only what's needed at each step. Hide complexity behind logical drill-downs.\n- **Miller's Law**: Chunk information into groups of 5-9 items maximum.\n- **Hick's Law**: Minimize choices per screen. Fewer options = faster decisions.\n\n### Navigation Patterns\n- **Hub & Spoke**: Dashboard → detail pages → back to dashboard (default for mobile apps)\n- **Linear Flow**: Step 1 → Step 2 → Step 3 (for forms, onboarding, checkout)\n- **Tab Navigation**: 3-5 top-level sections via BottomNav\n\n### Screen Flow Rules\n- Every flow must have a **clear entry point** and **clear exit point**\n- Maximum **3 taps** to reach any key feature from the home screen\n- Back navigation must always be available (except root screens)\n- Error states must provide **recovery paths** (retry, go back, contact support)\n- Loading states must use skeleton screens (never spinners in cards)\n\n### Page Composition (from DESIGN-LANGUAGE.md)\n- Follow the **Information Pyramid**: Hero → KPI Grid → Details → Lists\n- Each screen should answer ONE primary question\n- Above the fold: the most important metric or action\n- Use the 4 section types: Full Card (A), Grid (B), Carousel (C), Hero (D)\n\n3. Output format:\n   - **Flow diagram** in ASCII showing screen connections\n   - **Screen inventory** listing each screen's purpose and key components\n   - **Edge cases** (empty states, errors, loading) for each screen\n   - **Scaffolded pages** using `PageShell`, `TopBar`, `BottomNav` patterns\n\n4. Generate the actual page files using `\u002Fss-page` conventions.\n\n## Example\n\n**User request:**\n\n> Design user flows and navigation structure following proven UX patterns.\n\n## Limitations\n\n- Use this skill only when the task clearly matches its upstream source and local project context.\n- Verify commands, generated code, dependencies, credentials, and external service behavior before applying changes.\n- Do not treat examples as a substitute for environment-specific tests, security review, or user approval for destructive or costly actions.\n\n## Execution boundaries\n\nThis guide targets an existing StyleSeed project. The listed project paths, components, tokens and \u002Fss-* commands are not bundled in this single-file entrypoint. Discover the actual project root and verify those prerequisites before edits; report absent resources instead of inventing them. Use host-supported invocation and existing project conventions. Layout numbers are design-system choices, not universal usability guarantees. Test keyboard access, responsive overflow and reduced motion on the actual interface.\n",{"name":5,"risk":37,"source":55,"license":14,"date_added":56,"description":7,"source_repo":57,"source_type":42,"license_source":58},"https:\u002F\u002Fgithub.com\u002Fbitjaru\u002Fstyleseed\u002Ftree\u002Fmain\u002Fengine\u002F.claude\u002Fskills\u002Fss-flow",1782864000000,"bitjaru\u002Fstyleseed","https:\u002F\u002Fgithub.com\u002Fbitjaru\u002Fstyleseed\u002Fblob\u002Fmain\u002FLICENSE","7bf2279c8a65758319526a721d5c4b75683aec9c","skills\u002Fantigravity-ux-flow",3,"https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections","https:\u002F\u002Fgithub.com\u002Fboisenoise","2026-11-13 14:20:47",{"source":8,"skillName":5,"commands":66,"prompt":76,"zipAvailable":77},[67,70,73],{"tool":68,"command":69},"npx","npx skills add boisenoise\u002Fskills-collections --skill ux-flow",{"tool":71,"command":72},"bunx","bunx skills add boisenoise\u002Fskills-collections --skill ux-flow",{"tool":74,"command":75},"pnpm","pnpm dlx skills add boisenoise\u002Fskills-collections --skill ux-flow","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-ux-flow\u002FSKILL.md",true,[],[80,108,131,154,173,196],{"skillNo":81,"name":82,"nameZh":6,"description":83,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":84,"licenseFileUrl":85,"sourceHtmlUrl":86,"categories":87,"keywords":88,"publishedAt":50},"01M6WNH92BHVFXHGPDZCPJ0AG0","web-access","Use Treg for public web or platform data only when existing search, browser and connected tools cannot cover the task, with explicit cost and data boundaries.","Apache-2.0","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-web-access\u002FLICENSE","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-web-access\u002FSKILL.md",[],[89,90,91,92,93,94,95,96,97,98,99,100,101,102,103,37,104,105,106,107,32],"web","access","web access","official","development","browser","search","data","Tools","read","fetch","only","youtube","free tools","platform","free","cover","normal","when",{"skillNo":109,"name":110,"nameZh":6,"description":111,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":84,"licenseFileUrl":112,"sourceHtmlUrl":113,"categories":114,"keywords":118,"publishedAt":50},"01M6WNF9XAYAB2CZDDJBAKNM93","treg","Use the Treg CLI or MCP catalog to discover, price and call authorized external tools with team-scoped credentials and a user-approved budget.","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-treg\u002FLICENSE","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-treg\u002FSKILL.md",[115],{"categoryNo":116,"categoryName":117,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000023","Skill与智能体开发",[110,119,120,49,92,93,48,97,121,122,123,124,125,126,127,37,128,129,130,33,32],"MCP","cli","Budget","credentials","team","catalog","use","call","discover","external tools","with","scoped",{"skillNo":132,"name":133,"nameZh":6,"description":134,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":84,"licenseFileUrl":135,"sourceHtmlUrl":136,"categories":137,"keywords":141,"publishedAt":50},"01M6WN93MEAZ4E41DYAHJRPHQT","recruit","Turn a job description into an evidence-linked candidate shortlist through Treg, with job-related ranking and optional authorized business contact enrichment.","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-recruit\u002FLICENSE","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-recruit\u002FSKILL.md",[138],{"categoryNo":139,"categoryName":140,"taxonomyType":25,"taxonomyTypeDesc":26},"01JBSEEDCAT000000000000038","人力资源",[133,49,92,48,47,142,143,144,145,146,37,147,148,149,129,150,151,152,153,33,110,32],"email","enrichment","business","evidence","phone","ranking","post","job description","for","person","candidate","reason",{"skillNo":155,"name":156,"nameZh":6,"description":157,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":84,"licenseFileUrl":158,"sourceHtmlUrl":159,"categories":160,"keywords":161,"publishedAt":50},"01M6WN8R5RXSMHM9B4D9FAFX42","rea-growth","Analyze a company’s public growth and content through Treg, distinguish observations from hypotheses, and produce an evidence-linked playbook within an approved budget.","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-rea-growth\u002FLICENSE","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-rea-growth\u002FSKILL.md",[],[162,163,164,49,92,48,165,166,47,167,121,168,169,170,145,37,171,172,33,110,32],"growth","rea","rea growth","produce","content","playbook","marketing","analyze","public","observations","company",{"skillNo":174,"name":175,"nameZh":6,"description":176,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":84,"licenseFileUrl":177,"sourceHtmlUrl":178,"categories":179,"keywords":180,"publishedAt":50},"01M6WN2EVE3RQRGWAKBT4S7YT2","make-ugc","Create original AI UGC-style product videos through Treg: research hooks, approve a licensed presenter and voice, generate clips, add captions and report costs.","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-make-ugc\u002FLICENSE","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-make-ugc\u002FSKILL.md",[],[181,182,49,183,92,184,48,185,186,187,188,189,37,190,191,192,193,194,195,33],"make","make ugc","research","create","Video","Captions","ads","short","hooks","head","style","niche","trending","talking-head","approve",{"skillNo":197,"name":198,"nameZh":6,"description":199,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":84,"licenseFileUrl":200,"sourceHtmlUrl":201,"categories":202,"keywords":203,"publishedAt":50},"01M6WN10ARAA63Y8K1YNGXJ2RM","lead-signals","Find and qualify public buying signals through Treg, rank fitting business accounts and optionally enrich authorized business contact information.","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-lead-signals\u002FLICENSE","https:\u002F\u002Fgithub.com\u002Fboisenoise\u002Fskills-collections\u002Fblob\u002Fmain\u002Fskills\u002Fantigravity-lead-signals\u002FSKILL.md",[],[204,205,206,49,92,48,207,208,144,209,210,37,211,212,213,214,215,216,217,33],"signals","lead","lead signals","how","find","ready","as","how to","qualify","people","information","enrich","changes","funding"]