crit-elevation-shape

Evaluate elevation and shape language in UI design critiques.

3|Updated Feb 23, 2026
One-click install
npx skills add https://github.com/metedata/design-crit --skill crit-elevation-shape
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: crit-elevation-shape
Source: https://github.com/metedata/design-crit/tree/main/skills/crit-elevation-shape
Command: npx skills add https://github.com/metedata/design-crit --skill crit-elevation-shape

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Enables design critiques to methodically evaluate depth, layering, elevation systems, surface treatments, and shape language to communicate hierarchy and brand tone.

Core Features & Use Cases

  • Provides a structured framework for evaluating elevation, shadow systems, and border radii across UI components.
  • Supplies evaluative criteria and visual specimen guidance to discuss trade-offs between flat, subtle, dramatic, and glass-like depth.
  • Supports iterative refinement of an elevation+shape system aligned with a design brief and locked layout.

Quick Start

Generate 2-4 elevation and shape system options and provide a concise critique for each.

Frequently Asked Questions about crit-elevation-shape

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

FAQPage Schema
How do I evaluate elevation and shape language in UI design critiques?

To evaluate elevation and shape language in UI design, apply a structured framework to assess depth hierarchy, shadow consistency, and border radii across components. This methodically reveals surface treatments and layering trade-offs between flat, subtle, and dramatic depth options.

What is an elevation system and when do I need a shadow system for components?

An elevation system defines depth hierarchy using shadow scales and surface treatments to communicate brand tone. You need a shadow system when comparing multiple UI components requires consistent layering, visual structure, and clear hierarchical separation across the interface.

How do I critique border radius scales and surface treatments?

To critique border radius scales and surface treatments, generate 2-4 shape system options and evaluate each against defined criteria for hierarchy and accessibility. This iterative refinement ensures alignment with your design brief and locked layout.

What's the best way to compare flat versus dramatic depth strategies in UI?

The best way to compare flat versus dramatic depth strategies is using a structured evaluation framework that supplies visual specimen guidance and criteria to discuss trade-offs. This methodically aligns depth choices with your design brief and brand tone.

Do I need a locked layout to evaluate depth hierarchy and shape language?

Yes, evaluating depth hierarchy and shape language requires a locked layout and a structured evaluation framework. Defining a specific number of elevation levels, a radius scale, and criteria for accessibility ensures consistent shadow and surface treatment comparisons.