Stats
Actions
Available In
Tags
'%20stop-opacity%3D'0.16'%2F%3E%3Cstop%20offset%3D'1'%20stop-color%3D'rgb(200%2C90%2C60)'%20stop-opacity%3D'0.03'%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Crect%20width%3D'320'%20height%3D'200'%20fill%3D'url(%23g)'%2F%3E%3Ccircle%20cx%3D'250'%20cy%3D'56'%20r%3D'92'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.06'%2F%3E%3Ccircle%20cx%3D'64'%20cy%3D'172'%20r%3D'58'%20fill%3D'rgb(200%2C90%2C60)'%20fill-opacity%3D'0.05'%2F%3E%3C%2Fsvg%3E)
By hdeibler
Framework-agnostic design principles for cognition, mental models, complexity reduction, and learnability. Covers Hick's Law, Wayfinding, Progressive Disclosure, 80/20 Rule, Chunking, Mental Model, Recognition Over Recall, Consistency, Mimicry, and Iconic Representation. Drawn from the cognition-related entries of 'Universal Principles of Design' (Lidwell, Holden, Butler, 2003) and the broader HCI literature (Norman, Miller, Nielsen, Krug).
Use this skill when scoping a roadmap, prioritizing features, planning an MVP, or deciding what to ship and what to defer. Trigger when the user asks "what should we build next?", "is this feature worth it?", "should we ship feature X?", or when reviewing a feature backlog. Sub-aspect of `80-20-rule`; read that first.
Use this skill when scoping a redesign or refactor — choosing which existing surfaces deserve full attention and which can be left mostly alone. Trigger when the user asks "where should we focus our redesign?", "do we need to redo all of this?", or when planning incremental design improvements with limited capacity. Sub-aspect of `80-20-rule`; read that first.
Use this skill whenever the design has many features, controls, or content elements and decisions about which to prioritize matter — feature roadmaps, redesign scoping, IA decisions, dashboard design, settings page audits, marketing content prioritization, or any design with many candidates competing for attention. Trigger when the user asks "what should we focus on?", "should we add another feature?", "what can we cut?", or when reviewing a UI cluttered with rarely-used controls. The 80/20 rule (Pareto principle) is one of the foundational principles in 'Universal Principles of Design' (Lidwell, Holden, Butler 2003) and one of the most quoted across design, business, and engineering.
Use this skill when designing or fixing long forms that ask the user for many fields — sign-up flows, profile setup, settings panels, checkout, intake forms, applications. Trigger when forms exceed ~6 fields, when users complain forms are "too long," when seeing high mid-form drop-off, or when picking how to break a form into sections. Sub-aspect of `chunking`; read that first.
Use this skill when designing inputs or displays for numeric strings — phone numbers, OTP / verification codes, credit card numbers, account IDs, license keys, currency, dates, social security numbers. Trigger when picking a format for displaying numbers, designing OTP entry UIs, or formatting identifiers in tables and receipts. Sub-aspect of `chunking`; read that first.
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
A cross-agent skill marketplace of 42 framework-agnostic UX & product-design principles, drawn from Universal Principles of Design (Lidwell, Holden, Butler, 2003) and the broader design and HCI research literature.
Getting Started · Architecture · Principle Index · How Skills Trigger · Attribution · Contributing
A working library of design principles, packaged as portable Agent Skills plus native plugin metadata for Claude Code, Codex, and Cursor. Install one or more plugins and your agent gains access to curated skills that fire automatically whenever you work on UX, UI, or product design — regardless of design system, SDK, framework, or platform.
Each principle is built as a reference-grade entry: a router-style SKILL.md (~350–500 lines), 2–4 sub-aspect skills for context-specific application (~200–300 lines each), and per-skill references/ deep-dive files with origins, research lineage, and worked patterns. The result is a library an agent can apply with the same depth as a senior designer who has internalized the canon.
Many products today are built and reviewed by AI agents. The quality of their design judgment depends heavily on what they've been taught to attend to. Without a working library of principles, an agent will produce designs that are competent on average but blind in specific ways — the typography will drift, hierarchy will collapse on the third screen, the error states will be afterthoughts, the interaction patterns will be inconsistent across surfaces.
This marketplace gives your agent the same canon that experienced designers have internalized over years. Instead of one giant prompt, the canon is split across five composable plugins so you can install only what you need:
| Plugin | What it teaches | Skills |
|---|---|---|
| Perception & Hierarchy | How the eye groups elements, where it lands first, what makes a composition read as ordered | 34 |
| Cognition & Learnability | Mental models, complexity reduction, memory load, how new users get oriented | 33 |
| Interaction & Control | Affordance, feedback, errors, user agency, Fitts's Law for touch targets | 29 |
| Aesthetics & Emotion | Beauty, perceived quality, brand voice, flow, persuasive form | 17 |
| Process & Robustness | Iteration, accessibility, reliability under stress, what to prune | 24 |
Each plugin contains a router skill (which triggers on the plugin's category and points the agent at the right principle), one main skill per principle, and 2–4 sub-aspect skills for principles whose application varies meaningfully by context (e.g., Hick's Law has different shapes in menus vs. defaults vs. pricing).
Pick the agent you actually use. The same skills/<skill-name>/SKILL.md folders are the source of truth for every install path; only the plugin manifest or destination directory changes.
| Agent | Best install path | This repo provides |
|---|---|---|
| Claude Code | Native plugin marketplace | .claude-plugin/marketplace.json and per-plugin .claude-plugin/plugin.json |
| Codex | Native plugin marketplace, or direct Agent Skills | .agents/plugins/marketplace.json and per-plugin .codex-plugin/plugin.json |
| Cursor | Cursor plugin flow, or project rules fallback | .cursor-plugin/marketplace.json and per-plugin .cursor-plugin/plugin.json |
| Gemini CLI | Link or copy Agent Skills | Plain skills/*/SKILL.md folders |
| Copilot, Windsurf, and other agents | Native rules or AGENTS.md fallback | Portable skill folders plus a compact rule/instruction pattern |
The packaging follows the Agent Skills open format, where each skill is a folder containing SKILL.md and optional supporting files.
In Claude Code, add this repository as a plugin marketplace and install the plugins you want:
npx claudepluginhub hdeibler/universal-design-principles --plugin cognition-and-learnability-principlesFramework-agnostic design principles for interaction, affordance, feedback, errors, and user control. Covers Fitts's Law, Affordance, Forgiveness, Feedback Loop, Errors, Constraint, Mapping, Expectation Effect, and Control. Drawn from the interaction-related entries of 'Universal Principles of Design' (Lidwell, Holden, Butler, 2003) and the broader HCI literature (Fitts, Norman, Nielsen heuristics, Cooper).
Framework-agnostic design principles for aesthetics, perceived quality, brand personality, and emotional response. Covers Aesthetic-Usability Effect, Archetypes, Form Follows Function, Wabi-Sabi, Exposure Effect, and Immersion. Drawn from the aesthetic and emotion-related entries of 'Universal Principles of Design' (Lidwell, Holden, Butler, 2003) and the broader design and consumer-psychology literature.
HDeiblerFramework-agnostic design principles for visual perception and hierarchy: how the eye groups elements, where it lands first, and what makes a composition read as ordered. Covers Hierarchy, Proximity, Signal-to-Noise Ratio, Color, Alignment, Legibility, Readability, Gestalt Similarity, Closure, and Figure-Ground Relationship. Drawn from the perception-related entries of 'Universal Principles of Design' (Lidwell, Holden, Butler, 2003) and the broader Gestalt and visual-design research literature.
Framework-agnostic design principles for design process, accessibility, iteration, and robustness against edge cases. Covers Accessibility, Iteration, Factor of Safety, Prototyping, Weakest Link, Scaling Fallacy, and Ockham's Razor. Drawn from the process-related entries of 'Universal Principles of Design' (Lidwell, Holden, Butler, 2003) and the broader engineering and inclusive-design literature (WCAG, Maeda, Cooper, Petroski).
Production-ready backend project generator and infrastructure toolkit. Generate Express + TypeScript + PostgreSQL + Redis projects with multi-tenant architecture, then maintain them with automated reviews, entity generation, and infrastructure tending.
HDeiblerComplete creative writing suite with 10 specialized agents covering the full writing process: research gathering, character development, story architecture, world-building, dialogue coaching, editing/review, outlining, content strategy, believability auditing, and prose style/voice analysis. Includes genre-specific guides, templates, and quality checklists.
greyhaven-aiComprehensive skill pack with 66 specialized skills for full-stack developers: 12 language experts (Python, TypeScript, Go, Rust, C++, Swift, Kotlin, C#, PHP, Java, SQL, JavaScript), 10 backend frameworks, 6 frontend/mobile, plus infrastructure, DevOps, security, and testing. Features progressive disclosure architecture for 50% faster loading.
JeffallanThis skill should be used when users need to generate ideas, explore creative solutions, or systematically brainstorm approaches to problems. Use when users request help with ideation, content planning, product features, marketing campaigns, strategic planning, creative writing, or any task requiring structured idea generation. The skill provides 30+ research-validated prompt patterns across 14 categories with exact templates, success metrics, and domain-specific applications.
Jamie-BitFlightDevelop, test, build, and deploy Godot 4.x games with Claude Code. Includes GdUnit4 testing, web/desktop exports, CI/CD pipelines, and deployment to Vercel/GitHub Pages/itch.io.
Randroids-DojoA growing collection of Claude-compatible academic workflow bundles. Covers scientific figures, manuscript writing and polishing, reviewer assessment, citation retrieval, data availability, paper reading, literature search, response letters, paper-to-PPTX conversion, and evidence-grounded Chinese invention patent drafting. Rules are organized as reusable skill folders with explicit workflows and quality checks.
Yuan1z0825Upstash Context7 MCP server for up-to-date documentation lookup. Pull version-specific documentation and code examples directly from source repositories into your LLM context.
upstash