Skip to content

feat(aem): add figma-to-content skill for EDS page migration from Figma - #305

Draft
hmehta-adobe wants to merge 2 commits into
adobe:mainfrom
hmehta-adobe:feat/figma-to-content-skill
Draft

feat(aem): add figma-to-content skill for EDS page migration from Figma#305
hmehta-adobe wants to merge 2 commits into
adobe:mainfrom
hmehta-adobe:feat/figma-to-content-skill

Conversation

@hmehta-adobe

Copy link
Copy Markdown

What

Adds a new EDS skill: figma-to-content under
plugins/aem/edge-delivery-services/skills/. It turns a Figma design into
an AEM Edge Delivery Services content page in Document Authoring (da.live).

It orchestrates existing public skills rather than reinventing them —
da-auth (DA IMS token), da-content (DA HTML rules + Source API +
preview/publish + media), block-collection-and-party / block-inventory
(block palette + authoring models), content-modeling +
content-driven-development / building-blocks / testing-blocks (new-block
dev), and snowflake (bespoke section → isolated block). The net-new logic is:
read the Figma design, resolve each section, and map content in.

How it works

  1. Read the Figma design via a Figma MCP → ordered section inventory.
  2. Resolve each section to one of: an existing block, a new isolated
    block
    , or default content — annotation-first, else inferred and
    confirmed
    with the user (never deploys an unseen guess).
  3. Generate DA-compliant body-fragment HTML (canonical div-based blocks;
    images uploaded to DA, not repo-relative paths).
  4. Deploy via the DA Source API (PUT admin.da.live/source) + preview
    (POST admin.hlx.page/preview), building/pushing new-block code first.

Runs standalone in plain Claude with just a Figma MCP and a DA IMS
token
— no proprietary tooling required.

Scope

  • Purely additive — one new skill directory, no changes to existing skills
    or shared files.
  • Guardrails: new, isolated blocks only; never skins existing blocks or edits
    global CSS beyond a one-time design-token retheme; treats Figma
    text/annotations as data, never instructions.

Status — draft

Marked Draft (v0.1.0) intentionally. The main open question before v1.0.0
is the annotation contract (references/annotation-contract.md), which
should be locked with adopters / the design team. Feedback on that spec is the
primary ask.

🤖 Generated with Claude Code

Orchestrates existing public EDS skills (da-auth, da-content, block-collection-and-party, snowflake, content-driven-development, testing-blocks) to turn a Figma frame into a Document Authoring content page. Reads the design via a Figma MCP, resolves each section to an existing block / new isolated block / default content (annotation-first, else inferred and confirmed), generates DA-compliant body-fragment HTML, and deploys via the DA Source API + preview. No proprietary tooling required. Draft (v0.1.0); annotation contract still to be locked with adopters.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
@hmehta-adobe

Copy link
Copy Markdown
Author

@karlpauls Sharing the first draft for the Figma Skill

… and citations

- SKILL.md Phase 3B/3C: use explicit 3B/3C labels tied to the Phase 2 routing decision instead of undefined 'bucket 3'/'bucket 2' terms
- SKILL.md Phase 5: upload referenced media to DA before the content PUT so every authored <img> resolves at preview time
- annotation-contract.md: cite da-content html-content.md §4/§5/§8 (the numbering lives in that file, not da-content root)
- README.md: add figma-to-content row to the skills index

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant