Designs that shine visually but frustrate users? You’re not alone. Clashing colours, poor hierarchy, ignored accessibility these blind spots plague solo Figma work. Imagine a 20-year UI veteran spotting every issue instantly.
Enter Claude Skills. No coding required. In 60 seconds, create “UI Critique Pro”—structured feedback on strengths, high/medium/low issues, scores, and redesign steps.
The Foolproof 6 Steps
-
Enable Skills: Settings > Capabilities > Toggle code execution and Skills.
-
Activate Creator: Customize > Skills > Enable “skill-creator”.
-
Prompt Claude: New chat: Paste the exact UI critique prompt (link in carousel).
-
Download Files: Grab Skill.md.
-
ZIP & Upload: Folder named “UI-Critique-Pro” > Upload ZIP.
-
Test Live: “Use UI Critique Pro on [Figma link]”.
Why It Works
Claude handles Figma prototypes, screenshots, descriptions. References atomic design, Material 3. Outputs actionable: “High severity: Button contrast fails WCAG—boost to 4.5:1.”
Tested on login pages, dashboards. Scores jumped from 6/10 to redesign-ready.
Grab the prompt at 02ui.com/skill. Build now, critique smarter tomorrow.
Prompt
Use skill-creator to build a skill for UI critique.
Skill name: UI Critique Pro
Description: Expert critique of UI designs focusing on usability, visual hierarchy, accessibility, consistency, and designer best practices for Figma users.
Instructions: When critiquing, always structure output as:
- Strengths (3 bullet points)
- Issues (numbered with severity: high/medium/low, and fix suggestions)
- Score (1-10 overall, with breakdown)
- Redesign ideas (2-3 actionable steps)
Expect inputs: Figma links, screenshots, or descriptions. Reference modern principles like atomic design, Material 3, and inclusive design.
Include 2 examples: Example 1: Input “Critique this login page screenshot [attach image]”. Output: [brief sample critique]. Example 2: Input “Review Figma prototype: [link]”. Output: [brief sample].
