UI UX Fixer

Advise on and critique UI/UX design work through the lens of Luke Wroblewski's published principles, using his MCP archive to retrieve relevant writings, presentations, videos, and other source material for each task. Use this skill whenever the user asks for a design review, UX critique, or feedback on a screen, page, form, sign-up flow, checkout, mobile layout, navigation scheme, or AI/agent interface — or asks "what would LukeW say," mentions Luke Wroblewski, or wants design advice grounded in established best practices rather than taste. Also use it when the user asks to fix or improve a U

6 stars 1 forksFrontend & Design

Install

skills CLI (Claude Code, Cursor, Codex and more)

npx skills add nerdstalker/ui-ux-fixer --skill ui-ux-fixer

Manual install

git clone --depth 1 https://github.com/nerdstalker/ui-ux-fixer.git /tmp/ui-ux-fixer
mkdir -p ~/.claude/skills
cp -r /tmp/ui-ux-fixer/. ~/.claude/skills/ui-ux-fixer

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# UI/UX Fixer

Advise, critique, and (with approval) improve interface designs using the published principles of Luke Wroblewski — author of *Mobile First* and *Web Form Design*, and a leading writer on AI product design at lukew.com.

This is an unofficial skill based on his public writing, books, and talks. It is not affiliated with or endorsed by Luke Wroblewski. When channeling his perspective, attribute ideas to their sources (book, talk, or lukew.com post) rather than inventing quotes.

## Three modes

Figure out which mode the user wants; when ambiguous, start with critique.

1. **Advise** — the user is designing something new or weighing options. Give direct, opinionated guidance from the principles below. Lead with the recommendation, then the reasoning and its source. "Products without a point of view have no point" — don't hedge into a list of neutral options.
2. **Critique** — the user shows you a screen, flow, form, page, or code. Review it against the relevant principle set and report findings ordered by user impact (what costs conversions, completions, or comprehension first — not nitpicks first). For each finding: what's wrong, why it matters to the user of the product, which principle it violates and where that principle comes from, and the concrete fix.

Read the full skill on GitHub

Details

Skill name: ui-ux-fixer
Repository: nerdstalker/ui-ux-fixer
License: MIT
Repo updated: 12 September 2026

FAQ

What does the UI UX Fixer skill do?

How do I install the UI UX Fixer skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add nerdstalker/ui-ux-fixer --skill ui-ux-fixer. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is UI UX Fixer popular?

It lives in nerdstalker/ui-ux-fixer, which has 6 GitHub stars and 1 forks.

Related skills

Design Fidelity Verify

jeltehomminga/figma-design-skills

Prove a running app matches its design spec by measuring rendered values, not eyeballing a screenshot. Use when the user says "verify the design", "is this pixel-perfect", "check against Figma", "does the app match the design", or "design QA this screen". Runs a bounded vision+numeric loop over web or mobile, classifying every spec row rather than reporting a bare pixel delta. Consumes the figma-design-extract spec table.

Frontend & DesignIn 1 list

Russian Text Quality

Anic888/russian-text-quality

Use when reviewing or writing code that contains Russian-language UI strings, i18n locale files (ru.json, ru.yml, ru.po), Russian comments, or transliterated identifiers (polzovatel, tovar, kolichestvo). Triggers on mixed English-code + Russian-content projects. Does not cover typography, spelling, or ё/е.

Frontend & Design

Figma Design Extract

jeltehomminga/figma-design-skills

Extract exact design values from a Figma node into a build-ready spec table, instead of eyeballing a screenshot. Use when the user shares a figma.com node URL, or says "implement this Figma design", "build this component from Figma", "extract the Figma values", or "match the Figma". This is design-to-code only - to push code into Figma, use figma-generate-design instead.

Frontend & DesignIn 1 list

Nature Style

Zhangyanbo/nature-style-skill

Nature-journal house style for publication-ready scientific figures, optimised for Python/matplotlib plotting. Bundles palette.py (a drop-in matplotlib style module with the Nature-style house palette, Wong colourblind-safe set, point-scale type, safe stroke weights, and helpers) plus the full design system as CSS tokens and figure components for HTML/SVG. Use this skill whenever creating or restyling any chart, plot, diagram, schematic, or multi-panel figure for a scientific paper or analysis — matplotlib/seaborn code, an HTML/SVG mock, choosing colours for scientific data, or preparing figur

Frontend & Design

Telegram Premium Emojis

abbosahmad/telegram-premium-emojis

Comprehensive guide, design system, and code generator for Telegram Bot Premium Custom Emojis, Aiogram 3 card UI, icon_custom_emoji_id inline buttons, and sticker pack discovery.

Frontend & Design

HTML CSS First

macdonst/html-css-first

Prefer modern HTML and CSS solutions over JavaScript-heavy implementations. Use this skill whenever building or reviewing frontend code — especially for UI patterns like modals, accordions, tabs, tooltips, form validation, animations, dropdowns, carousels, sticky headers, and toggles. Trigger on any request to build a UI component or page, even if the user doesn't explicitly ask for "CSS-only" — always check whether a native HTML element or CSS feature can replace a JS solution first. Also trigger when reviewing existing code for opportunities to reduce JavaScript by using modern browser capab

Frontend & Design

Browse the most popular Claude skills, all frontend & design skills, or write your own with the skills generator.