[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6HSCTWHFK11DBD6B60207JC":3,"skill-same:01M6HSCTWHFK11DBD6B60207JC":80},{"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":30,"publishedAt":54,"linkOnly":55,"markdownContent":56,"markdownBody":57,"frontMatter":58,"refName":59,"commitSha":60,"skillDirectory":61,"forksCount":62,"repositoryHtmlUrl":63,"repositoryHomepageUrl":6,"ownerHtmlUrl":64,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":65,"install":66,"resources":79},"01M6HSCTWHFK11DBD6B60207JC","spec-workflow",null,"Standard software engineering workflow for requirement analysis, technical design, and task planning. Use this skill when developing new features, complex architecture designs, multi-module integrations, or projects involving database\u002FUI design.","welflau\u002Fai-dev-system","welflau","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F7010385?v=4","01M6HPTDGF18RFY07M229P8CTM","01M6HPTDMRMZCJPYBFEA9XVVYT",3,"MIT","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fplugins\u002Fcloudbase\u002Fskills\u002Fcloudbase\u002Freferences\u002Fspec-workflow\u002FSKILL.md",[17,22,25],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000015","视觉设计","SCENARIO","使用场景",{"categoryNo":23,"categoryName":24,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000023","Skill与智能体开发",{"categoryNo":26,"categoryName":27,"taxonomyType":28,"taxonomyTypeDesc":29},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53],"spec","workflow","spec workflow","new","design","when","requirement analysis","for","false","module","technical design","task","ui design","use","technical","integrations","projects","analysis","database","task planning","planning","software engineering","architecture","2026-11-10 10:12:30",false,"---\nname: spec-workflow\ndescription: Standard software engineering workflow for requirement analysis, technical design, and task planning. Use this skill when developing new features, complex architecture designs, multi-module integrations, or projects involving database\u002FUI design.\nalwaysApply: false\n---\n\n## When to use this skill\n\nUse this skill for **structured development workflow** when you need to:\n\n- Develop new features from scratch\n- Design complex architecture\n- Integrate multiple modules\n- Work on projects involving database design\n- Work on projects involving UI design\n- Ensure high-quality requirement analysis and acceptance criteria\n\n**Do NOT use for:**\n- Simple bug fixes\n- Documentation updates\n- Configuration changes\n- Code refactoring (unless explicitly requested)\n\n---\n\n## How to use this skill (for a coding agent)\n\n1. **Follow the workflow strictly**\n   - Each phase must be completed and confirmed by user before proceeding to next phase\n   - Never skip phases or proceed without user confirmation\n   - Use `interactiveDialog` tool when clarification is needed\n\n2. **Apply EARS requirement syntax**\n   - Use EARS (Easy Approach to Requirements Syntax) for requirement descriptions\n   - Format: `While \u003Coptional precondition>, when \u003Coptional trigger>, the \u003Csystem name> shall \u003Csystem response>`\n\n3. **Reference UI design rules when needed**\n   - If requirements involve frontend pages, must strictly reference `ui-design` skill\n   - Determine design style and color palette in requirements phase\n   - Confirm design details with user before finalizing requirements\n\n4. **Update task status**\n   - Keep task status updated in `tasks.md` file\n   - Mark tasks as completed when finished\n   - Work independently and efficiently while maintaining quality\n\n---\n\n# Spec Workflow\n\n**Important: You must follow these rules. Each phase must be confirmed by the user before proceeding to the next phase.**\n\n## Workflow Overview\n\n1. If you determine that the user's input is a new requirement, you can work independently following standard software engineering practices. Confirm with user when necessary, and can use `interactiveDialog` tool to collect information.\n\n2. Whenever the user inputs a new requirement, to standardize requirement quality and acceptance criteria, you must first understand the problem and requirements clearly. You must confirm with the user before proceeding to the next phase.\n\n## Phase 1: Requirements Document and Acceptance Criteria Design\n\nFirst complete the requirements design using EARS (Easy Approach to Requirements Syntax) method. If you determine the requirements involve frontend pages, **you must strictly reference `ui-design` skill**. Determine design style and color palette in the requirements phase. You must confirm requirement details with the user. After final confirmation, the requirements are finalized, then proceed to the next phase.\n\nSave to `specs\u002Fspec_name\u002Frequirements.md`. After confirming with the user, proceed to the next phase.\n\n**Reference format:**\n\n```markdown\n# Requirements Document\n\n## Introduction\n\nRequirement description\n\n## Requirements\n\n### Requirement 1 - Requirement Name\n\n**User Story:** User story content\n\n#### Acceptance Criteria\n\n1. Use EARS syntax: While \u003Coptional precondition>, when \u003Coptional trigger>, the \u003Csystem name> shall \u003Csystem response>. For example: When \"Mute\" is selected, the laptop shall suppress all audio output.\n2. ...\n...\n```\n\n## Phase 2: Technical Solution Design\n\nAfter completing the requirements design, based on the current technical architecture and the confirmed requirements above, design the technical solution. It should be concise but accurately describe the technical architecture (e.g., architecture, tech stack, technology selection, database\u002Finterface design, test strategy, security). Use mermaid diagrams when necessary.\n\nSave to `specs\u002Fspec_name\u002Fdesign.md`. You must confirm with the user clearly, then proceed to the next phase.\n\n## Phase 3: Task Breakdown\n\nAfter completing the technical solution design, based on the requirements document and technical solution, break down specific tasks. You must confirm with the user clearly, then save to `specs\u002Fspec_name\u002Ftasks.md`. After confirming with the user, proceed to the next phase and begin formal task execution. You need to update task status in a timely manner. When executing, work as independently and autonomously as possible to ensure efficiency and quality.\n\n**Task reference format:**\n\n```markdown\n# Implementation Plan\n\n- [ ] 1. Task Information\n  - Specific things to do\n  - ...\n  - _Requirement: Related requirement point number\n```\n\n## Phase 4: Task Execution\n\n- Begin formal task execution\n- Update task status in `tasks.md` file in real-time\n- Work independently and autonomously\n- Ensure efficiency and quality\n- Mark tasks as completed when finished\n\n## Key Principles\n\n1. **User Confirmation Required**: Each phase must be confirmed by the user before proceeding\n2. **EARS Syntax**: Use EARS method for requirement descriptions\n3. **UI Design Integration**: When requirements involve frontend pages, must reference UI design rules and determine design style in requirements phase\n4. **Technical Accuracy**: Technical solutions should be concise but accurate\n5. **Task Tracking**: Keep task status updated throughout execution\n6. **Independent Execution**: Work autonomously while maintaining quality\n\n","## When to use this skill\n\nUse this skill for **structured development workflow** when you need to:\n\n- Develop new features from scratch\n- Design complex architecture\n- Integrate multiple modules\n- Work on projects involving database design\n- Work on projects involving UI design\n- Ensure high-quality requirement analysis and acceptance criteria\n\n**Do NOT use for:**\n- Simple bug fixes\n- Documentation updates\n- Configuration changes\n- Code refactoring (unless explicitly requested)\n\n---\n\n## How to use this skill (for a coding agent)\n\n1. **Follow the workflow strictly**\n   - Each phase must be completed and confirmed by user before proceeding to next phase\n   - Never skip phases or proceed without user confirmation\n   - Use `interactiveDialog` tool when clarification is needed\n\n2. **Apply EARS requirement syntax**\n   - Use EARS (Easy Approach to Requirements Syntax) for requirement descriptions\n   - Format: `While \u003Coptional precondition>, when \u003Coptional trigger>, the \u003Csystem name> shall \u003Csystem response>`\n\n3. **Reference UI design rules when needed**\n   - If requirements involve frontend pages, must strictly reference `ui-design` skill\n   - Determine design style and color palette in requirements phase\n   - Confirm design details with user before finalizing requirements\n\n4. **Update task status**\n   - Keep task status updated in `tasks.md` file\n   - Mark tasks as completed when finished\n   - Work independently and efficiently while maintaining quality\n\n---\n\n# Spec Workflow\n\n**Important: You must follow these rules. Each phase must be confirmed by the user before proceeding to the next phase.**\n\n## Workflow Overview\n\n1. If you determine that the user's input is a new requirement, you can work independently following standard software engineering practices. Confirm with user when necessary, and can use `interactiveDialog` tool to collect information.\n\n2. Whenever the user inputs a new requirement, to standardize requirement quality and acceptance criteria, you must first understand the problem and requirements clearly. You must confirm with the user before proceeding to the next phase.\n\n## Phase 1: Requirements Document and Acceptance Criteria Design\n\nFirst complete the requirements design using EARS (Easy Approach to Requirements Syntax) method. If you determine the requirements involve frontend pages, **you must strictly reference `ui-design` skill**. Determine design style and color palette in the requirements phase. You must confirm requirement details with the user. After final confirmation, the requirements are finalized, then proceed to the next phase.\n\nSave to `specs\u002Fspec_name\u002Frequirements.md`. After confirming with the user, proceed to the next phase.\n\n**Reference format:**\n\n```markdown\n# Requirements Document\n\n## Introduction\n\nRequirement description\n\n## Requirements\n\n### Requirement 1 - Requirement Name\n\n**User Story:** User story content\n\n#### Acceptance Criteria\n\n1. Use EARS syntax: While \u003Coptional precondition>, when \u003Coptional trigger>, the \u003Csystem name> shall \u003Csystem response>. For example: When \"Mute\" is selected, the laptop shall suppress all audio output.\n2. ...\n...\n```\n\n## Phase 2: Technical Solution Design\n\nAfter completing the requirements design, based on the current technical architecture and the confirmed requirements above, design the technical solution. It should be concise but accurately describe the technical architecture (e.g., architecture, tech stack, technology selection, database\u002Finterface design, test strategy, security). Use mermaid diagrams when necessary.\n\nSave to `specs\u002Fspec_name\u002Fdesign.md`. You must confirm with the user clearly, then proceed to the next phase.\n\n## Phase 3: Task Breakdown\n\nAfter completing the technical solution design, based on the requirements document and technical solution, break down specific tasks. You must confirm with the user clearly, then save to `specs\u002Fspec_name\u002Ftasks.md`. After confirming with the user, proceed to the next phase and begin formal task execution. You need to update task status in a timely manner. When executing, work as independently and autonomously as possible to ensure efficiency and quality.\n\n**Task reference format:**\n\n```markdown\n# Implementation Plan\n\n- [ ] 1. Task Information\n  - Specific things to do\n  - ...\n  - _Requirement: Related requirement point number\n```\n\n## Phase 4: Task Execution\n\n- Begin formal task execution\n- Update task status in `tasks.md` file in real-time\n- Work independently and autonomously\n- Ensure efficiency and quality\n- Mark tasks as completed when finished\n\n## Key Principles\n\n1. **User Confirmation Required**: Each phase must be confirmed by the user before proceeding\n2. **EARS Syntax**: Use EARS method for requirement descriptions\n3. **UI Design Integration**: When requirements involve frontend pages, must reference UI design rules and determine design style in requirements phase\n4. **Technical Accuracy**: Technical solutions should be concise but accurate\n5. **Task Tracking**: Keep task status updated throughout execution\n6. **Independent Execution**: Work autonomously while maintaining quality\n\n",{"name":5,"alwaysApply":55,"description":7},"main","18d0e63d1313ca87098f614aa7c1e2dcf6de79c7","backend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fplugins\u002Fcloudbase\u002Fskills\u002Fcloudbase\u002Freferences\u002Fspec-workflow",1,"https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system","https:\u002F\u002Fgithub.com\u002Fwelflau","2026-11-10 11:14:25",{"source":8,"skillName":5,"commands":67,"prompt":77,"zipAvailable":78},[68,71,74],{"tool":69,"command":70},"npx","npx skills add welflau\u002Fai-dev-system --skill spec-workflow",{"tool":72,"command":73},"bunx","bunx skills add welflau\u002Fai-dev-system --skill spec-workflow",{"tool":75,"command":76},"pnpm","pnpm dlx skills add welflau\u002Fai-dev-system --skill spec-workflow","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fplugins\u002Fcloudbase\u002Fskills\u002Fcloudbase\u002Freferences\u002Fspec-workflow\u002FSKILL.md",true,[],[81,112,135,160,185,207],{"skillNo":82,"name":83,"nameZh":6,"description":84,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":85,"licenseFileUrl":86,"sourceHtmlUrl":87,"categories":88,"keywords":92,"publishedAt":54},"01M6HSTDP4M3JFXEBK91VFB4PA","web-artifacts-builder","Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn\u002Fui). Use for complex artifacts requiring state management, routing, or shadcn\u002Fui components - not for simple single-file HTML\u002FJSX artifacts.","Apache-2.0","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fplugins\u002Fweb-artifacts-builder\u002FLICENSE.txt","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fplugins\u002Fweb-artifacts-builder\u002FSKILL.md",[89],{"categoryNo":90,"categoryName":91,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000009","前端开发",[93,94,95,96,97,98,99,100,101,102,103,104,105,106,44,107,108,109,110,38,111],"web artifacts builder","web","artifacts","artifacts builder","builder","frontend","css","components","react","routing","state management","state","file","Tailwind","single-file","simple","ui components","multi","single",{"skillNo":113,"name":114,"nameZh":6,"description":115,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":85,"licenseFileUrl":116,"sourceHtmlUrl":117,"categories":118,"keywords":122,"publishedAt":54},"01M6HSDXH0JSP8R3QTNY9XZ8HN","frontend-design","Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML\u002FCSS layouts, or when styling\u002Fbeautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fplugins\u002Ffrontend-design\u002FLICENSE.txt","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fplugins\u002Ffrontend-design\u002FSKILL.md",[119,120,121],{"categoryNo":90,"categoryName":91,"taxonomyType":20,"taxonomyTypeDesc":21},{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},{"categoryNo":26,"categoryName":27,"taxonomyType":28,"taxonomyTypeDesc":29},[98,35,123,99,94,100,101,124,125,126,95,127,128,129,44,43,130,131,132,133,134,36],"frontend design","react components","create","code","examples","applications","landing","pages","aesthetics","web ui","with","generic",{"skillNo":136,"name":137,"nameZh":6,"description":138,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":85,"licenseFileUrl":139,"sourceHtmlUrl":140,"categories":141,"keywords":143,"publishedAt":54},"01M6HSA77QYVP7A72HREGTDN2C","algorithmic-art","Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fplugins\u002Falgorithmic-art\u002FLICENSE.txt","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fplugins\u002Falgorithmic-art\u002FSKILL.md",[142],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},[144,145,146,125,126,147,148,149,150,44,151,152,153,154,133,155,156,157,158,159,36],"algorithmic art","Art","algorithmic","flow","js","work","interactive","generative art","exploration","systems","users","Existing","request","generative","copyright","fields",{"skillNo":161,"name":162,"nameZh":6,"description":163,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":85,"licenseFileUrl":164,"sourceHtmlUrl":165,"categories":166,"keywords":168,"publishedAt":54},"01M6HS9HE0X390Y6RQKTY1YNGJ","theme-factory","Toolkit for styling artifacts with a theme. These artifacts can be slides, docs, reportings, HTML landing pages, etc. There are 10 pre-set themes with colors\u002Ffonts that you can apply to any artifact that has been creating, or can generate a new theme on-the-fly.","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fexternal_plugins\u002Ftheme-factory\u002FLICENSE.txt","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fexternal_plugins\u002Ftheme-factory\u002FSKILL.md",[167],{"categoryNo":18,"categoryName":19,"taxonomyType":20,"taxonomyTypeDesc":21},[169,170,171,172,173,174,95,175,176,177,129,178,179,130,180,133,181,182,183,38,184,34],"theme factory","factory","theme","docs","toolkit","generate","SET","fly","slides","styling","artifact","themes","you","fonts","can","apply",{"skillNo":186,"name":187,"nameZh":6,"description":188,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":14,"licenseFileUrl":6,"sourceHtmlUrl":189,"categories":190,"keywords":192,"publishedAt":54},"01M6HS74GASM6FJ77F83EY679E","browsing","Use when you need direct browser control - teaches Chrome DevTools Protocol for controlling existing browser sessions, multi-tab management, form automation, and content extraction via use_browser MCP tool","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fexternal_plugins\u002Fsuperpowers-chrome\u002Fskills\u002Fbrowsing\u002FSKILL.md",[191],{"categoryNo":23,"categoryName":24,"taxonomyType":20,"taxonomyTypeDesc":21},[187,193,194,195,196,197,198,199,200,201,202,44,203,204,205,206,110,181,38,155],"MCP","automation","chrome","sessions","protocol","browser","devtools","chrome devtools","tool","direct","browser control","control","via","form",{"skillNo":208,"name":209,"nameZh":6,"description":210,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":6,"repositoryNo":12,"starsCount":13,"licenseSpdxId":85,"licenseFileUrl":211,"sourceHtmlUrl":212,"categories":213,"keywords":220,"publishedAt":54},"01M6HS6BZT2CKDNQ6YF20DXN4T","slack-gif-creator","Knowledge and utilities for creating animated GIFs optimized for Slack. Provides constraints, validation tools, and animation concepts. Use when users request animated GIFs for Slack like \"make me a GIF of X doing Y for Slack.\"","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fexternal_plugins\u002Fslack-gif-creator\u002FLICENSE.txt","https:\u002F\u002Fgithub.com\u002Fwelflau\u002Fai-dev-system\u002Fblob\u002Fmain\u002Fbackend\u002Fskills\u002Fmarketplace\u002Fcodebuddy-plugins-official\u002Fexternal_plugins\u002Fslack-gif-creator\u002FSKILL.md",[214,217],{"categoryNo":215,"categoryName":216,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000005","邮件与沟通",{"categoryNo":218,"categoryName":219,"taxonomyType":20,"taxonomyTypeDesc":21},"01JBSEEDCAT000000000000016","图像与多媒体",[221,222,223,224,225,226,227,228,229,44,230,154,231,232,233,38,156,36],"slack gif creator","slack","gif","creator","validation","Tools","constraints","Animation","knowledge","me","make","Utilities","concepts"]