design-foundations

Diagnose design problems using the five planes model from strategy to surface.

42|5|Updated Mar 8, 2026
One-click install
npx skills add https://github.com/kazdenc/builder-skills --skill design-foundations
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-foundations
Source: https://github.com/kazdenc/builder-skills/tree/main/.claude/skills/design/frameworks/design-foundations
Command: npx skills add https://github.com/kazdenc/builder-skills --skill design-foundations

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a structured framework for understanding and applying the five planes of user experience, helping you design and evaluate products more effectively from strategy to surface.

Core Features & Use Cases

  • End-to-End Product Design: Apply the five planes model (Strategy, Scope, Structure, Skeleton, Surface) to guide design decisions.
  • Problem Diagnosis: Identify the root cause of design issues by pinpointing the affected plane.
  • Use Case: When a product feels confusing, use this Skill to analyze if the problem lies in unclear objectives (Strategy), missing features (Scope), poor navigation (Structure), confusing layout (Skeleton), or unappealing visuals (Surface).

Quick Start

Use the design-foundations skill to understand the five planes of user experience.

Frequently Asked Questions about design-foundations

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

FAQPage Schema
What are the five planes of UX design and how do they structure product design?

The five planes of UX design—Strategy, Scope, Structure, Skeleton, and Surface—provide a hierarchical framework to build user-centered products by defining objectives, features, information architecture, interaction design, and visual presentation from bottom to top.

How do I diagnose where a product design problem is originating?

To diagnose a product design problem, analyze the five UX planes to pinpoint if the root cause lies in unclear objectives (Strategy), missing features (Scope), poor navigation (Structure), confusing layout (Skeleton), or unappealing visuals (Surface).

How do I apply a UX design framework to guide iterative product development?

Apply the five planes UX design framework iteratively by defining user needs and product objectives first, then moving upward through scope, structure, skeleton, and surface to guide each phase of user-centered product decisions.

Can I use the five planes model to evaluate existing user experience issues?

Yes, the five planes model is designed for evaluating existing products by systematically tracing user experience issues back to their foundational layer, whether that is a strategy misalignment or a surface-level visual inconsistency.

When should I use a structured design strategy framework instead of jumping straight into visual design?

Use a structured design strategy framework when a product feels confusing or lacks clear direction, ensuring that visual design decisions on the surface align with underlying user needs, features, and information architecture defined in the lower planes.