개요
ASO App Store Screenshots는 Claude Code가 앱 코드베이스를 분석해 다운로드를 유도할 핵심 혜택을 찾고, 앱스토어용 스크린샷 제작을 돕는 스킬이다. 이미지를 처음부터 AI에 맡기지 않고, Pillow 기반의 결정론적 스캐폴드와 Nano Banana Pro의 AI 보정을 결합해 레이아웃 일관성과 시각적 다듬기를 분리한다. 전체 흐름은 핵심 혜택 발굴, 시뮬레이터 스크린샷 페어링, 스크린샷 생성, 쇼케이스 생성의 네 단계로 구성된다. 원문은 설치 방법, 출력 디렉토리 구조, MIT 라이선스도 함께 소개한다.
핵심 포인트
- 혜택 발굴과 페어링: 코드베이스에서 3~5개의 핵심 혜택을 추리고, 사용자가 준비한 시뮬레이터 스크린샷을 각 혜택에 맞춰 평가·배치한다.
- 결정론적 스캐폴드:
compose.py가 헤드라인 위치, 기기 프레임, 프레임 안의 시뮬레이터 화면 합성을 코드로 고정한다. - AI 보정: Gemini MCP를 통해 호출하는 Nano Banana Pro가 스캐폴드에 사실적인 기기 프레임, 화면 밖으로 튀어나오는 강조 요소, 시각적 마감을 더한다.
- 보조 구성 요소: 저장소에는 기기 프레임 생성기
generate_frame.py, 쇼케이스 생성기showcase.py, 미리 렌더링된assets/device_frame.png가 포함된다. - 출력 구조:
screenshots/아래에 혜택별scaffold.png, AI 보정 버전(v1.png등), 리사이즈본을 저장하고, 승인본은final/에 둔다. 기본 출력 규격은 iPhone 6.7인치용 1290×2796px이다. - 설치와 실행: Claude Code 스킬 설치 후 Pillow를 설치하고, macOS에서는 SF Pro Display Black 글꼴을 지정 경로에 둔다. AI 보정을 사용하려면
@houtini/gemini-mcp를 MCP 서버로 설정한 뒤 프로젝트 디렉토리에서/aso-appstore-screenshots를 실행한다. - 라이선스: 저장소는 MIT 라이선스로 공개되어 있다.
왜 중요한가
- 스크린샷의 위치와 구조처럼 반복해서 맞춰야 하는 요소는 코드로 고정하고, 시각적 변형이 필요한 부분만 AI에 맡기는 설계 사례다.
- 앱 기능 분석부터 혜택별 화면 구성, 여러 버전 생성, 최종 쇼케이스 확인까지 앱스토어 이미지 제작 흐름을 하나의 Claude Code 스킬로 묶는다.
- 원문은 이 방식이 실제 다운로드율이나 전환율을 얼마나 개선했는지에 대한 실험 수치를 제시하지 않으므로, 성과는 별도로 검증해야 한다.
후속 링크와 키워드
- 원문: https://discuss.pytorch.kr/t/aso-app-store-screenshots-claude/11278
- GitHub 저장소: https://github.com/adamlyttleapps/claude-skill-aso-appstore-screenshots
- 저장소 파일: compose.py, generate_frame.py, showcase.py
- 설치·연동: Apple Developer Fonts, @houtini/gemini-mcp
- 관련 노트: moc-claude-code, mcp, moc-ai-coding
- 키워드:
ASO,Claude Code Skill,deterministic scaffold,Pillow,Nano Banana Pro,Gemini MCP,App Store screenshots