Claude Code용 소유자 승인 DESIGN.md 만들기

AI 코딩 에이전트가 시각적 참고 자료를 따를 수 있는 정도는 그 자료에 담긴 결정의 명확성에 달려 있습니다. 프로젝트를 소유하고 있고 승인된 브랜드 규칙이 이미 있다면 검토할 수 있는 하나의 DESIGN.md 파일로 정리한 뒤 Claude Code로 작은 수정 두 건을 하고 직접 확인할 수 있습니다. 납품할 결과물은 승인된 명세입니다. 두 수정은 그 특정 결과물에서 명세가 유용했는지를 확인할 뿐, 이후 수정의 결과까지 입증하지는 못합니다.

이 절차는 문서를 바탕으로 합니다. BIG CHANGE는 2026년 10월 20일 특정 리비전으로 고정된 디자인 파일 모음과 Anthropic의 Claude Code 매뉴얼을 검토했습니다. Claude Code 실행, 두 결과물의 편집이나 렌더링, 비용 또는 디자인 품질 측정은 하지 않았습니다.

주요 변화

• 달라진 점: 소유자는 승인된 결정으로 버전이 기록된 시각 명세를 작성하고 범위를 제한한 수정 전에 바로 그 파일을 Claude Code에 줄 수 있습니다.
• 중요한 이유: 하나의 검증된 출처를 통해 색상, 글꼴, 배치 규칙을 실제 수정본 두 개와 비교할 수 있고, 각 결과를 받아들일지는 소유자가 결정합니다.
• 주의할 점: 수정할 때마다 먼저 파일 전체를 읽어야 합니다. 프로젝트에 파일이 있다는 사실, 경로 언급, Claude의 확언만으로 파일을 불러왔거나 따랐다는 점이 입증되지는 않습니다.

시작하기 전에

소유한 프로젝트, 수정 권한, 렌더링할 수 있는 작은 기존 결과물 두 개, 복원할 수 있는 작업 복사본 또는 버전 관리 지점이 필요합니다. 각 프로젝트의 실제 편집·렌더링 절차를 안다면 페이지 두 개 또는 페이지와 프레젠테이션 하나씩을 선택해도 됩니다. 각각 한 가지로 제한한 시각적 변경을 선택하세요. 현재 문구, 링크, 정상 작동하는 상호작용을 비교용으로 보관합니다.

소유자가 승인한 색상 값 과 그 용도, 사용 허가나 라이선스가 있는 글꼴과 대체 글꼴, 로고·이미지 사용 규칙, 대상 독자, 크기, 접근성 요구 사항을 모읍니다. 실제 승인 기록을 사용하거나 정해지지 않은 사항을 소유자에게 결정해 달라고 하세요. 회사의 공개 웹사이트나 타인의 디자인 분석은 그 값이나 자료를 프로젝트에 사용할 권한을 주지 않습니다. 소유자의 자료 사용 승인도 모델 제공업체에 보낼 권한까지 자동으로 주지는 않습니다.

이용 자격이 있는 계정이나 제공업체로 Claude Code 를 설정하고 비공개 코드, 문구, 자료를 노출하기 전에 계정의 데이터 이용 조건 과 도구 권한 을 검토합니다. 로컬에 저장한 프로젝트도 콘텐츠를 모델 서비스로 보낼 수 있습니다. 누가 자료를 볼 수 있는지, 어떤 도구가 파일을 읽거나 변경할 수 있는지, 각 항목을 제출해도 되는지 확인하세요. 비용 안내 는 계정과 제공업체에 따라 달라지므로 이 안내서가 세션의 고정 가격을 제시할 수는 없습니다.

이 특정 리비전으로 고정된 Awesome DESIGN.md 모음 은 파일의 구획을 구성할 때 선택적으로 참고할 수 있습니다. 공개 사이트를 분석한 자료이지 소유자가 승인한 브랜드 매뉴얼은 아닙니다. 승인된 결정에서 직접 파일을 작성해도 됩니다. 저장소 텍스트를 복사한다면 MIT 저작권·허가 고지를 유지하세요. 이 고지는 다른 사이트의 상표, 글꼴 파일, 이미지에 대한 권리를 주지 않습니다.

소유자 승인 참고 파일 만들기

1. 소유한 프로젝트에 brand-reference/DESIGN.md 를 만듭니다. 승인 기록을 바탕으로 아래 최소 구조를 채우세요. 대괄호 안은 소유자가 제공해야 할 정보를 뜻하며 브랜드를 추천하는 내용이 아닙니다. 소유자가 결정할 때까지 항목을 UNRESOLVED 로 표시해 둡니다. 빈칸을 채우려고 Claude에게 값을 지어내라고 하지 마세요.

# Visual specification

Owner: [owner or approving role]
Approved version/date: [version and approval date, or UNRESOLVED]
Audience and artifact purpose: [owner-approved description]
Approval evidence: [internal record or location, without private data in a shared copy]

## Color roles and values
- Background: [approved value and color format, or UNRESOLVED]
- Text: [approved value and color format, or UNRESOLVED]
- Primary action: [approved value and color format, or UNRESOLVED]
- Link, border and status roles: [each approved value, or UNRESOLVED]

## Typography and scale
- Heading family and permitted fallback: [approved names, or UNRESOLVED]
- Body family and permitted fallback: [approved names, or UNRESOLVED]
- Heading/body sizes, weights and line heights: [approved scale, or UNRESOLVED]
- Font license or use restriction: [approved terms, or UNRESOLVED]

## Spacing and layout
- Spacing scale, content width and grid: [approved values, or UNRESOLVED]
- Target artifact dimensions: [approved sizes, or UNRESOLVED]

## Components and states
- Buttons, links, inputs and navigation: [approved appearance and behavior]
- Hover, focus, disabled and error states: [approved rules, or UNRESOLVED]

## Responsive and accessibility rules
- Desktop/phone behavior and breakpoints: [approved rules, or UNRESOLVED]
- Contrast, readable type, focus order and touch use: [approved requirements]

## Assets and forbidden substitutions
- Permitted logo/image assets and usage: [approved paths and permissions]
- Do not substitute: [owner-approved prohibited colors, fonts, marks or patterns]

## Owner approval and changes
- Approved by: [person or role and date, or UNRESOLVED]
- Version: [version]
- Changelog: [date, change, approver]
- Unresolved decisions: [list, or "none" after owner review]

2. 채운 각 줄을 글꼴·이미지 사용권을 포함한 소유자의 원래 결정과 대조합니다. 프로젝트의 기존 스타일과 현재 승인 규칙이 충돌하면 소유자와 해결하세요. 바로 이 파일의 승인을 받고 버전을 기록합니다. 미결정 값에 의존하는 수정은 보류하세요. 승인 파일과 두 개의 시작 결과물을 버전 관리나 다른 복원 가능한 복사본에 저장합니다.

범위를 제한한 수정 두 건에 파일 사용하기

3. 소유한 프로젝트에서 확인한 계정과 권한으로 Claude Code 세션을 시작합니다. brand-reference/DESIGN.md 와 첫 번째 결과물의 정확한 경로를 알려 줍니다. 먼저 참고 자료와 결과물을 전부 읽고 편집 전에 멈추라고 요청하세요. 실제 파일 읽기·도구 결과에서 올바른 경로와 전체 내용이 있는지 확인합니다. 거부된 읽기, 잘린 결과, 경로 언급이나 말로 한 요약만으로는 부족합니다. Anthropic은 프로젝트 지시 파일 을 별도 설정 선택지로 설명합니다. 임의의 DESIGN.md 가 자동 검색된다고 가정하거나 @ 참조가 버전마다 똑같이 동작하리라 기대하지 마세요.
4. 전체 읽기가 확인되면 승인 규칙만 사용하여 첫 번째 결과물에 선택한 한 가지 시각적 변경을 요청합니다. 수정할 파일을 제한하고 문구, 링크, 컨트롤, 관련 없는 코드를 보존하세요. 제안된 차이와 프로젝트에서 정해 둔 렌더링 방식을 보여 달라고 합니다. 받아들이기 전에 변경한 모든 파일을 확인하세요. 승인하지 않은 색상, 글꼴, 자료, 의존성, 추가 수정은 거부합니다.
5. 첫 번째 결과물을 해당 프로젝트의 실제 절차로 렌더링합니다. 프로젝트에 적합한 데스크톱·휴대전화 크기에서 승인 파일 및 원래 결과물과 비교하세요. 수정 파일의 토큰 값, 읽기 쉬운 대비, 제목과 글꼴의 위계, 잘림이나 가로 넘침, 보이는 초점, 키보드와 수정된 상호작용, 문구·링크의 유지를 확인합니다. 참고 버전, 결과물 리비전, 점검과 수정을 기록하세요. 렌더링을 설명한 글은 렌더링된 결과가 아닙니다.
6. 두 번째 결과물도 정확한 경로와 brand-reference/DESIGN.md를 다시 명시합니다. 편집 전에 새로 전체를 읽도록 요청하고 도구 결과를 확인하세요. 다음으로 범위를 제한한 변경 하나를 요청하고 차이를 검토한 뒤 두 번째 결과물 자체 절차로 렌더링하고 같은 점검을 반복합니다. 두 리비전을 동일한 승인 파일 버전과 비교하세요. 규칙마다 준수, 누락, 소유자 승인이 필요한 개정 중 하나로 기록합니다. 이탈을 고치고 참고 자료가 바뀌면 두 결과물을 다시 점검하세요.

완료 기준은 소유자 승인을 받고 버전이 기록된 명세, 확인하고 렌더링한 수정본 두 개, 규칙을 지키거나 놓친 부분의 짧은 기록입니다. 되돌릴 수 있도록 원본 리비전을 보관하세요. 읽기에 실패하면 수정 요청 전에 정확한 경로, 권한, 파일 크기나 잘림 여부를 확인합니다. 명세가 프로젝트 스타일이나 접근성과 충돌하면 소유자의 결정을 받고 수정 범위를 좁히세요. 결과물을 렌더링하거나 상호작용을 점검할 수 없다면 점검이 가능할 때까지 수정을 수락하지 마세요. 향후 브랜드 변경에는 이전 출력에 대한 의도적인 새 검토가 필요합니다.

커뮤니티 파일을 한 페이지의 참고로 사용하는 다른 작업은 고정 리비전 DESIGN.md 안내서를 보세요. 이 안내서의 작업은 먼저 자신의 명세를 만들고 승인하는 것입니다.

출처 및 추가 자료

• 이 고정 리비전 Awesome DESIGN.md README 는 구획 예시를 제공하고 파일을 있는 그대로 제공하는 공개 사이트 분석이라고 설명합니다. 출력 품질에 관한 표현은 여기서 시험한 결과가 아닙니다. MIT 라이선스 는 복사한 저장소 자료를 규율하며 타사의 식별 요소나 자료에 적용되는 것은 아닙니다.
• Anthropic의 빠른 시작 안내 는 계정과 프로젝트 설정을 다룹니다. 일반적인 작업 절차 와 프로젝트 메모리 매뉴얼 은 파일과 지시의 절차를 설명하지만, 어느 것도 독자의 세션에서 이 독립 파일 전체를 읽었다는 증거가 아닙니다.
• Anthropic의 권한, 데이터 이용 , 비용 매뉴얼은 통제와 계정별 조건을 설명합니다. 이 안내서에서 실제 편집, 로컬 전용 처리, 고정 청구액, 품질 향상을 관찰했다는 점을 입증하지 않습니다.