Claude Code Skill Refactors React Components Using 'Don't Make Me Think' Principles
A new community-built skill for Claude Code applies Steve Krug's Don't Make Me Think usability principles to React components. The skill auto-detects your design system (shadcn/ui, MUI, Chakra, Mantine, Ant, or custom) and uses existing primitives instead of reinventing them.
What it does
The skill takes a React component and refactors it for usability by:
- Removing happy talk and instruction paragraphs
- Making the primary CTA obvious
- Fixing dead-end loading / empty / error states
- Tightening labels (e.g., "Please enter your first name" → "First name")
- Improving visual hierarchy and scanability
The author built it because Claude (and most LLMs) tend to generate UIs that are technically functional but cluttered, wordy, and hard to scan. This skill enforces cutting until only the signal remains.
Installation
npx skills add gashiartim/ux-enhancerFramework agnostic
The skill automatically detects your design system — shadcn/ui, MUI, Chakra, Mantine, Ant, or custom — and uses your existing components rather than creating new ones.
Repo and feedback
Source code is available at github.com/gashiartim/ux-enhancer. The author welcomes feedback and PRs, and is curious if the skill triggers reliably or if the description needs tuning.
📖 Read the full source: r/ClaudeAI
👀 See Also
AI Trading Agent with Risk Guardrails for Educational Investing
A developer built an AI-powered trading assistant that connects Claude to a brokerage account with a risk engine between the AI and money. The system includes safety checks like blocking trades that exceed 50% of portfolio allocation, automatic shutdown at 3% daily loss, and a kill switch at 20% drawdown.
Knowledge Raven: A Searchable Knowledge Base Plugin for Claude
Knowledge Raven is a tool that lets Claude search your documents from sources like Confluence, Notion, Google Drive, Dropbox, and GitHub via a Claude Desktop plugin or MCP server, providing semantic search, keyword search, and full document retrieval.
Claude Academy: A Free Coding Bootcamp That Runs Inside Claude Desktop
A developer has built Claude Academy, a free coding bootcamp that operates entirely within Claude Desktop's Code tab. The system uses three commands to deliver 64 structured lessons across web development fundamentals, with progress tracking and real project building.
Routerly: Self-Hosted LLM Gateway with Runtime Routing Policies and Budget Control
Routerly is a free, open-source, self-hosted LLM gateway that provides runtime model selection based on routing policies like cheapest, fastest, or most capable, along with project-level budget limits with per-token tracking. It's OpenAI-compatible for drop-in use with tools like Cursor, LangChain, and Open WebUI.