aibdd-uiux-draw

To generate UI design scenes from a discovery brief, this Skill transforms discovery outputs into token-initialized component and frame drawings, automatically matching every component state variant to the brief's acceptance criteria.

Automating Pencil UI drawings from design tokens involves using a component-first workflow that reads token-initialized inputs and canonical frame compositions to construct boundary-consistent scenes without manual layout.

Yes, you need a style profile. Generating component-first UI scenes requires having both a uiux-prompt.md file and a design/style-profile.yml available in your specs directory.

Yes, you can validate frame composition and component states automatically. The process uses a snapshot and screenshot-based self-correction loop with a budget of 3 rounds to catch missing states, wrong labels, and hardcoded colors.

To export a design.pen artifact for downstream story binding, this Skill writes the final validated Pencil nodes directly to the package root after completing the component and frame composition drawings.

Automated UI scene generation fails due to hardcoded colors because the validation process enforces strict design token usage. The 3-round self-correction loop specifically catches and rejects hardcoded colors to maintain boundary consistency.