UI Design

Professional web interfaces through systematic layouts, clear visual hierarchy, and consistent components.

Scope

Use this skill when: You are creating layouts, designing UI components, establishing visual hierarchy, defining grid systems, building styleguides or design tokens, or auditing existing interfaces for visual consistency.

Principles

1. User-Centered Design Over Aesthetics

Every design decision is guided by the needs of the target audience. An interface that is visually impressive but poorly usable has failed.

2. Visual Hierarchy Determines Perception

Size, color, contrast, and position control what users see first. Every page needs exactly ONE primary focal point.

3. Consistency Builds Trust

Identical elements must look and behave identically everywhere. Inconsistency increases cognitive load.