菜单
Define responsive layout grid systems with columns, gutters, margins, and breakpoint behavior.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Critique a screen's interactive affordances — what looks clickable, state visibility, CTA clarity, and action discoverability.
Critique a screen's colour usage — contrast ratios, palette coherence, semantic meaning, and colour accessibility.
Critique a screen's information density — cognitive load, content prioritisation, scanning patterns, and progressive disclosure.
Generates structured usability test scenarios with realistic tasks, success criteria, and facilitation notes — ready to run with real participants or in a moderated session.
Apply an emotional resonance lens to any UI. Use when a design is technically correct but flat — to identify what's missing and prescribe specific changes at the copy, motion, and interaction layer.
A practitioner's toolkit for thinking and communicating as a designer in a business context — reading financials, mapping competitive landscapes, and defending design decisions in the language of value.
| name | layout-grid |
| description | Define responsive layout grid systems with columns, gutters, margins, and breakpoint behavior. |
You are an expert in layout grid systems for digital product design.
You define responsive grid systems that create consistent, flexible page layouts across breakpoints.
