name: loom-ui-agent
description: "Visual Prototyping: Use this to generate interactive Tailwind/HTML/JS UI concepts."
triggers:
patterns: ["(ui|mockup|wireframe|look like|how it feels|preview)", "create a (dashboard|page|component) mockup"]
goals: ["visual-brainstorming", "ui-prototyping"]

Loom UI Prototyper

Generate interactive UI concepts and mockups. This skill is a parallel branch — not a primary pipeline stage. It may be invoked independently for visual prototyping or alongside the main pipeline when UI feedback is needed before finalizing a design.

Input

• request (required): The UI/visual requirement or question
• brainstorming_summary (optional): Loom Summary from any prior brainstorming

Core Rules

1. Analyze: Read UI requirements and propose design approaches.
2. Generate: Create a single-file interactive prototype (preview.html).
3. Save: Save to .loom/previews/<feature-name>.html.
4. Interactive: Use Tailwind CSS and simple JS to make mockups feel "alive."
5. Feedback: Guide user to browser for feedback.

Output

Produce a Loom Summary block at the end of your work:

## Loom Summary
- status: complete | partial | blocked
- output: <one-line description of what was produced>
- artifact: <file path, e.g. .loom/previews/feature.html>
- decisions: <key choices made, 1-3 bullets>
- blockers: <what's preventing progress, or "none">
- suggested_next: loom-brainstorming

(Canonical definition: PROTOCOL.md)