디자이너를 위한 컨텍스트 엔지니어링
핵심 요약
AI 도구(Claude 등)를 활용해 UI를 디자인할 때 만족스러운 결과물을 얻기 위해서는 단순 프롬프트 입력이 아니라 디자인 결정 사항(맥락/Context)을 읽을 수 있는 문서화된 데이터로 제공해야 한다는 지침을 담은 글입니다.
주요 내용
1. AI 모델의 한계 (LLMs 101)
- LLM은 '고급 자동 완성 기능'에 가까우므로 사전 맥락이 없는 작업을 주면 단순 확률(다음 토큰 예측)로 빈칸을 채워 형편없는 결과를 냅니다.
- 팀 내에서 내린 디자인 결정과 판단 기준을 AI가 이해할 수 있는 맥락으로 전달해야 원하는 결과물의 80~20% 간극을 메울 수 있습니다.
2. 디자인 결정의 문서화
- 대부분의 디자인 결정은 디자이너의 암묵지나 리뷰 과정에서 즉흥적으로 정해질 뿐 제대로 문서화되지 않습니다.
- LLM은 읽을 수 있는 언어를 기반으로 동작하므로 design principles, interaction rules 등은 Markdown으로, 간격·색상·타이포그래피 등 정량적 토큰 값은 TOML, YAML, JSON 등 구조화된 파일로 정리해야 합니다.
3. 컨텍스트 파일의 구조 및 관리
- 맥락 파일은 작고 명확하게 나누어 관리해야 AI가 맥락을 잃거나 오류를 일으키지 않습니다. (예: `principles.md`, `card.md`, `tokens.toml` 등)
- 원칙: 디자인 결정 사항이 두 번 이상 반복되어 나타난다면, 즉시 구조화된 컨텍스트 문서로 추출하여 유지 관리해야 합니다.
4. 원샷(One-shot) 디자인 완성력 향상
- 혜안이 담긴 메타데이터를 충실히 제공하면 프롬프트를 길게 쓰지 않더라도 AI 에이전트가 완벽하게 의도를 파악하고 뛰어난 UI 디자인 결과를 일회성에 출력해 냅니다.
