gui-design-principles

Overview

This skill provides essential design principles, patterns, and guidelines for developing high-quality graphical user interfaces. It encompasses visual design, user experience, accessibility, and modern UI/UX best practices across web, desktop, and mobile platforms.

Design Foundations

Core Design Principles

Visual Hierarchy

• Establish clear information hierarchy with size, weight, and spacing
• Use contrast to guide attention to important elements
• Implement progressive disclosure for complex interfaces
• Follow the "F-Pattern" and "Z-Pattern" for natural eye movement

Color Theory

• Use limited color palettes (3-5 primary colors maximum)
• Ensure sufficient contrast ratios (WCAG AA: 4.5:1, AAA: 7:1)
• Implement consistent color meanings across the interface
• Use color purposefully for branding, actions, and feedback