layers-intro

layers-intro is a skill for Claude Code, Codex from jamiemill/layers-skills. It costs 24 tokens per session (1,996 once invoked), scanned C, original, MIT.

A starting guide to the Layers of Product Design, a framework for organising design work from understanding reality and user needs through to the interface people see. It explains the seven layers and how they depend on one another.

In plain words
What is it for?
Use it at the beginning of a design session to understand the framework, its terms, and the order in which its layers relate.
Why use it?
It gives design sessions shared context before other Layers skills are used. This helps keep interface decisions connected to user needs and the underlying product concept.

Skill for Claude CodeCodex

Written for no agent in particular: nothing here depends on one.

Good fit Use it at the beginning of a design session to understand the framework, its terms, and the order in which its layers relate.

Compare 6 skills from other repositories ↓
Install with agentmods
npx agentmods add skills/jamiemill/layers-skills/layers-intro
Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

Any agent
npx skills add jamiemill/layers-skills --skill layers-intro
Clone the repo
git clone --depth 1 https://github.com/jamiemill/layers-skills

Made for: Claude Code, Codex.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for layers-intro

README.md
[![agentmods](https://agentmods.dev/badge/skills/jamiemill/layers-skills/layers-intro/github.svg)](https://agentmods.dev/skills/jamiemill/layers-skills/layers-intro)
Your own site
<a href="https://agentmods.dev/skills/jamiemill/layers-skills/layers-intro"><img src="https://agentmods.dev/badge/skills/jamiemill/layers-skills/layers-intro/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

agentmods 80×15 button for layers-intro

Your own site · 80×15
<a href="https://agentmods.dev/skills/jamiemill/layers-skills/layers-intro"><img src="https://agentmods.dev/badge/skills/jamiemill/layers-skills/layers-intro.svg" alt="Reviewed on agentmods" width="80" height="20"></a>
Per session 24 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 1,996 The whole file, excluding the scripts and references it only reads on demand.
Security scan C 1 finding. A grade says what 26 rules found in the file — not that it is safe. Third-party audits
  • Socket pass 3 May 2026
  • Snyk pass 3 May 2026
How audits are shown
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00024 $0.01996
Opus 5 $0.00012 $0.00998
Sonnet 5 $0.00005 $0.00399
Haiku 4.5 $0.00002 $0.00200

Measured 10d ago against content hash 724549b81bc5, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-09, from the pricing page.

Security

Grade C, and why

layers-intro scanned grade C with 1 finding against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 10d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Tells the agent never to refusehighAnti-refusal

Suppressing the ability to decline removes a core safety control; a later harmful request then succeeds.

10. **Push forward, pull back.** The layers aren't a one-way climb. When the work at a layer feels unjustified or floating — you're elaborating structure with no clear reason to — it's often because you can't yet see wha
skills/layers-intro/SKILL.md · 126 lines

How it starts

The opening of the file, as written. The whole thing — 126 lines — stays where its author put it; the contents beside it link to each section on GitHub.

/layers-intro

Load this skill at the start of any design session. It provides the framework context that all other /layers-* skills depend on.


The framework

Layers of Product Design organises design work into seven layers across three zones. Layers have logical dependency: lower layers are foundations for upper ones. Weak lower layers create UX debt that propagates upward.

Reality — complex, contradictory, evolving. Source of all learning.

Problem space — knowledge gathered from reality:

  1. Observed behaviour — what users actually do
  2. The domain — concepts, terminology, and mental models that exist independently of any product
  3. User needs — what we think users are trying to achieve, and why

Solution space — deliberate decisions about what to build: 4. Product & service strategy — which needs to serve, and what business outcomes to target 5. Conceptual model — objects, relationships, states, vocabulary — independent of any interface 6. Interaction structure and flow — places, affordances, connections, and flow logic 7. Surface — words, visuals, feedback, hierarchy — what users actually encounter

The layers are not a linear process. Enter anywhere — but always check whether the foundations below are sound.

Inspired by Jesse James Garrett's The Elements of User Experience (2000).


Design is decision-making

Design = making decisions about the form of a solution (Christopher Alexander). Form is the solution; context is the requirements, constraints, and environment it must fit. Good design is good fit.

Four kinds of progress:

  1. Making decisions — resolving something undecided
  2. Uncovering unmade decisions — discovering what hasn't been decided yet (often more valuable than 1)
  3. Evaluating decisions — identifying decisions already made that are risky, inconsistent, or wrong
  4. Prioritising decisions — lower layers are more foundational and carry more risk if wrong

The job of every skill is to help the designer make better decisions — not to make decisions for them.

Read the full file on GitHub · 126 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 10d ago First seen · 126 lines · 24 tokens per session scan C 724549b81bc5

Subscribe to this mod's changes

layers-intro is a skill published in the GitHub repository jamiemill/layers-skills (299 stars, last pushed 3mo ago), licensed MIT. It adds 24 tokens to every session and 1,996 once invoked, about $0.0001 per session on Opus 5. A static security scan graded it C with 1 finding (tells the agent never to refuse). No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other skills, from other repositories

webgl-holographic-foil

A self-contained WebGL2 hero: thin-film interference over a crushed-foil surface whose palette shifts with the viewing angle; move the cursor to tilt the film.

nexu-io/open-design · 41 tokens

html-ppt-hermes-cyber-terminal

OpenDesign + BYOK: choosing and wiring your own model, hands-on — cost, quality, and the routing decision. Built as a decision-grade AI literacy deck for engineers, IT, applied-AI teams.

nexu-io/open-design · 53 tokens

html-ppt-taste-brutalist

16:9 HTML deck in tactical-telemetry / CRT-terminal taste. Deactivated-CRT charcoal slides, white-phosphor monospace, hazard-red accent, scanline overlay, ASCII syntax, density over decoration. Distilled from Leonxlnx/taste-skill brutalist-skill (Tactical Telemetry mode).

nexu-io/open-design · 78 tokens

visual-ralph

Visual Ralph orchestration for frontend UI from generated references, static references, or live URL targets, using $ralph with built-in visual verdict and pixel-diff evidence until the implementation matches and leaves a reproducible design system.

Yeachan-Heo/oh-my-codex · 50 tokens

accessibility

Consolidated accessibility skill entrypoint for WCAG 2.2, ARIA Authoring Practices, cognitive accessibility, Section 508, EN 301 549, design intent verification, and the Accessibility Planner workflow.

microsoft/hve-core · 47 tokens

make-resume

A Chinese-language tool for creating editable HTML resumes that can be changed in a browser and printed to PDF. It uses available resume templates when they are installed and otherwise provides a simpler fallback.

Hisn00w/ASu-skills · 86 tokens