Communitygithub.com

bitomule/Koubou

HTML/CSS 템플릿과 실제 기기 프레임을 사용하여 App Store 스크린샷을 생성합니다. iPhone, iPad, Mac 및 Watch용 전문적이고 지역화된 스크린샷을 만듭니다. 사용자가 App Store 스크린샷을 생성, 디자인 또는 업데이트하려고 할 때 사용하세요.

Koubou란 무엇인가요?

Koubou는 HTML/CSS 템플릿을 활용하여 App Store 스크린샷을 생성하는 전문 도구로, 100개 이상의 실제 기기 프레임, xcstrings 지역화 지원, 그리고 픽셀 단위의 Apple 규격을 제공합니다. 이 스킬은 단순한 스크린샷 생성기를 넘어, 설계 가이드라인과 스타일 발견 프로세스를 통해 앱의 실제 비주얼 언어를 반영한 고품질 마케팅 자료를 제작하도록 설계되었습니다. 사용자는 Claude Code, Cursor, Codex 등 AI 에이전트 환경에서 이 스킬을 활용하여 스크린샷 캠페인의 기획, 디자인, 생성, 수정까지 전체 워크플로우를 자동화할 수 있습니다. 주요 기능으로는 YAML 기반 설정, 자동 스타일 발견, 복수 레이아웃 템플릿, 포스트 렌더 QA, 그리고 반복적인 수정을 위한 라이브 프리뷰 모드가 포함되어 있어, 개발자와 마케터가 App Store 스크린샷 제작 과정에서 시간과 노력을 크게 절약할 수 있습니다.

지원 대상✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/bitomule/Koubou/tree/HEAD/skills/koubou

즐겨 사용하는 AI에게 물어보기

이 에이전트 스킬이 미리 로드된 새 채팅을 엽니다.

문서

Koubou: App Store 스크린샷 생성기

HTML/CSS 템플릿, 100개 이상의 실제 기기 프레임, xcstrings 지역화, 픽셀 단위 Apple 규격을 사용하여 전문적인 App Store 스크린샷을 생성합니다.

스크린샷은 광고이지 문서가 아닙니다. 각 슬라이드는 하나의 감정, 결과, 또는 문제 해결 방안을 판매합니다.

이 스킬에서는 사용자 지시가 기본값보다 항상 우선합니다.

창의적인 방향은 기본적으로 열려 있습니다. 이 스킬의 규칙을 사용하여 영향력, 가독성, 캔버스 인식 스케일을 강제하되, 모든 세트가 동일하게 보이도록 하지 마세요.

규칙 계층

이 스킬의 지침은 다음 순서로 처리하세요:

  1. 하드 제약 조건 — 가독성, 스케일, 썸네일 선명도, 진실한 제품 마케팅, 실제 캔버스 인식
  2. 강력한 기본값 — 다양성, 비대칭, 겹침, 리듬, 일반적인 레이아웃 회피
  3. 취향 선호도 — 안티-슬롭 휴리스틱 및 스타일 기본값으로, 더 강력한 아이디어가 작업을 명확히 개선할 경우 깨뜨릴 수 있음

기본값을 깨면 더 나은 스크린샷 세트가 생성된다면 의도적으로 깨고, 생성하기 전에 자신에게 트레이드오프를 설명하세요.

참조 파일 (필요할 때 읽되, 미리 읽지 마세요):

  • setup.md — 설치 및 HTML 런타임 설정
  • design-guide.md — 디자인 원칙, 카피라이팅 규칙, CSS 규칙, HTML 템플릿 예제
  • style-intake.md — 질문 전에 앱의 실제 비주얼 언어를 검사하는 방법
  • style-interview.md — 짧고 신호 강도가 높은 스타일 질문 및 대화 패턴
  • yaml-reference.md — YAML 설정 형식, 지역화, 에셋, 기기, 크기
  • capabilities-reference.md — koubou의 전체 기능 (콘텐츠 모드, 하이라이트, 줌, 그라디언트)

1단계: 설정 (자동, 무음)

먼저 kou를 사용할 수 있는지 확인하세요. kou가 이미 작동한다면 Python 패키징을 재설치하거나 건드리지 마세요.

선호 순서:

kou --version 2>/dev/null

kou --version이 성공하면:

  • koubou가 설치된 것으로 간주
  • pip, pip3, 또는 playwright install을 실행하지 마세요
  • 사용자 환경을 사전에

관련 스킬