[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill:01M6PFSVPDEWV7ZAV1WK7S7STJ":3,"skill-same:01M6PFSVPDEWV7ZAV1WK7S7STJ":76},{"skillNo":4,"name":5,"nameZh":6,"description":7,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":16,"categories":17,"keywords":23,"publishedAt":40,"linkOnly":41,"markdownContent":42,"markdownBody":43,"frontMatter":44,"refName":45,"commitSha":46,"skillDirectory":47,"forksCount":48,"repositoryHtmlUrl":49,"repositoryHomepageUrl":6,"ownerHtmlUrl":50,"ownerBlogUrl":6,"ownerDescription":6,"updatedAt":51,"install":52,"resources":65},"01M6PFSVPDEWV7ZAV1WK7S7STJ","prototype",null,"Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.","refo\u002Fclaude-dev-helpers","refo","https:\u002F\u002Favatars.githubusercontent.com\u002Fu\u002F1114116?v=4","01M6PFRE5P2JXK3P8VYTERWA33","Refik ÖNAL","01M6PFRE9XZS4SGHG2NQGJ9AB3",2,"MIT","https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fengineering\u002Fprototype\u002FSKILL.md",[18],{"categoryNo":19,"categoryName":20,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000032","设计师","PROFESSION","适用职业",[5,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39],"throwaway","design","state model","answer","sanity","logic","build","look","use","user","question","check","model","explore","ui","state","2026-11-10 10:12:30",false,"---\nname: prototype\ndescription: Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.\n---\n\n# Prototype\n\nA prototype is **throwaway code that answers a question**. The question decides the shape.\n\n## Pick a branch\n\nIdentify which question is being answered — from the user's prompt, the surrounding code, or by asking if the user is around:\n\n- **\"Does this logic \u002F state model feel right?\"** → [LOGIC.md](LOGIC.md). Build a tiny interactive terminal app that pushes the state machine through cases that are hard to reason about on paper.\n- **\"What should this look like?\"** → [UI.md](UI.md). Generate several radically different UI variations on a single route, switchable via a URL search param and a floating bottom bar.\n\nThe two branches produce very different artifacts — getting this wrong wastes the whole prototype. If the question is genuinely ambiguous and the user isn't reachable, default to whichever branch better matches the surrounding code (a backend module → logic; a page or component → UI) and state the assumption at the top of the prototype.\n\n## Rules that apply to both\n\n1. **Throwaway from day one, and clearly marked as such.** Locate the prototype code close to where it will actually be used (next to the module or page it's prototyping for) so context is obvious — but name it so a casual reader can see it's a prototype, not production. For throwaway UI routes, obey whatever routing convention the project already uses; don't invent a new top-level structure.\n2. **One command to run.** Whatever the project's existing task runner supports — `pnpm \u003Cname>`, `python \u003Cpath>`, `bun \u003Cpath>`, etc. The user must be able to start it without thinking.\n3. **No persistence by default.** State lives in memory. Persistence is the thing the prototype is _checking_, not something it should depend on. If the question explicitly involves a database, hit a scratch DB or a local file with a clear \"PROTOTYPE — wipe me\" name.\n4. **Skip the polish.** No tests, no error handling beyond what makes the prototype _runnable_, no abstractions. The point is to learn something fast and then delete it.\n5. **Surface the state.** After every action (logic) or on every variant switch (UI), print or render the full relevant state so the user can see what changed.\n6. **Delete or absorb when done.** When the prototype has answered its question, either delete it or fold the validated decision into the real code — don't leave it rotting in the repo.\n\n## When done\n\nThe _answer_ is the only thing worth keeping from a prototype. Capture it somewhere durable (commit message, ADR, issue, or a `NOTES.md` next to the prototype) along with the question it was answering. If the user is around, that capture is a quick conversation; if not, leave the placeholder so they (or you, on the next pass) can fill in the verdict before deleting the prototype.\n","# Prototype\n\nA prototype is **throwaway code that answers a question**. The question decides the shape.\n\n## Pick a branch\n\nIdentify which question is being answered — from the user's prompt, the surrounding code, or by asking if the user is around:\n\n- **\"Does this logic \u002F state model feel right?\"** → [LOGIC.md](LOGIC.md). Build a tiny interactive terminal app that pushes the state machine through cases that are hard to reason about on paper.\n- **\"What should this look like?\"** → [UI.md](UI.md). Generate several radically different UI variations on a single route, switchable via a URL search param and a floating bottom bar.\n\nThe two branches produce very different artifacts — getting this wrong wastes the whole prototype. If the question is genuinely ambiguous and the user isn't reachable, default to whichever branch better matches the surrounding code (a backend module → logic; a page or component → UI) and state the assumption at the top of the prototype.\n\n## Rules that apply to both\n\n1. **Throwaway from day one, and clearly marked as such.** Locate the prototype code close to where it will actually be used (next to the module or page it's prototyping for) so context is obvious — but name it so a casual reader can see it's a prototype, not production. For throwaway UI routes, obey whatever routing convention the project already uses; don't invent a new top-level structure.\n2. **One command to run.** Whatever the project's existing task runner supports — `pnpm \u003Cname>`, `python \u003Cpath>`, `bun \u003Cpath>`, etc. The user must be able to start it without thinking.\n3. **No persistence by default.** State lives in memory. Persistence is the thing the prototype is _checking_, not something it should depend on. If the question explicitly involves a database, hit a scratch DB or a local file with a clear \"PROTOTYPE — wipe me\" name.\n4. **Skip the polish.** No tests, no error handling beyond what makes the prototype _runnable_, no abstractions. The point is to learn something fast and then delete it.\n5. **Surface the state.** After every action (logic) or on every variant switch (UI), print or render the full relevant state so the user can see what changed.\n6. **Delete or absorb when done.** When the prototype has answered its question, either delete it or fold the validated decision into the real code — don't leave it rotting in the repo.\n\n## When done\n\nThe _answer_ is the only thing worth keeping from a prototype. Capture it somewhere durable (commit message, ADR, issue, or a `NOTES.md` next to the prototype) along with the question it was answering. If the user is around, that capture is a quick conversation; if not, leave the placeholder so they (or you, on the next pass) can fill in the verdict before deleting the prototype.\n",{"name":5,"description":7},"main","488e6998e820e577029147aceabcbc69961c43df","plugins\u002Fmp\u002Fskills\u002Fskills\u002Fengineering\u002Fprototype",0,"https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers","https:\u002F\u002Fgithub.com\u002Frefo","2026-07-02 04:43:45",{"source":8,"skillName":5,"commands":53,"prompt":63,"zipAvailable":64},[54,57,60],{"tool":55,"command":56},"npx","npx skills add refo\u002Fclaude-dev-helpers --skill prototype",{"tool":58,"command":59},"bunx","bunx skills add refo\u002Fclaude-dev-helpers --skill prototype",{"tool":61,"command":62},"pnpm","pnpm dlx skills add refo\u002Fclaude-dev-helpers --skill prototype","安装技能，技能地址：https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fengineering\u002Fprototype\u002FSKILL.md",true,[66,72],{"path":67,"resourceType":68,"resourceTypeDesc":69,"sizeBytes":70,"sourceHtmlUrl":71},"LOGIC.md","REFERENCE","参考文档",5594,"https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fengineering\u002Fprototype\u002FLOGIC.md",{"path":73,"resourceType":68,"resourceTypeDesc":69,"sizeBytes":74,"sourceHtmlUrl":75},"UI.md",6789,"https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fengineering\u002Fprototype\u002FUI.md",[77,101,117,131,146,156],{"skillNo":78,"name":79,"nameZh":6,"description":80,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":81,"categories":82,"keywords":91,"publishedAt":40},"01M6PFW0KDMWH5HGR1GA8K39ZN","writing-great-skills","Reference for writing and editing skills well — the vocabulary and principles that make a skill predictable.","https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fproductivity\u002Fwriting-great-skills\u002FSKILL.md",[83,88],{"categoryNo":84,"categoryName":85,"taxonomyType":86,"taxonomyTypeDesc":87},"01JBSEEDCAT000000000000018","写作与文案","SCENARIO","使用场景",{"categoryNo":89,"categoryName":90,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000036","内容创作者",[92,93,94,95,96,97,98,99,100],"writing great skills","writing","editing","reference","vocabulary","make","principles","true","for",{"skillNo":102,"name":103,"nameZh":6,"description":104,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":105,"categories":106,"keywords":110,"publishedAt":40},"01M6PFVXQ3PVRQ9035VZE9RBBX","teach","Teach the user a new skill or concept, within this workspace.","https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fproductivity\u002Fteach\u002FSKILL.md",[107],{"categoryNo":108,"categoryName":109,"taxonomyType":21,"taxonomyTypeDesc":22},"01JBSEEDCAT000000000000039","教师与教育",[103,111,112,113,33,114,115,99,116],"new skill","learn","workspace","about","you","concept",{"skillNo":118,"name":119,"nameZh":6,"description":120,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":121,"categories":122,"keywords":123,"publishedAt":40},"01M6PFVVJB7E7297GXB809B4J4","handoff","Compact the current conversation into a handoff document for another agent to pick up.","https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fproductivity\u002Fhandoff\u002FSKILL.md",[],[119,124,125,126,127,99,100,128,129,130],"document","conversation","compact","next","up","session","pick",{"skillNo":132,"name":133,"nameZh":6,"description":134,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":135,"categories":136,"keywords":137,"publishedAt":40},"01M6PFVS5DF6SM2251R15HR9A9","grilling","Interview the user relentlessly about a plan or design. Use when the user wants to stress-test a plan before building, or uses any 'grill' trigger phrases.","https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fproductivity\u002Fgrilling\u002FSKILL.md",[],[133,138,25,139,140,141,33,142,32,143,144,145,114],"trigger","test","plan","before building","interview","grill","stress-test","stress",{"skillNo":147,"name":148,"nameZh":6,"description":149,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":150,"categories":151,"keywords":152,"publishedAt":40},"01M6PFVQE56YMR6MXKTYWA2467","grill-me","A relentless interview to sharpen a plan or design.","https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fproductivity\u002Fgrill-me\u002FSKILL.md",[],[153,143,154,142,25,140,155,99],"me","grill me","sharpen",{"skillNo":157,"name":158,"nameZh":6,"description":159,"descriptionZh":6,"repositoryFullName":8,"ownerLogin":9,"ownerAvatarUrl":10,"ownerAccountNo":11,"ownerDisplayName":12,"repositoryNo":13,"starsCount":14,"licenseSpdxId":15,"licenseFileUrl":6,"sourceHtmlUrl":160,"categories":161,"keywords":162,"publishedAt":40},"01M6PFVMPQ6PWHRFRW5YYZ4VZF","obsidian-vault","Search, create, and manage notes in the Obsidian vault with wikilinks and index notes. Use when user wants to find, create, or organize notes in Obsidian.","https:\u002F\u002Fgithub.com\u002Frefo\u002Fclaude-dev-helpers\u002Fblob\u002Fmain\u002Fplugins\u002Fmp\u002Fskills\u002Fskills\u002Fpersonal\u002Fobsidian-vault\u002FSKILL.md",[],[163,164,165,166,167,168,169,170,33,32,171,172,173],"obsidian vault","vault","obsidian","notes","create","index","search","find","manage","organize","with"]