design-principles

Explain perceptual and cognitive design principles with a decision checklist.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/Git-Fg/taches-principled-light --skill design-principles-git-fg
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-principles
Source: https://github.com/Git-Fg/taches-principled-light/tree/main/skills/design-principles
Command: npx skills add https://github.com/Git-Fg/taches-principled-light --skill design-principles-git-fg

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill helps clarify the reasoning behind effective design choices, providing a foundation for making informed aesthetic decisions.

Core Features & Use Cases

  • Explain Design Principles: Delve into the perceptual and cognitive research behind white space, contrast, proximity, alignment, repetition, and visual hierarchy.
  • Decision Checklist: Offers a structured approach to evaluating design choices based on established principles.
  • Use Case: When designing a user interface, use this Skill to justify layout decisions by referencing the underlying principles of design.

Quick Start

Ask the AI, "Why does white space improve readability?"

Frequently Asked Questions about design-principles

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

FAQPage Schema
Why does white space improve readability in user interface design?

White space improves readability by leveraging perceptual principles to reduce visual clutter, allowing users to process layout elements more efficiently. It establishes visual hierarchy and contrast, guiding cognitive focus to essential content without overwhelming the viewer.

How do I evaluate design choices during a UI design review?

Evaluate design choices during a UI design review by applying a structured decision checklist based on visual hierarchy, contrast, proximity, alignment, and repetition. This ensures aesthetic reasoning is grounded in established perceptual and cognitive principles rather than subjective preference.

What are the core visual hierarchy principles for effective aesthetic reasoning?

Core visual hierarchy principles for aesthetic reasoning include white space, contrast, proximity, alignment, and repetition. These elements manipulate perceptual focus to organize user interface design elements logically, ensuring clear communication and improved user comprehension.

Can I use design principles to justify layout decisions in various media?

You can use design principles to justify layout decisions across various media by referencing the underlying cognitive and perceptual research. This approach provides a universal framework for aesthetic decision-making, ensuring visual hierarchy and contrast are optimized regardless of the specific medium.

How does proximity affect visual hierarchy in user interface development?

Proximity affects visual hierarchy in user interface development by grouping related elements together, which reduces cognitive load and clarifies relationships. This design principle leverages perceptual organization to structure information efficiently and guide user attention naturally.