figma-canva-design-workflowlisted
Install: claude install-skill Yaz-inc/yazinc-ai-toolkit
# Figma and Canva Design Workflow
## Objective
Use each platform for the work it handles best while preserving one approved brand, accessible content, traceable sources, and implementation-ready outputs.
## Platform roles
- Use Figma for application screens, flows, prototypes, components, variants, tokens, interaction states, responsive rules, and developer inspection.
- Use Canva for campaign graphics, social variants, simple presentations, printable collateral, and approved template-based production.
- Do not treat a flattened Canva graphic as the source of truth for an interactive product interface.
## Workflow
1. Inventory the brief, audience, channels, dimensions, languages, brand assets, accessibility needs, owners, deadlines, and approval path.
2. Establish the canonical brand inputs: approved logos, colors, typography, imagery rules, tone, legal copy, and source links.
3. Map each deliverable to Figma or Canva. Record one source of truth and one owner for every asset.
4. Build product UI in Figma with reusable components, named layers, auto layout, variables, responsive behavior, realistic content, and all interaction states.
5. Build campaign derivatives in Canva from approved brand inputs. Lock essential elements where supported and avoid manual visual drift between variants.
6. Review copy, contrast, hierarchy, reading order, alt-text needs, image meaning, localization expansion, and non-color status cues.
7. Export only required formats and sizes. Preserve e