Chapter 06
자산화

SKILL.md
AI 작업을 자산으로

홈페이지를 만들고 나서 깨달았습니다.
새 대화창을 열 때마다 처음부터 다시 설명하는 게 너무 비효율적이라는 것을.
그래서 만든 것이 SKILL.md입니다.

문제 인식

매번 처음부터 설명하는 비효율

paulingplus.com을 완성하고 나서, 클라이언트 홈페이지도 같은 방식으로 만들 수 있겠다는 생각이 들었습니다. 그런데 새 대화창을 열자마자 문제가 생겼어요.

브랜드 컬러가 뭔지, 폰트가 뭔지, 섹션 순서가 어떻게 되는지 — 이걸 매번 다시 설명해야 했습니다. 그러면 결과가 들쭉날쭉해요. 같은 사람이 요청하는데 결과물의 퀄리티가 달라집니다.

SKILL.md 없을 때
새 대화창 열 때마다
브랜드 컬러 설명
+ 폰트 설명
+ 섹션 구조 설명
+ 코딩 규칙 설명
→ 매번 10분 낭비
→ 결과 퀄리티 불균일
SKILL.md 있을 때
SKILL.md 한 파일 첨부
→ Claude가 자동으로 인식
→ "OO 브랜드 홈페이지 만들어줘"
한 줄로 시작 가능
→ 퀄리티 일정하게 유지
→ 한 번 만든 규칙 계속 재사용
패키지 구성

3개 파일로 패키지를 만들었습니다

📄 SKILL.md
스킬 지침 파일
Claude가 읽는 핵심 규칙. 브랜드 무드 감지 방법, 디자인 시스템, 섹션 구조, 코드 작성 규칙이 담겨 있습니다.
📋 brand-intake.md
브랜드 정보 수집 양식
클라이언트 정보를 구조화해서 받는 양식. 브랜드명·컬러·타깃·핵심 메시지·섹션 요구사항을 한 곳에 담습니다. 핵심 항목: 브랜드 무드(럭셔리/미니멀/스트리트) / 메인 컬러 코드 / 타깃 고객 / 보유 실적 수치 / 필수·제외 섹션 목록.
📖 cowork-guide.md
워크플로우 가이드
누구나 따라할 수 있는 단계별 가이드. 파일 준비부터 Netlify 배포까지 전 과정. 클라이언트에게 직접 전달 가능.
실제 파일 공개

SKILL.md 핵심 구조 전체

실제로 사용한 SKILL.md의 핵심 섹션을 공개합니다. Claude Desktop의 Skills 기능에 폴더째로 등록하면 됩니다.

SKILL.md vs CLAUDE.md — SKILL.md는 "어떤 브랜드든 홈페이지를 만드는 방법"을 담은 범용 규칙입니다. CLAUDE.md(ch07)는 "paulingplus.com이라는 특정 프로젝트의 현황"을 담은 프로젝트별 파일이에요. SKILL.md는 재사용, CLAUDE.md는 프로젝트마다 새로 만듭니다.

SKILL.md — 실제 내용
# Pauling+ 패션 홈페이지 빌더 스킬 ## 핵심 역할 브랜드 정보 입력 → 완성된 단일 HTML 파일 자동 생성 개발자 없이, 코드 지식 없이, Netlify 배포 가능한 수준으로. ## 브랜드 무드 감지 규칙 입력된 브랜드 정보에서 무드를 먼저 판단한다. - 럭셔리 / 프리미엄 → Cormorant Garamond + 골드 + 넓은 여백 - 미니멀 / 컨템포러리 → DM Sans + 단색 + 그리드 구조 - 스트리트 / 캐주얼 → Space Grotesk + 강한 컬러 + 타이트한 레이아웃 - 불분명하면 럭셔리 방향으로 기본 설정 ## 디자인 시스템 규칙 (Pauling+ 기준) 강조 컬러는 하나만 사용한다. (#B8A882 웜 골드) 배경: 순백(#FFFFFF) 대신 웜 화이트 계열(#F4F1EC 또는 #FDFCFA) 폰트: 최대 3종 (헤딩 / 본문 / 레이블) 골드는 버튼 테두리, 포인트 텍스트, 구분선에만 사용 ## 필수 섹션 순서 NAV → Hero → Stats → About → Brand Story → When to Call → Services → Cases → How I Work → Contact (Netlify Forms) → Footer ## 코드 규칙 - 단일 HTML 파일로 완성 (CSS·JS 인라인) - 외부 라이브러리 사용 금지 (순수 CSS) - Google Fonts는 @import로 로드 - Netlify Forms: data-netlify="true" + hidden input 필수 - 반응형: 모바일 first, 768px 브레이크포인트 - 이미지 없으면 플레이스홀더 처리 (파일명만 맞추기) ## 산출물 기준 - 파일명: index.html - 저장위치: 작업 폴더 루트 - 완성도: Netlify 드래그앤드롭 즉시 가능한 수준
Skills 등록 방법

Claude Desktop에 등록하는 3단계

SKILL.md를 만들었으면 Claude Desktop에 등록해야 실제로 작동합니다. 한 번만 하면 이후 모든 대화에서 자동 적용됩니다.

01
폴더 준비
fashion-website-builder 폴더를 만들고 안에 SKILL.md, brand-intake.md, cowork-guide.md 3개 파일을 넣습니다.
02
Claude Desktop → Settings → Skills
Claude Desktop 앱 실행 → 우측 상단 설정(⚙️) → Skills 탭 → + 버튼 클릭 → fashion-website-builder 폴더 선택. SKILL.md가 자동으로 인식됩니다.
03
확인 후 사용
새 대화창에서 brand-intake.md를 드래그해서 첨부 → "홈페이지 만들어줘" 한 줄 입력. SKILL.md의 규칙이 자동 적용된 상태로 작업이 시작됩니다.
Claude Desktop은 claude.com/download에서 무료로 설치할 수 있습니다. Skills 기능은 Pro 플랜 이상에서 사용 가능합니다.
활용 방법

이렇게 쓰면 됩니다