Goal
Design an approach to a single source of development truth for an online cashier component, while observing strict jurisdictional compliance rules.
Design an approach to a single source of development truth for an online cashier component, while observing strict jurisdictional compliance rules.
Requirement: prepare tokenisation for iOS, Android and web via StyleDictionary.
Constraint: no design system available.
Action: derive Primitives and Style variables from company public marketing HTML page import.
Constraint: no design system available.
Action: derive Primitives and Style variables from company public marketing HTML page import.
Workflow
Import marketing HTML page → Figma Agent gens UI, derives styles variables → Claude Project, create compliance harness → establish Claude/Figma Connector → Claude runs synthetic UT and compliance evals → Iterate in Figma → [Rerun evals]
Import marketing HTML page → Figma Agent gens UI, derives styles variables → Claude Project, create compliance harness → establish Claude/Figma Connector → Claude runs synthetic UT and compliance evals → Iterate in Figma → [Rerun evals]
CLAUDE COMPLIANCE / EVAL 1
34/100
34/100
CLAUDE COMPLIANCE / EVAL 2
68/100
68/100
I also ran a synthetic user test against the prototype based on a UX Heuristics .md skill, carefully iterating to get an even balance between user engagement and compliance guardrails. That output (from Iteration 1) is below.