ui-ux-principles

Apply UI/UX design principles to create intuitive interfaces.

3|1|Updated Feb 2, 2026
One-click install
npx skills add https://github.com/HouseGarofalo/claude-code-base --skill ui-ux-principles-housegarofalo
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux-principles
Source: https://github.com/HouseGarofalo/claude-code-base/tree/main/.claude/skills/ui-ux-principles
Command: npx skills add https://github.com/HouseGarofalo/claude-code-base --skill ui-ux-principles-housegarofalo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a comprehensive guide to applying core UI/UX design principles, enabling the creation of intuitive, visually appealing, and user-centered interfaces.

Core Features & Use Cases

  • Visual Hierarchy: Guides users to important content through size, weight, and spacing.
  • Color Theory & Accessibility: Defines semantic color systems and ensures contrast ratios for readability.
  • Typography: Establishes a type scale and best practices for readable text.
  • Gestalt Principles: Leverages proximity, similarity, and continuity for cohesive design.
  • Usability Heuristics: Implements principles like visibility of system status and error prevention.
  • Layout Principles: Applies concepts like the Rule of Thirds and F/Z patterns.
  • Feedback Patterns: Defines states and transitions for interactive elements.

Quick Start

Apply the UI/UX design principles to create a clear visual hierarchy for a web application's main dashboard.

Frequently Asked Questions about ui-ux-principles

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I apply visual hierarchy to improve user interface design?

Visual hierarchy in user interface design guides users to important content through strategic use of size, weight, and spacing. Applying these principles ensures layout planning directs attention effectively across web and mobile platforms.

What are the core usability heuristics for creating intuitive user experiences?

Core usability heuristics for intuitive user experiences include implementing visibility of system status and error prevention. These user-centered design principles help create polished, accessible interfaces across web and mobile applications.

How do I use Gestalt principles and color theory for accessible UI layouts?

Use Gestalt principles like proximity, similarity, and continuity for cohesive UI layouts. Combine this with semantic color systems and proper contrast ratios from color theory to ensure accessibility and readability in your design.

What is the best way to establish typography and spacing systems for web and mobile platforms?

The best way to establish typography and spacing systems is by defining a consistent type scale and applying layout principles like F and Z patterns. This ensures readable text and polished user experiences across platforms.

Can I use these UX design principles for dashboard layout planning?

Yes, you can use these UX design principles for dashboard layout planning. Applying visual hierarchy and user-centered design concepts helps create clear, intuitive interfaces that effectively organize complex information for users.

How do I design feedback patterns and interactive states for user interfaces?

Design feedback patterns by defining clear states and transitions for interactive elements. This visual hierarchy approach ensures users receive immediate visual confirmation, improving overall usability and user experience.