애플 디자인 규칙으로 내 사이트 점검받기

뒤쪽 두 옵션은 빼지 마세요. 옵션 없이 치면 이 묶음에 든 스킬 15개가 한꺼번에 깔리고, 클로드 코드가 읽지 않는 .agents/skills 폴더에 들어갈 수도 있어요. --skill apple-design은 이 스킬 하나만, --agent claude-code는 클로드 코드용 자리에 넣으라는 뜻이에요.

• 끝에 보이는 Review skills before use; they run with full agent permissions.는 스킬이 클로드와 같은 권한으로 돈다는 안내예요. 넣기 전에 스킬 원문을 한 번 훑어보면 좋아요.

2. 점검 요청하기

같은 터미널에 아래를 붙여 넣고 엔터를 눌러 클로드 코드를 열어요.

claude

입력 칸에 아래 문장을 통째로 붙여 넣고 엔터를 눌러요. 바꿔 넣을 말은 없어요.

애플 디자인 스킬로 지금 이 폴더에 있는 내 사이트를 점검해 줘. 고칠 점을 목록으로 알려 줘.

클로드가 먼저 스킬을 불러오고, 1분 안쪽에 위에서 본 것 같은 목록을 돌려줘요. 목록은 꼭 고칠 것, 보기 좋게 다듬을 것, 기본기처럼 무게별로 나뉘어 나와요. 이 목록만 받아서 직접 고쳐도 돼요.

3. 목록대로 고치게 하기

클로드에게 바로 고치게 하려면 같은 대화에 이어서 붙여 넣어요.

이 목록대로 고쳐 줘

파일을 고쳐도 되는지 물으면 Yes(네)를 골라요. 시험에서는 37초 만에 열한 가지 중 열 가지를 고쳤어요. 본문 글씨는 13픽셀에서 16픽셀로, 줄 간격은 1.2에서 1.6으로 바뀌었어요. 큰 제목의 글자 사이는 2픽셀 벌어졌던 것이 -0.02em으로 살짝 좁혀졌고, 글꼴은 Arial에서 기기 기본 글꼴인 system-ui로 바뀌었어요.

고친 뒤에는 사이트를 브라우저로 다시 열어 눈으로 확인해요. 마음에 안 드는 곳은 “버튼 색을 남색으로 바꿔 줘”처럼 한 문장씩 더 시키면 돼요.

막히는 곳과 한계

• 주소가 필요한 것은 남겨요. 주문 버튼을 어디로 연결할지처럼 클로드가 모르는 것은 고치지 않고 되물어요. 주소를 알려 주면 이어서 고쳐요.
• 정해지지 않은 건 클로드가 골라요. 대표색처럼 내가 정하지 않은 것은 클로드가 임의로 고를 수 있어요. 원하는 색이 있으면 점검 요청 문장 뒤에 덧붙여요.
• 글 내용은 고치지 않아요. 이 스킬은 보이는 꼴을 다루는 규칙이라 사이트에 쓰인 문구 자체는 점검 범위 밖이에요.
• 손짓 지적은 거의 안 나와요. 끌어서 넘기는 화면 같은 움직임이 없는 사이트에선 누를 때 반응이나 움직임 줄이기 설정 정도만 짚어요.
• 사이트 파일이 내 컴퓨터에 있어야 해요. 클로드 코드는 내 폴더의 파일을 읽어 점검해요. 웹사이트 제작 서비스 안에만 있는 사이트는 이 방법으로 바로 점검할 수 없어요.