| ํญ๋ชฉ | ๋ด์ฉ |
|---|---|
| Invoke | /ui-responsive-audit |
| argument-hint | [screen or feature name to audit] |
/ui-responsive-audit โ ๋ฐ์ํ ์ ๊ฒ#
ํ๋ง๋๋ก#
์ด๋ฏธ ๋ง๋ ํ๋ฉด์ด ํด๋ํฐยทํ๋ธ๋ฆฟยทPC ๋ฑ ์ฌ๋ฌ ํ๋ฉด ํฌ๊ธฐ์์๋ ์ ์๋ํ๋์ง ํ๋์ฉ ์ ๊ฒํ๊ณ , ๋ฌธ์ ์ ๊ฐ์ ๋ฐฉ๋ฒ์ ์ ๋ฆฌํ ๋ณด๊ณ ์๋ฅผ ๋ง๋ค์ด์ค๋๋ค.
๋๊ฐยท์ธ์ ์ฐ๋์#
- ํ๋ฉด์ ๋ค ๋ง๋ ๋ค ์ฌ๋ฌ ๊ธฐ๊ธฐ ํฌ๊ธฐ์์ ์ ๋๋ก ๋ณด์ด๋์ง ํ์ธํ๊ณ ์ถ์ ๋
- ์ฌ์ฉ์๊ฐ ํน์ ํ๋ฉด ํฌ๊ธฐ์์ ๋ ์ด์์์ด ๊นจ์ง๋ค๊ณ ์ ๋ณดํ์ ๋
๋ฌด์์ ํด์ฃผ๋์#
- ํ๋ฉด ํฌ๊ธฐ ๊ตฌ๊ฐ(๋ธ๋ ์ดํฌํฌ์ธํธ)๋ณ ๋ ์ด์์, ๊ธ์ ํฌ๊ธฐ, ์ฌ๋ฐฑ, ์๊ฐ์ ์ฐ์ ์์, ํฐ์น ๋ฒํผ ํฌ๊ธฐ๋ฅผ ์ ๊ฒํฉ๋๋ค.
- ๋ฐ๊ฒฌํ ๋ฌธ์ ์ ํ๋ฉด ํฌ๊ธฐ๋ณ ํต๊ณผ/์คํจ ์ฌ๋ถ, ๊ณ ์น๋ ๋ฐฉ๋ฒ์ ๋ด์ ๋ณด๊ณ ์๋ฅผ ์ ๊ณตํฉ๋๋ค.
โ๏ธ ์์ธ ์ต์ ยท์คํ ๋ช ์ธ (๊ฐ๋ฐ์ / AI ์์ด์ ํธ์ฉ)
/ui-responsive-audit#
Audit a design for responsive behavior.
Steps#
- Breakpoints โ Review behavior at each breakpoint using
ui-responsive-layoutskill. - Grid โ Check layout grid compliance using
ui-layout-gridskill. - Typography โ Verify type scaling using
ui-typography-scaleskill. - Spacing โ Check spacing consistency using
ui-spacing-systemskill. - Hierarchy โ Verify hierarchy holds at all sizes using
ui-visual-hierarchyskill. - Touch targets โ Verify minimum sizes for touch using
ui-responsive-layoutskill. - Report โ Document findings with recommendations.
Output#
Responsive audit report with findings per breakpoint, compliance status, and remediation recommendations.
Consider following up with /ui-design-screen to redesign problem areas.