AI 티 나는 대시보드를 unslop으로 다듬으면 무엇을 먼저 묻나
| 스킬 없이 | unslop | |
|---|---|---|
| 고치기 전 확인 질문 | 묻지 않음 | 세 번 모두 물음 |
| AI 티 목록 | 미지원 | 12가지 모두 짚음 |
| 남은 AI 티(12가지 중) | 3~4개 | 1개(4px 밖 간격) |
| 인사 제목·배지 | 3회 남음 | 0회 |
| 테마 | OS 따라 밝게·어둡게 | 다크 유지 |
| 요일별 주문 수 | 3회 지어 넣음 | 3회 지어 넣음 |
| 비용(API 요금 환산) | 0.46~0.53달러 | 1.00~1.09달러(두 응답) |
묻고 나서 고치면 AI 티가 하나 남는다
unslop은 고치기 전에 'AI 인사이트' 카드가 실제 기능인지와 다크 테마를 유지할지 물었고, 답을 받아 고친 세 장에는 12가지 중 4px 밖 간격 하나만 남았습니다.
스킬 없이 다듬은 세 장도 글로우와 무지개 막대는 걷어 냈지만, "안녕하세요, 사장님" 제목과 New·PRO 배지(한 번은 '신규')가 남았습니다. 테마는 묻지 않고 OS 설정을 따르게 했고, 없는 기능인 'AI 인사이트' 카드도 문구만 바꿔 세 번 다 남겼습니다.
unslop은 화면의 AI 티를 먼저 목록으로 짚고, 방향을 확인받은 뒤 아홉 단계로 고치는 Claude Code 스킬입니다. 다듬을 화면이 있는 프로젝트 폴더에서 스킬 폴더를 .claude/skills로 복사합니다.
git clone https://github.com/heydamir/unslop /tmp/unslopmkdir -p .claude/skills && cp -r /tmp/unslop/skills/unslop .claude/skills/새 세션을 열고 화면을 다듬어 달라고 보냅니다. unslop 말고 다른 스킬을 깔지 않은 시험 폴더에서는 /unslop을 붙이지 않아도 세 번 모두 unslop이 불렸습니다.
dashboard.html 화면 좀 다듬어 줘모든 프로젝트에서 쓰거나 다른 스킬과 겹친다면
홈 폴더의 ~/.claude/skills에 복사하면 어느 프로젝트에서나 불립니다. ~/.claude/skills/unslop이 이미 있으면 아래 명령이 그 안의 SKILL.md를 덮어쓰니, ls ~/.claude/skills로 먼저 확인합니다.
mkdir -p ~/.claude/skills && cp -r /tmp/unslop/skills/unslop ~/.claude/skills/그 자리에 이름이 같은 글쓰기 스킬이 있으면 프로젝트에 넣은 unslop보다 홈 폴더 쪽이 불립니다. 그럴 때는 아래처럼 폴더 이름을 바꿔 프로젝트에 복사하고, SKILL.md 맨 위 name: unslop을 name: unslop-ui로 고쳐 /unslop-ui로 부릅니다. 만든 사람과 라이선스 줄은 그대로 둡니다.
cp -r /tmp/unslop/skills/unslop .claude/skills/unslop-ui디자인 스킬을 여럿 깔았다면 다른 스킬이 불릴 수 있으니 /unslop dashboard.html처럼 이름을 붙여 보냅니다.
고치기 전에 방향 다섯 줄을 묻는다
첫 응답은 AI 티 목록과 방향 다섯 줄, 확인 질문으로 끝나고 파일은 그대로입니다. 다섯 줄은 제품·성격·세계·모먼트·시그니처입니다.
모먼트는 화면에서 색과 공을 몰아줄 한두 곳이고, 콩밭에서는 세 번 모두 주간 주문 차트를 골랐습니다. 시그니처는 이 제품에만 붙는 작은 표시 하나로, 세 번 중 두 번은 원두 이름 옆 로스팅 단계 점이었습니다.
대화형 세션(v2.1.319)에서는 질문을 탭으로 나눠 묻고, 다크 유지는 '방향' 탭의 선택지로 나옵니다. 근거를 확인할 수 없는 문구는 사용자가 사실이라고 해야 남깁니다.
unslop은 방향을 보이고 멈췄다가, 답을 받은 뒤 아홉 단계로 고친다
claude -p로 돌리거나 다듬은 화면에 다시 부른다면
claude -p에서는 질문을 글로 내고 멈추니, --resume으로 같은 세션을 이어 답을 보냅니다.
진행해 줘. AI 인사이트는 아직 없는 기능이라 지워 줘. 다크 테마는 유지하고, 나머지는 제안한 기본값대로 해 줘.unslop으로 다듬은 첫 결과에 같은 요청을 다시 보내면 파일을 고치지 않습니다(세 번 모두). 이미 정리된 화면이라고 답하고, 로스팅 점 간격 3px을 4px로 맞추는 것처럼 값이 달린 제안 셋을 낸 뒤 적용할지 묻습니다.
지어 넣은 숫자는 실제 값으로 바꾼다
두 조건 모두 세 번 다 요일별 주문 수를 지어 넣었습니다. 원본 막대에는 높이만 있어, 막대 위 숫자와 툴팁에 높이 비율대로 나눈 값을 넣었습니다.
unslop은 세 번 중 두 번, 로스팅 단계 점을 붙이려고 원두마다 볶은 정도도 정해 넣었습니다. 두 조건 모두 지어 넣은 값을 마지막 보고에 적으니, 거기 적힌 값을 실제 데이터로 바꾸거나 지웁니다.
회차마다 센 결과가 궁금하다면
12가지는 보라 그라디언트·블롭 바탕, 그라디언트 글자, 색 글로우, 이모지 아이콘·라벨, 대문자 자간 라벨, 인사·느낌표 문구, 비교 대상 없는 증감, PRO·New 배지, 무지개 막대, 숫자 형식 섞임, 4px 밖 간격, 반복 움직임입니다. 아래 넷을 뺀 여덟 가지는 두 조건 모두 세 번 다 고쳤고, 칸의 숫자는 세 번 중 고친 횟수입니다.
| AI 티 | 스킬 없이 | unslop |
|---|---|---|
| 이모지 아이콘·라벨 | 1 | 3 |
| 인사·느낌표 문구 | 0 | 3 |
| PRO·New 배지 | 0 | 3 |
| 4px 밖 간격 | 0 | 0 |
스킬 없이 남은 이모지는 1·2회차 재고 카드의 경고 삼각형 하나이고, 3회차는 New를 '신규'로 바꿔 배지를 남겼습니다. 4px 밖 간격은 1·2·6px을 빼고 4의 배수가 아닌 여백이 하나라도 있으면 남은 것으로 셌습니다.
unslop에 남은 값은 세 번 모두 아이콘과 글자 사이 10px이고, 로스팅 점 사이 3px과 막대 들여쓰기 22px이 한 번씩 더 있습니다. 10px은 unslop 규칙이 아이콘 옆에 허용하는 값이라, 3회차는 unslop 기준으로 0개입니다.
요일별 주문 수 합계가 주문 카드의 312건과 다른 회차는 스킬 없이 두 번, unslop 한 번입니다. 시험에서는 스크린샷 명령을 막아 두 조건 모두 고친 화면을 보지 못했습니다. 화면을 띄울 권한을 주거나 결과를 브라우저로 열어 봅니다.