창고 작업자는 한 손에 스캐너를 들고 다음 상품 위치를 찾습니다. 그런데 첫 시안의 통계 카드가 작은 화면의 절반을 차지한다면, 색과 그림자를 다듬을 때가 아닙니다. 무엇을 먼저 보여줄지 다른 시안을 같은 조건에서 비교해야 합니다.

핵심 콘텐츠와 기능은 고정하고 정보 우선순위만 다른 시안을 격리해 만듭니다. 선택은 취향 투표가 아니라 핵심 과업을 끝낼 때 거치는 클릭과 화면 전환 수, 오류 회복, 작은 화면 손실로 판정합니다.

세 시안은 서로 다른 질문에 답했습니다

작업 중심형은 다음 위치를 크게, 단계형은 스캔 순서를, 요약형은 전체 진행률을 앞세웠습니다. 각 시안은 별도 디렉터리에서 같은 긴 상품명과 오류 데이터를 사용했습니다.

비교 조건을 먼저 잠갔습니다

화면 크기와 과업을 같게 두어 장식 차이가 평가를 흐리지 않게 했습니다.

시안 공통 조건
과업: 다음 위치 확인 → 상품 스캔 → 수량 오류 복구
화면: 390×844, 1440×1000
고정: 데이터·문구·색상 토큰
측정: 과업 완료까지의 클릭·화면 전환 수, 첫 위치 확인 시간, 키보드 이동

작업 중심형을 선택한 이유

종이 위의 1차 검토에서는 작업 중심형을 우선 후보로 남깁니다. 다음 위치가 첫 화면에 보이고 긴 상품명도 행동 버튼을 밀어내지 않기 때문입니다. 단계형은 처음 쓰는 사람에게 친절하지만 수량 오류를 고치려면 화면을 더 오가야 합니다. 아직 승자는 아닙니다. 실제 작업자에게 세 시안을 보여주고 관찰한 뒤 선택합니다.

세 명만 보더라도 같은 기록표를 씁니다

아래 숫자는 결과를 꾸며낸 실측값이 아니라 현장에서 채울 기록 양식입니다. 시작 전에 "다음 위치를 5초 안에 찾고, 수량 오류를 도움 없이 복구한다"처럼 합격 기준을 정합니다.

시안별 사용자 관찰 기록 양식
참여자 | 시안 | 위치 확인(초) | 오류 복구 단계 | 막힌 지점 | 한 줄 반응
A       | 작업 |                  |                |           |
A       | 단계 |                  |                |           |
A       | 요약 |                  |                |           |

비교를 중단하는 조건

시안마다 다른 데이터나 기능을 쓰면 비교를 다시 시작합니다. 실제 사용자의 안전 절차를 생략하거나 접근성 검사를 통과하지 못하면 통합하지 않으며 버린 시안 코드는 제품에 섞지 않습니다.

Claude Code에서 세 시안을 시작하는 명령

이 명령은 시안 제작 로그가 아니라 비교 조건을 고정하는 시작 예시입니다. 먼저 디자인 규칙과 기존 컴포넌트만 읽게 하고, 세 시안의 콘텐츠·상태·화면 크기가 같다는 계획을 확인한 뒤 `prototypes/picking/` 안의 편집만 승인합니다.

같은 조건으로 비교 시안을 요청하는 입력
cd ~/projects/storefront
claude --permission-mode plan

먼저 CLAUDE.md 또는 저장소 지침 파일, templates/, public/assets/를 읽으세요.
코드는 수정하지 말고 현재 컴포넌트와 디자인 규칙을 정리하세요.
같은 콘텐츠를 쓰는 세 시안의 파일 경계, 접근성 위험, 검증 순서를 반환하세요.
반환 형식: 읽은 파일 / 지켜야 할 규칙 / 시안별 변경 파일 / 미확인 사항
허용 도구: Read, Glob, Grep
Edit와 Bash는 아직 승인하지 않습니다.

계획을 읽은 뒤 편집 범위를 다시 말해 줍니다

Claude가 읽지 않은 디자인 규칙을 추측했거나 제품 파일을 바로 고치려 하면 계획을 반려합니다. 검토가 끝나면 이렇게 범위를 고정합니다. "계획을 승인합니다. `prototypes/picking/` 아래에서만 세 시안을 만들고 공용 라우터와 제품 데이터는 수정하지 마세요. 각 시안은 같은 문구와 상태를 사용하세요."

검증 결과와 변경 차이를 함께 읽습니다

Claude의 완료 설명만 보지 않습니다. 아래 명령은 `prototypes/picking/`을 예시 경로로 사용합니다. 테스트 뒤에는 이 폴더 밖의 변경, 임의 문구, 누락된 오류 상태가 없는지 확인합니다.

선택한 시안만 남았는지 확인하는 명령
npm test
git diff -- prototypes/picking/
git status --short

세션을 멈추거나 다시 여는 기준

세 시안이 서로 다른 데이터나 기능을 사용하면 비교를 멈추고 공통 조건부터 고칩니다. 제품 코드나 잠금 파일 변경이 필요하다는 보고가 나오면 승인 범위를 넓히지 않고 이유와 대안을 받습니다. 같은 시안 비교를 이어 갈 때만 현재 세션을 재개하며, 통합 작업은 새 세션에서 선택된 한 시안만 읽고 시작합니다.

공식 출처