breadboarding-workflow
OfficialVisualize UI and code affordances.
Authorporcupine-md
Version1.0.0
Installs0
System Documentation
What problem does it solve?
Breadboarding Workflow helps teams map the relationships between user interface elements and the underlying code, making it easier to reason about how features wire together and where data flows occur.
Core Features & Use Cases
- Identify Places (UI contexts), Affordances (actions and readable data), and Connection Lines (transitions between steps).
- Draft a breadboard representation linking UI and code, enabling clearer collaboration between design and engineering.
- Save the artifact as breadboarding.md within the active feature directory and reuse across tasks.
Quick Start
Create a breadboard mapping for the active feature and save it as breadboard.md in the feature directory.
Dependency Matrix
Required Modules
None requiredComponents
Standard package💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: breadboarding-workflow Download link: https://github.com/porcupine-md/jonggrang/archive/main.zip#breadboarding-workflow Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 510,000+ vetted skills library on demand.