product-design
Turn a vague product ask ("this page feels wrong", "we need a team view") into a grounded, shippable design by establishing business semantics and the user task before proposing a surface. Use when scoping a new surface, redesigning an existing one, or deciding what a feature should be. Not for auditing a built screen (ux-audit) or choosing visual details (ux).
npx skills add lobehub/lobehub --skill product-design --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# Product Design Decide **what to build and why** before arguing about spacing. Two rules are non-negotiable: > **Never design from the surface. Establish what the business actually models > first.** > **Never turn the business model into the information architecture. The domain > constrains what the surface may claim; the user's retrieval and decision task > determines how the surface is organized.** (`P-14`) This skill handles product meaning first. It may hand a grounded frame to `ux` or `design-prototype`, but discovery does not require implementation or a prototype. Strip out every framework, table and component name: if no product insight remains, the finding belongs in an engineering skill. ## Relationship to other skills | Skill | Question | When | | ------------------------------------------------ | --------------------------------------------- | --------------------------- | | **product-design** | What should this surface be, and why? | Before or during framing | | [ux](../ux/SKILL.md) | How should the interaction behave and feel? | While designing or building | | [ux-audit](../ux-audit/SKILL.md) | Does the built surface honor those rules? | After it exists | | [design-pr
- Relationship to other skills
- Select the smallest run mode
- Step 1 — Ground the business model
- Step 2 — Frame the user's view model
- Step 3 — Diagnose the structural error
- Step 4 — Align decisions by dependency
- Step 5 — Prototype when it resolves uncertainty
- Step 6 — Scope honestly
- Close — record coverage and propose learning
- Deliverables
- Anti-patterns
What does the product-design skill do?
Turn a vague product ask ("this page feels wrong", "we need a team view") into a grounded, shippable design by establishing business semantics and the user task before proposing a surface. Use when scoping a new surface, redesigning an existing one, or deciding what a feature should be. Not for auditing a built screen (ux-audit) or choosing visual details (ux).
How do I install it?
Run `npx skills add lobehub/lobehub --skill product-design --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From lobehub/lobehub, a repository with 81,252 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.