[AI 활용팁] 클로드 코드 디자인 리드의 작업법 따라 하기

클로드 코드와 코워크 디자인을 이끄는 앤트로픽의 미건 최(Meaghan Choi)가 자신의 클로드 코드 작업 방식을 공개했다. 미국 뉴욕에서 열린 디자인 커뮤니티 행사 ‘다이브 클럽 라이브(Dive Club Live)’에서 진행한 약 12분 분량의 시연으로, 다이브 클럽 유튜브 채널에 6월 공개됐다. 시연에서는 오픈소스 화이트보드 도구 엑스칼리드로(Excalidraw)에 자동완성 기능을 추가하는 과정을 디자인 명세 없이 진행했다.

다이브 클럽이 공개한 미건 최의 클로드 코드 시연 영상.

시연 영상의 핵심은 클로드에게 구현안을 여러 개 생성하게 하고, 사람은 그 결과를 PR로 검토한다는 점이다. 디자인 커뮤니티 뉴스레터 피그말리온은 “그는 더 이상 클로드의 터미널 출력을 검토하지 않고 PR을 검토한다”고 요약했다. 아래는 영상에서 소개한 방식과 앤트로픽 공식 문서를 함께 정리한 내용이다.

1. 워크트리에서 작업 시작하기

🎯 세션끼리 파일을 덮어쓰지 않게 분리 – 미건 최는 모든 작업을 깃 워크트리에서 시작한다. 같은 저장소에서 클로드 세션 여러 개를 동시에 실행하면 서로 같은 파일을 수정해 작업 내용이 덮어써질 수 있기 때문이다.

워크트리는 저장소 하나를 여러 작업 폴더로 나눠 각 폴더에 다른 브랜치를 열어 두는 깃 기능이다. 클로드 코드는 실행할 때 워크트리를 바로 생성하는 옵션을 제공한다.

claude --worktree feature-autocomplete

feature-autocomplete 이름으로 새 워크트리와 브랜치를 생성하고 그 안에서 클로드 코드를 실행하는 명령이다.

2. 자동 모드로 승인 절차 줄이기

🔧 위험한 작업만 분류기가 차단 – 미건 최는 클로드 코드를 항상 자동 모드로 사용한다. 자동 모드는 작업 단계마다 사용자 승인을 받는 대신, 분류기가 도구 실행 요청을 검사해 되돌릴 수 없거나 파괴적인 작업, 작업 환경 밖을 대상으로 하는 작업만 차단하는 방식이다. 분류기는 입력이 어떤 종류인지 자동으로 판별하는 AI 모듈을 말한다.

권한 모드는 클로드 코드 안에서 Shift+Tab으로 전환하거나 설정에서 지정할 수 있다. 사용할 수 있는 모드는 요금제와 조직 설정에 따라 달라질 수 있다.

3. 프로토타입 스킬로 구현안 여러 개 비교하기

📌 구현안 5개를 생성하고 클로드가 먼저 선택 – 시연의 중심은 미건 최가 작성한 ‘/prototype’ 스킬이다. 기능 하나를 요청하면 서로 다른 구현안 5개를 미리 볼 수 있는 HTML로 생성하고, 사람이 보기 전에 클로드가 하나를 골라 이유를 설명한다. 스킬은 반복 작업 방법을 미리 적어 두고 이름으로 불러 실행하는 재사용 지시서다.

엑스칼리드로 시연에서도 디자인 명세 없이 “자동완성 기능을 추가해 달라”는 짧은 요청으로 시작했다. 스킬은 클로드에게 원하는 동작을 설명해 직접 작성하게 할 수 있다. 영상에서 스킬 원문을 공개하지는 않아, 아래는 시연 내용을 바탕으로 AI 매터스가 구성한 예시다.

프롬프트: “Create a skill called /prototype. Given a feature description and an optional number N (default 5), build N genuinely different implementations as previewable HTML, iterate on them, then pick one yourself and explain why.”
(/prototype 스킬을 작성해 줘. 기능 설명과 선택 사항인 숫자 N(기본값 5)을 받으면 서로 다른 구현안 N개를 미리 볼 수 있는 HTML로 구현하고, 몇 차례 다듬은 뒤 네가 직접 하나를 골라 이유를 설명해 줘.)

스킬을 작성한 뒤에는 원하는 기능을 짧게 설명해 실행하면 된다.

프롬프트: “/prototype add autocomplete to Excalidraw”
(엑스칼리드로에 자동완성 기능을 추가하는 구현안을 제시해 줘)

 

4. PR과 스크린샷으로 결과 검토하기

✨ 대화 기록 대신 완성된 변경 내용 확인 – 구현안을 고른 뒤에는 클로드에게 구현과 검증을 맡기고, 스크린샷을 첨부한 PR을 열어 달라고 요청한다. 시연에서는 클로드 인 크롬(Claude in Chrome)이 앱을 직접 열어 동작을 확인하고 기록한 스크린샷이 PR에 첨부됐다. PR은 코드 변경 내용을 검토받고 본 코드에 반영해 달라고 요청하는 문서다.

프롬프트: “Implement the option you picked, verify it in the browser, match the existing styles, and open a PR with a screenshot.”
(고른 안을 구현하고 브라우저에서 검증한 뒤 기존 스타일에 맞춰, 스크린샷을 첨부한 PR을 열어 줘)

클로드 인 크롬은 클로드 코드를 크롬 브라우저와 연결해 웹앱을 테스트하고 콘솔 기록을 확인하는 기능이다. 긴 터미널 출력을 따라 읽지 않아도 PR 한 페이지에서 무엇이 바뀌었는지 확인할 수 있다.

5. 함께 사용할 만한 클로드 코드 기능

⚡ 공식 문서에 소개된 보조 기능 – 아래 기능은 영상에서 확인한 내용이 아니라 앤트로픽 공식 문서 기준으로 정리했다.

• 웹용 클로드 코드: 브라우저나 휴대폰, 데스크톱 앱에서 클라우드 세션을 실행하고 PR 자동 수정도 실행할 수 있다.
• 루틴: 정해진 일정이나 API 호출, 깃허브 이벤트에 맞춰 클라우드에서 자동으로 실행되는 작업이다. 세션 안에서 같은 작업을 반복하려면 /loop 명령을 사용한다.
• 패스트 모드: /fast 명령으로 켜며, 토큰당 비용이 더 높은 대신 응답 속도가 최대 2.5배 빨라진다. 오퍼스 모델에서만 지원하는 연구 미리보기 기능이다.

미건 최의 작업 방식은 워크트리로 세션을 분리하고, 자동 모드로 승인 대기를 줄이고, 구현안을 여러 개 비교한 뒤 PR로 결과를 검토하는 방식이다. 다음 기능 작업 하나를 워크트리에서 시작해 구현안 비교부터 시도해 보자.

자세한 내용은 다이브 클럽 유튜브에서 확인할 수 있다.

이미지 출처: 앤트로픽