# AI 티 안 나는 웹사이트, 이 순서로 만드세요

기준 파일 → 시안 → 구현 → 실제 화면 확인 → 접근성 검사. 디자인 스킬을 겹치지 않게 쓰는 순서를 정리했습니다.

- 종류: 가이드 · 분류: 디자인

출처: 딸깍코드 https://ddalkkak.ssemgong.com/p/design-skill-stack

## 순서

1. **기준 파일** — 색·글꼴·간격을 적은 `DESIGN.md`를 먼저 만들어 두고 매번 읽게 합니다.
2. **시안** — 바로 코드로 가지 말고 여러 안을 그려 보고 고릅니다.
3. **구현** — [frontend-design](/p/frontend-design) 같은 스킬로 «템플릿 기본값»을 피합니다.
4. **실제 화면 확인** — 브라우저로 열어 보게 합니다([Playwright MCP](/p/playwright-mcp)).
5. **검사** — 포커스·대비·폼 같은 접근성 규칙을 마지막에 점검합니다.

## 핵심

스킬이 정한 «취향»과 내 브랜드 색이 부딪히면 **내 기준 파일이 이깁니다.** 스킬은 기본값일 뿐입니다.