/cc-designer:critique-screen — 화면 전체 시각 크리틱 9종 세트
화면에 대해 시각 크리틱 9종(위계·브랜드·구도·타이포·색·어포던스·정보 밀도·고유성·절제)을 모두 실행하고, 우선순위가 매겨진 수정 목록을 출력합니다. 출시 전에 화면을 전방위로 점검하거나 AI 가 저작한 시안을 검수할 때 씁니다.
| 항목 | 내용 |
|---|---|
| 실행 명령 | /cc-designer:critique-screen |
| 인자 | [screen name, Figma URL, or image — e.g., 'onboarding step 2' or a screenshot] |
한마디로#
화면 하나를 놓고 시각 위계, 브랜드, 구도, 타이포, 색상, 어포던스, 정보 밀도에 더해 **이 서비스여야만 하는 화면인지(고유성)**와 **지워도 되는 요소가 없는지(절제)**까지 총 9가지 관점으로 한 번에 점검해서, 우선순위가 매겨진 수정 목록을 뽑아주는 명령어입니다.
누가·언제 쓰나요#
- 디자이너나 PM이 화면 시안(스크린샷, Figma 링크 등)을 놓고 종합적인 디자인 리뷰를 받고 싶을 때
- 출시 전에 화면을 꼼꼼하게 전방위로 점검하고 싶을 때
- AI 가 저작한 시안을 검수할 때 — 규칙을 다 지켜도 '어느 앱에나 들어갈 화면'이 나올 수 있어서, 고유성·절제 렌즈가 그것을 잡습니다. 이때는 화면을 만든 에이전트가 아니라 별도 에이전트로 돌립니다
무엇을 해주나요#
- 9가지 크리틱(시각 위계·브랜드·구도·타이포·색상·어포던스·정보 밀도·고유성·절제)을 모두 실행합니다.
- 발견된 문제를 P1(치명)/P2(중요)/P3(다듬기) 순으로 정리한 하나의 목록으로 모아줍니다.
- 브리프에 결정 정보(가장 중요한 행동을 하는 순간 확인해야 하는 사실 — 도착 날짜, 남는 횟수 같은)가 있으면 그 화면에 다 있는지 먼저 확인하고, 빠졌거나 다른 형태로 그려진 것은 어느 관점에서 나왔든 P1 로 올립니다.
- 화면에서 가장 강한 부분과 가장 약한 부분을 한 문단으로 요약해 줍니다.
-
--quick: 어포던스·정보 밀도·시각 위계 3종만 빠르게 점검합니다 (UX 중심 축약 크리틱, 구/designer:critique-ux흡수).
⚙️ 상세 옵션·실행 명세 (개발자 / AI 에이전트용)
Run a full visual critique of a screen across hierarchy, brand, composition, typography, colour, affordance, information density, specificity, and restraint.
--quick mode: run only steps 1 (hierarchy), 6 (affordance), and 7 (information density), then prioritise — the UX-focused subset formerly exposed as /designer:critique-ux.
Independence#
Critique what is on the screen, not what the author meant. When the screen was authored by an agent, run this command in a separate context (another subagent) that receives only the rendered screenshot, the brief, and the tokens — not the author's rationale or decision records. An author grading its own output drifts toward justifying its choices, and the specificity lens in particular cannot be answered by someone who knows why each element was placed. Justifying a flagged item is a later step, done by the author against the finished list.
Steps#
- Visual hierarchy — Analyse entry point, eye flow, weight, and emphasis using
critique-visual-hierarchyskill. - Brand consistency — Check mood, voice, and token alignment using
critique-brand-consistencyskill. - Composition — Evaluate balance, whitespace, rhythm, and gestalt using
critique-compositionskill. - Typography — Audit scale, readability, consistency, and token compliance using
critique-typographyskill. - Colour — Audit contrast ratios, palette coherence, semantic colour use, and accessibility using
critique-colorskill. - Affordance — Evaluate clickability signals, state visibility, CTA clarity, and action discoverability using
critique-affordanceskill. - Information density — Assess cognitive load, content priority, scanning patterns, and progressive disclosure using
critique-information-densityskill. If the brief lists decision facts — what a person must confirm at the moment of the primary action — check each one on the decision screens the brief names. - Specificity — Name three elements that only make sense for this service, judge the screen with colour and logo removed, and find defaults nobody chose, using
critique-specificityskill. - Restraint — Run the deletion test on every element (what does the user lose if it is removed?) and judge each as delete / merge / keep, using
critique-restraintskill. - Prioritise — Collect every flagged issue from all nine critiques and rank them:
- P1 — Critical: Breaks usability, accessibility, or brand compliance; fix before shipping. A
major issueon specificity is P1 — a screen that could belong to any product fails brand compliance. A decision fact from the brief that is missing from a decision screen, or drawn in a different form than the brief states (a duration where it says a date), is P1 whichever lens found it — even when that lens would call it polish. Left as P3, it ships: the person reaches the primary action without the fact they needed to take it. - P2 — Important: Degrades experience or creates inconsistency; fix in current sprint. A
major issueon restraint is P2 unless the excess hides the primary action or key information, which makes it P1. - P3 — Polish: Minor visual refinement; address when capacity allows.
Output#
A single prioritised fix list grouped by priority level. Each item includes:
- Issue: what is wrong
- Dimension: which critique area it belongs to (Hierarchy / Brand / Composition / Typography / Colour / Affordance / Density / Specificity / Restraint)
- Fix: the specific change required
If the brief lists decision facts, open the list with them — each fact, the decision screen, and
present/missing/different form; every one that is notpresentis a P1 item. Start the specificity section with the three service-specific elements (leave a slot empty when it cannot be filled). Conclude with a one-paragraph overall assessment noting the strongest and weakest dimension.