New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

Dynamo UX Designer

by DynamoDS in DynamoDS/Dynamo

Plans UX flows, maps product needs to Weave Design System components, and generates structured Figma mockups using Autodesk Weave libraries.

Apache-2.0Auto-check passedFrontend & Design

Install Dynamo UX Designer

skills CLI
$ npx skills add DynamoDS/Dynamo --skill dynamo-ux-designer -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install DynamoDS/Dynamo dynamo-ux-designer --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/DynamoDS/Dynamo.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.claude/skills/dynamo-ux-designer .claude/skills/dynamo-ux-designer && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
dynamo-ux-designer
GitHub stars
2k
Token cost
~3.1k tokens
SKILL.md length
1,615 words
Files
1
Skills in repo
13
Repo updated
First seen
Licence
Apache-2.0

At a glance

Plans UX flows, maps product needs to Weave Design System components, and generates structured Figma mockups using Autodesk Weave libraries.

  • Works in 9 steps: Information Architecture & Hierarchy → Interaction & State Coverage → Consistency & System Thinking → …
  • The user requests UI components
  • SKILL.md covers Purpose, Core Functions, When to Use and 1.1 Progressive Disclosure, plus 3 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Dynamo UX Designer is an agent skill from DynamoDS/Dynamo. Plans UX flows, maps product needs to Weave Design System components, and generates structured Figma mockups using Autodesk Weave libraries. Use when the user requests UI components, pages, or applications; mentions forms, dashboards, landing pages, or modals; asks to design, build, or create interfaces; or wants to improve existing UI/UX. Aligns with Weave governance, tokens, variants, and AI/Assistant standards.

Its SKILL.md is about 3.1k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Frontend & Design, covering Design systems, UI design and Landing pages. It works with Figma. The repository describes itself as: Open Source Graphical Programming for Computational Design and Automation. The licence is Apache-2.0.

When your agent uses it

  • The user requests UI components
  • Create interfaces
  • Wants to improve existing UI/UX

Example prompts

  • “Use the dynamo-ux-designer skill to plan UX flows, maps product needs to Weave Design System components, and generates structured Figma mockups…”
  • “/dynamo-ux-designer”

Workflow steps

9 steps, taken from the step headings in SKILL.md.

  1. Information Architecture & Hierarchy
  2. Interaction & State Coverage
  3. Consistency & System Thinking
  4. Accessibility by Default
  5. Responsive & Cross-Platform Thinking
  6. Cognitive Load Reduction
  7. Error Prevention & Recovery
  8. AI & Conversational UX Best Practices
  9. Governance & Design Maturity

What it can do on your machine

Read from SKILL.md and the folder at commit 55647ad. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Dynamo UX Designer loads about 3.1k tokens when it runs. Until then it costs about 109 tokens; SKILL.md has 1,615 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~109
When it runs · the whole SKILL.md, loaded when a task matches
~3.1k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from DynamoDS/Dynamo at commit 55647ad, republished under its Apache-2.0 licence (© DynamoDS). 1,615 words, ~3,116 tokens.

Download SKILL.mdSave it as .claude/skills/dynamo-ux-designer/SKILL.md (or your agent's skills folder).
name
dynamo-ux-designer
description
Plans UX flows, maps product needs to Weave Design System components, and generates structured Figma mockups using Autodesk Weave libraries. Use when the user requests UI components, pages, or applications; mentions forms, dashboards, landing pages, or modals; asks to design, build, or create interfaces; or wants to improve existing UI/UX. Aligns with Weave governance, tokens, variants, and AI/Assistant standards.
metadata.version
1.0

Dynamo UX Designer

Purpose

Enable agents to plan, design, and produce high-quality Figma mockups aligned with the Autodesk Weave Design System, governance model, and AI/Assistant standards.

Core Functions

  • Plan UX flows aligned with Weave governance
  • Map product needs to Universal / Extended components
  • Generate structured Figma mockups using official libraries
  • Apply tokens, variants, and patterns correctly
  • Integrate AI conversational components when required
  • Validate compliance before handoff
  • Run Weave governance and accessibility checks before handoff

When to Use

Trigger when:

  • User requests UI components, pages, or applications
  • User mentions forms, dashboards, landing pages, modals
  • User asks to "design", "build", or "create" any interface
  • User wants to improve existing UI/UX

Do NOT use this skill for:

  • Pure visual exploration without UX intent
  • Branding, illustration, or icon design work
  • Copy-only requests with no UI implications

User Discovery

Before designing, understand who you're designing for. For narrow, single-component or single-screen requests, gather only role and context if needed. For full flows, new products, or ambiguous goals, complete the full user and pain-point discovery below.

Who are the users?

  • What's their role? (architect, BIM manager, developer, etc.?)
  • What's their skill level with similar tools? (beginner, expert, somewhere in between?)
  • What device will they primarily use? (mobile, desktop, tablet?)
  • Any known accessibility needs? (screen readers, keyboard-only navigation, motor limitations?)
  • How tech-savvy are they? (comfortable with complex interfaces or need simplicity?)

What's their context?

  • When/where will they use this? (rushed morning, focused deep work, distracted on mobile?)
  • What are they trying to accomplish? (their actual goal, not the feature request)
  • What happens if this fails? (minor inconvenience or major problem/lost revenue?)
  • How often will they do this task? (daily, weekly, once in a while?)
  • What other tools do they use for similar tasks?

What are their pain points?

  • What's frustrating about their current solution?
  • Where do they get stuck or confused?
  • What workarounds have they created?
  • What do they wish was easier?
  • What causes them to abandon the task?

If goals or user needs are unclear, involve a human UX designer or researcher and do research first; do not invent or assume them.

Determine the Scope

  • If the request is a single component or single screen with clear goals, focus on the role and context.
  • If the request involves a full workflow, new product surface, or ambiguous goals, complete the full discovery.
  • If the request is a new experience or an improvement, complete full discovery and consider impact on existing flows.
  • Do not over-interview for narrow, well-scoped UI tasks.

1. Information Architecture & Hierarchy

1.1 Progressive Disclosure

  • Secondary or destructive actions must be visually and spatially distinct
  • Avoid dense surfaces when tasks are sequential

1.2 Clear Visual Hierarchy

  • Use Weave Foundations (color, spacing, states) intentionally
  • Prioritize: Primary CTA prominence, clear content grouping, consistent spacing tokens
  • Provide a summary for the development team of why key design decisions were made (e.g. why an action is primary, why content is grouped as it is)

2. Interaction & State Coverage

For each component include: Default, Hover/Focus, Disabled, Error, Loading, Empty (if applicable). Component variants should represent use cases and states. Use Weave patterns, not ad-hoc UI.

3. Consistency & System Thinking

Prefer Weave Universal components. Avoid one-off component reinvention. Align layout, tone, and interaction patterns across screens. If Extended patterns are proposed, they must still align visually and structurally with Universal.

4. Accessibility by Default

Meet or exceed WCAG AA minimum contrast ratios. Ensure clear focus states, no color-only signaling, and full keyboard navigability. Avoid motion that interferes with usability. Accessibility is a baseline requirement.

5. Responsive & Cross-Platform Thinking

Define breakpoint strategy. Prevent layout collapse in narrow widths. Avoid fixed-width assumptions. Reflow content logically. Responsive behavior must be defined, not implied.

6. Cognitive Load Reduction

Limit simultaneous choices. Use defaults intelligently. Pre-fill where safe. Use panels and structural containers intentionally. Separate system-level controls from workflow-level controls.

7. Error Prevention & Recovery

Validate input early. Provide inline guidance before submission. Pair error states with recovery steps. Avoid ambiguous messaging. Reuse patterns for error and notification handling.

8. AI & Conversational UX Best Practices

Clear role definition: Clarify assistant capability boundaries; avoid overpromising.

Conversational components: Use Weave conversational components where applicable; follow Weave's Design & Iterate guidance for conversational flows.

Transparency: Signal uncertainty; distinguish AI-generated content from user-provided or system data; provide undo or revision pathways.

9. Governance & Design Maturity

Before finalizing mockups, run the Final Checklist in the Operating Model. Design with adoption and compliance in mind; products are expected to align with Weave policy and standards.

Golden Rules

  1. Use common patterns to create cohesion and familiarity This system will only work if designers commit to reusing patterns whenever possible. Consistency adds value by creating cohesion in our products and collections. Be innovative but pragmatic. Use common conventions when it makes sense.
  2. Strive for simplicity by only adding what's necessary Leave out any superfluous design. The UI should get out of the way and be quickly and easily scannable. Decoration adds complexity. Color can be a great tool, but only if it's used sparingly.
  3. Visually prioritize to guide behavior Tasks within our products should be completed as quickly as possible; we can help by establishing a visual hierarchy within the UI. It's a common sense approach — high importance, higher prominence; low importance, lower prominence.
  4. Adapt and scale for unique environments If you're building a component, think about how it may scale for different uses by different product teams on different platforms. If you're using a component and it doesn't fit your needs exactly, feel free to tweak ... within reason!
  5. Craft experiences that are clear and intuitive "Don't Make Me Think”. Give the user a sense of place within a workflow, and design the elements in a UI as "quick reads" to their meaning and function. We want a gripper to look and feel like a gripper.
  6. Consider all users We’ve worked hard to create a system of basics and components that’s accessible to all users. In your UI, use color as designation sparingly; assume the user has some form of color blindness. Allow necessary feedback for keyboard input and tabbing, and test any new work to adhere to the WCAG AA-AAA pass rating.
Show full SKILL.md (594 more words)Show less

Visual Hierarchy (Priority Order)

  1. Size: Larger = more important
  2. Color/Contrast: High contrast draws attention
  3. Alignment: Top-left (LTR) gets seen first. When you make most items neatly aligned, a single off-axis element stands out.
  4. Proximity: Items that are close together appear grouped
  5. Whitespace: Isolation emphasizes importance
  6. Typography weight: Bold stands out

Foundational Alignment

Weave is Autodesk's product design system: visual assets and Figma toolkits, code implementations (MUI, QML, Web Components), governance and compliance. Default to Weave Universal components; propose Extended only when workflow-specific needs require it.

Structure: Foundations (color, spacing, states), Components (buttons, dialogs, tiles), Patterns (dragging, errors, loading). Figma is the company-wide standard; common component libraries are maintained there.

Before creating designs, check for existing Weave components, colors, and patterns. Use the correct color theme (for Dynamo, usually dark gray). Use Weave-specified colors, spacing, typography. Match existing component patterns. Follow naming conventions.

Skill Capabilities

UX Planning

  1. Clarify intent: Define user goals and workflows; identify product UI vs assistant UI vs hybrid; determine if solution enhances existing or creates new workflows.
  2. Map to Weave: Identify relevant Foundations, Components, Patterns; prefer Universal before Extended; align with tokens.
  3. Define governance path: Flag when patterns may require Extended or exception; structure design for adoption and compliance.

Figma Mockup Generation

Use Weave Figma libraries and toolkit. Pull from shared libraries. Use variants (hover, error, multi-select). Apply tokens, not hard-coded styles. Produce: structured frame hierarchy, responsive layout strategy, state coverage (default, hover, error, loading, empty), pattern-level assembly.

Operating Model

Before Step 1 — Determine scope: Apply the Determine the scope section above. If single component or single screen with clear goals, focus on role and context. If full workflow, new surface, or ambiguous goals, plan for full discovery. Do not over-interview for narrow, well-scoped UI tasks.

Before Step 1 — User discovery: Run user discovery (Who are the users? Context? Pain points?) as needed for the scope you determined; full discovery for full flows or ambiguous goals, minimal discovery for narrow requests.

Step 1 — Intake: Product area, target user persona, workflow stage, platform (web, desktop, assistant).

Step 2 — Scope and fidelity: Clarify with the user: full flow or key screens; wireframe vs high-fidelity. Default to high-fidelity key screens using Weave components unless the user asks for exploration or wireframes.

Step 3 — Design System Mapping: Foundations required, Universal components, required patterns, AI/Assistant components if applicable.

Step 4 — Layout Strategy: Information hierarchy, responsive breakpoints, empty/loading/error states, accessibility considerations.

Step 5 — Figma Frame Plan

Produce structured frame tree, then build in Figma. Example structure:

Page
 ├── Global Header (Weave Universal)
 ├── Panel (Weave)
 │     ├── Title
 │     ├── Search Input
 │     ├── Data Grid (Pagination + Quick Filter)
 │     └── Empty State
 └── Assistant Container (if AI-enabled)

Step 6 — Governance Check: Run the Final Checklist below before handoff.

Step 7 — Handoff: Deliver Figma files unless the user specifies otherwise. Include: named frames, key state variants, and component/token references for implementation. Provide a summary for the development team of why key design decisions were made. Confirm with the user if additional specs or annotations are needed.

Iteration: If the user requests changes or alternatives, revisit the relevant step (e.g. layout or frame plan), apply feedback, and re-run the Final Checklist before handoff.

Final Checklist

Before finalizing and handoff, verify:

  • Built primarily from Weave Figma libraries; correct component variants; documented patterns followed
  • State coverage included (default, hover, error, loading, empty where applicable); AI asset guidance when relevant
  • Visual hierarchy clear; consistent spacing and alignment
  • Typography readable per Weave typography scale; color contrast meets WCAG AA
  • Interactive elements obvious; mobile-friendly touch targets (min 44×44)
  • Loading, empty, and error states considered; consistent with design system
  • No token overrides without reason; no hardcoded color or spacing; no deviation from documented component anatomy; no accessibility regressions

© DynamoDS, Apache-2.0. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in .claude/skills/dynamo-ux-designer of DynamoDS/Dynamo.

Open the folder on GitHubat commit 55647ad

Compare with similar skills

Dynamo UX Designer next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Dynamo UX Designer compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Dynamo UX Designer this skillDynamoDS/Dynamo2k—~3.1kAutomated safety check: PassApache-2.0
Cc DesignZeroZ-lab/cc-design827—~2.2kAutomated safety check: NotesNone
Refero Designreferodesign/refero_skill295—~5.3kAutomated safety check: PassMIT
UI/UX Design System AdvisorGalaxy-Dawn/claude-scholar5.7k1 repos~1.1kAutomated safety check: PassMIT
Visual Stylecalesthio/OpenMontage65k—~1.5kAutomated safety check: PassAGPL-3.0
Ky Design To HTMLKyrieCheungYep/ky-design-to-html-skill163—~2.8kAutomated safety check: PassNone

Similar skills

  • Cc Design

    ZeroZ-lab/cc-design

    High-fidelity HTML design and prototype creation. An agent skill from ZeroZ-lab/cc-design.

    827 GitHub stars~2.2k tokensUpdated 3 mo ago
    Frontend & DesignAuto-check: notes

  • Refero Design

    referodesign/refero_skill

    Primary/default skill for UI design, product design, web design, landing pages, dashboards, product screens, redesigns, visual polish, frontend/CSS styling, design systems, components, responsive…

    295 GitHub stars~5.3k tokensUpdated 1 mo ago
    Frontend & DesignAuto-check passed

  • UI/UX Design System Advisor

    Galaxy-Dawn/claude-scholar

    Turns a vague UI request into a concrete design system with style, palette, typography and layout guidance from a search script, plus stack-specific implementation advice.

    5.7k GitHub starsUsed in 1 repo~1.1k tokens
    Frontend & DesignAuto-check passed

  • Visual Style

    calesthio/OpenMontage

    Create, extract, and apply portable visual design systems via visual-style.md files.

    65k GitHub stars~1.5k tokensUpdated 5 days ago
    Frontend & DesignAuto-check passed

  • Ky Design To HTML

    KyrieCheungYep/ky-design-to-html-skill

    Convert visible UI references such as screenshots, exported mockups, Figma frame images, SaaS empty states, dashboards, and landing page screenshots into high-quality HTML/CSS by decomposing layout…

    163 GitHub stars~2.8k tokensUpdated 4 mo ago
    Frontend & DesignAuto-check passed

  • Claude Design

    jiji262/claude-design-skill

    Produce thoughtful, high-fidelity design artifacts in HTML — landing pages, slide decks, interactive prototypes, animated videos, posters, wireframes, and visual explorations.

    201 GitHub stars~3.6k tokensUpdated 2 mo ago
    Frontend & DesignAuto-check passed

More from DynamoDS/Dynamo

All 13 skills in this repo

  • Dynamo Jira Ticket

    DynamoDS/Dynamo

    Create structured Jira tickets for Dynamo from bug reports, failing tests, or feature requests.

    2k GitHub stars~1.1k tokensUpdated today
    Auto-check passed

  • Dynamo Dotnet Expert

    DynamoDS/Dynamo

    Write and review C/.NET code in Dynamo following Dynamo coding standards, modern C patterns, and repo conventions.

    2k GitHub stars~922 tokensUpdated today
    Auto-check passed

  • Dynamo PR Description

    DynamoDS/Dynamo

    Generate PR descriptions for Dynamo that align with the team template section names and order.

    2k GitHub stars~880 tokensUpdated today
    Auto-check passed

  • Dynamo Skill Writer

    DynamoDS/Dynamo

    Author and maintain Dynamo agent skills. An agent skill from DynamoDS/Dynamo.

    2k GitHub stars~2.2k tokensUpdated today
    Auto-check passed

  • Dynamo Unit Testing

    DynamoDS/Dynamo

    Write comprehensive NUnit tests for the Dynamo codebase following Dynamo testing patterns, conventions, and architectural constraints.

    2k GitHub stars~622 tokensUpdated today
    Auto-check passed

  • Dynamo Webview Component Scaffold

    DynamoDS/Dynamo

    Scaffolds a new Dynamo package repo that hosts a view extension with a WebView2-embedded React frontend.

    2k GitHub stars~991 tokensUpdated today
    Auto-check passed

Works with

Categories

Questions about Dynamo UX Designer

What does Dynamo UX Designer do?

Plans UX flows, maps product needs to Weave Design System components, and generates structured Figma mockups using Autodesk Weave libraries. Dynamo UX Designer is an agent skill from DynamoDS/Dynamo. Plans UX flows, maps product needs to Weave Design System components, and generates structured Figma mockups using Autodesk Weave libraries.

When should I use Dynamo UX Designer?

Dynamo UX Designer fits situations like: the user requests UI components; create interfaces; wants to improve existing UI/UX.

How do I install Dynamo UX Designer in Claude Code?

Run `npx skills add DynamoDS/Dynamo --skill dynamo-ux-designer -a claude-code`. Or copy the skill folder (.claude/skills/dynamo-ux-designer in DynamoDS/Dynamo) into .claude/skills/dynamo-ux-designer in your project. Claude Code loads it when a task matches its description.

How do I install Dynamo UX Designer in Codex?

Run `npx skills add DynamoDS/Dynamo --skill dynamo-ux-designer -a codex`. Or copy the skill folder (.claude/skills/dynamo-ux-designer in DynamoDS/Dynamo) into .agents/skills/dynamo-ux-designer in your project. Codex loads it when a task matches its description.

Can I use Dynamo UX Designer in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add DynamoDS/Dynamo --skill dynamo-ux-designer -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/dynamo-ux-designer, .gemini/skills/dynamo-ux-designer, .github/skills/dynamo-ux-designer and .opencode/skills/dynamo-ux-designer in your project.

What does Dynamo UX Designer need to run?

SKILL.md names no scripts, command-line tools or credentials: Dynamo UX Designer is instructions for the agent only.

Does Dynamo UX Designer access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Dynamo UX Designer safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Dynamo UX Designer use?

Dynamo UX Designer is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Dynamo UX Designer use?

About 3.1k tokens (SKILL.md is roughly 12k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Dynamo UX Designer?

Skills that share tags, products or a category with Dynamo UX Designer: Cc Design (ZeroZ-lab/cc-design, 827 stars), Refero Design (referodesign/refero_skill, 295 stars), UI/UX Design System Advisor (Galaxy-Dawn/claude-scholar, 5.7k stars) and Visual Style (calesthio/OpenMontage, 65k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Dynamo UX Designer?

DynamoDS (a GitHub organization) maintains it in DynamoDS/Dynamo, which has 2,033 GitHub stars. The repository holds 13 skills in this directory. The repository was last updated on October 8, 2026.

Source: DynamoDS/Dynamo on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.