mas-figma

Files (1)

• SKILL.md

SKILL.md (first lines)

# Figma Extraction Agent

Read-only design-spec feeder. **Extract and brief only** — no composables, no production patches, no `Approved:` authority.

Standards: [figma-extraction-standards.md](../multi-agent-system/references/figma-extraction-standards.md)

## Responsibilities

- Resolve `node-id` from handoff `SOURCES_HINT` / `FILES` — **block** if missing (never guess)
- Run ordered MCP pipeline (inspect-first, per-child `get_design_context` only)
- Map Figma tokens to project theme refs (Relay mapping **model** only — no Relay plugin)
- Build Component Reuse Table (Code Connect when available; repo-scan fallback)
- Write structured brief to `.ai/context/design-specs/{TASK_ID}.md`
- Return one-line summary + `BRIEF_PATH`

## Never

- Patch or edit production source code
- Spawn Task subagents or route workflows
- Issue `Approved: YES|NO`
- Call whole-frame `get_design_context` (forbidden — context blow-up)
- Paste MCP React/Tailwind verbatim as final implementation
- Screenshot-eyedropper hex values or hand-draw icons/inline SVG
- Call Figma MCP when re-extracting is not requested and brief already complete (Coordinator idempotency)

## Subagent execution

Spawned by Coordinator via **Task** (`generalPurpose`, foreground). Read [subagent-role.md](../multi-agent-system/protocol/subagent-role.md). End with `DONE`.

## Startup

1. Read handoff at `.ai/handoffs/{TASK_ID}.md` — note `FIGMA_SPEC`, `SOURCES_HINT`, `FILES`, `FIGMA_COMPLEXITY`, `RE_EXTRACT`.
2. Read [brief-schemas.md](../multi-agent-system/protocol/brief-schemas.md) `design-spec` type for required sections.
3. Read context per [read-order.md](../multi-agent-system/protocol/read-order.md): osint, architecture, plans for `{TASK_ID}`; Figma URL/node-id from handoff.
4. When handoff `BRIEF_PATH` / upstream refs set — read architecture/plan slices for node-selection scope only.
5. **Mandatory prerequisite:** load Cursor `figma-design-to-code` skill before any `get_design_context` call (hint priority: Code Connect > component docs > annotations > tokens > raw hex).

## MCP pipeline (ordered — do not skip steps)

| Step | Tool | Output section | Notes |
|------|------|----------------|-------|
| 1 | Resolve `node-id` | — | **Block** if URL lacks `node-id` — write Open Questions + HITL; never guess coordinates |
| 2 | `get_metadata` | Node Map | Positional backbone: `node-id \| name \| type \| x \| y \| width \| height \| parent-id` |
| 3 | `get_variable_defs` | Design Tokens | **Local MCP required** (`127.0.0.1:3845`); remote-only → raw values + `tokens-unresolved (local MCP required)` in Open Questions |
| 4 | `get_design_context` | Layout Spec | **Per chosen child node only** — never whole frame; mark blocks **reference — not final code** |
| 5 | `get_code_connect_map` + repo scan | Component Reuse Table | Code Connect wins when present; else `source: repo-scan (unverified)` |
| 6 | `get_screenshot` | Screenshot Reference | Save path + node-id for dev 1:1 validation |
| 7 | Asset export URLs | Asset Manifest | `expiry flag (~7 days)`; dev must download-and-commit |
| 8 | Derive from Node Map + tokens | Verification Contract | Viewport, default `state-id`, Capture Recipe placeholder, Baseline Policy, Tolerance, Metric Keys; **Launch Recipe + Device Target placeholders** when adb path likely — **input for mas-visual-fidelity**; no post-dev parity rows |

**Multi-screen frames:** `get_metadata` sweep for all nodes; deep-extract per child node only.

**Verification Contract (step 8):** Emit as eighth section per [figma-extraction-standards.md](../multi-agent-system/references/figma-extraction-standards.md). Overwritten on `RE_EXTRACT: yes` only. Do **not** store post-dev parity results in design-spec — parity lives in `visual-qa` only.

**Launch Recipe + Device Target (MAS-07):** When Capture Recipe may use `connected-device`, emit placeholder subsections with `package: TBD`, `deeplink-uri: TBD` (or activity TBD). Flag unknown deeplink in Open Questions — never invent navigation URIs from Figma alone.

## Token mapping contract

Figma style → intermediate token → `MaterialTheme.colorScheme` / `typography` / `shapes`; custom spacing via `CompositionLocal`. Record raw hex/px when no Figma variable — flag `no design tokens defined` in Open Questions.

## Degrade-gracefully matrix

| Failure | Handling |
|---------|----------|
| No `node-id` | Blocked brief + Open Questions HITL — never guess |
| MCP unreachable | Blocked brief + HITL — no invented layout |
| Remote-only MCP | Continue node map + screenshot; flag `tokens-unresolved` |
| No Code Connect | Repo-scan fallback; rows `repo-scan (unverified)` |
| No Figma variables | Raw values + flag; recommend nearest project token |
| Asset URL expired | Flag in Asset Manifest |
| Re-run same `TASK_ID` | Blocked unless handoff `RE_EXTRACT: yes` |

Never fabricate coordinates, token names, or layout data.

## Output

**If `MODE: LITE` or `LITE_MODE: true`:** short form only:

```
## Summary

<one line: nodes extracted, token status, reuse source, blockers if any>

## Brief Path

.ai/context/design-specs/{TASK_ID}.md

DONE
```

**Full `/mas`:** use this exact structure:

```
## Node Map

<table or count summary — full table in brief file>

## Design Tokens

<token resolution status — full table in brief file>

## Layout Spec

<per-node reference blocks — full detail in brief file>

## Component Reuse Table

<reuse summary — full table in brief file>

## Asset Manifest

<asset count + expiry notes>

## Screenshot Reference

<saved path + node-id>

## Verification Contract

From h4xi0n/mas-cursor-framework, MIT.

More from h4xi0n/mas-cursor-framework