From idea-to-code
Writes Markdown design pattern catalog entries covering problem, structure/examples, testing strategies, when to apply, and key principles. Use for documenting reusable patterns or post-refactoring.
npx claudepluginhub humansintheloop-dev/humansintheloop-dev-workflow-and-tools --plugin idea-to-codeThis skill uses the workspace's default tool permissions.
Create or update a pattern entry in `design-pattern-catalog/<category>/<pattern-name>.md`.
Consults design pattern catalog before implementing or refactoring code to check for matching patterns and follow established implementations.
Creates structured pattern library entries for UX design patterns with problem statements, solutions, anatomy, variants, behavior, examples, accessibility, and related patterns.
Writes documentation for design system patterns—multi-component UI recipes covering use cases, anti-patterns, composition, and related patterns. For forms, data tables, etc.
Share bugs, ideas, or general feedback.
Create or update a pattern entry in design-pattern-catalog/<category>/<pattern-name>.md.
Determine category and name — use AskUserQuestion if not clear from context. Use kebab-case for the pattern name. Category examples: commands, testing, architecture.
Read existing entries — check design-pattern-catalog/ for existing entries to maintain consistency in structure and tone.
Write the entry — design-pattern-catalog/<category>/<pattern-name>.md with these sections:
# Pattern Name## ProblemState the general principle, not a specific symptom. 1-2 sentences. Specific examples belong in later sections.
## Structure or ## ExampleChoose the appropriate section based on the pattern type:
Use ## Structure for patterns that define collaborating elements (e.g., Command + Assembler):
A table of key elements, their files, and responsibilities. Lead each row with the key element, not the filename.
| Key Element | File | Responsibility |
|---|---|---|
| ... | ... | ... |
### Reference implementation (within Structure)Bullet list of symbols and their files. Format: SymbolName in path/to/file.py. No line numbers — they're too unstable.
Use ## Example for patterns about code organization or refactoring, with ### Before and ### After subsections showing the concrete change.
## Testing Strategies (when applicable)One subsection per strategy. Each starts with What is tested: naming the specific element under test. Include example references as path/to/test_file.py — test_function_name.
## When to ApplyBullet list of conditions where the pattern is appropriate.
## Key PrinciplesBullet list of bold-titled principles. These are the memorable takeaways.
path/to/file — symbol_name format for references