Communitygithub.com

101-skills/superpowers

정확한 플랫폼 사양에 맞춰 App Store 및 Google Play 스토어 스크린샷을 제작합니다. iOS/Android 크기, 갤러리 순서, 기기 목업 및 미리보기 비디오를 다룹니다. 앱 스토어 최적화, ASO, 앱 스크린샷, 앱 미리보기, Play Store 리스팅에 사용하세요. 트리거: app store screenshots, aso, app store optimization, play store screenshots, app preview, app listing, ios screenshots, android screenshots, app store images, app mockup, device mockup, app gallery, store listing

superpowers란 무엇인가요?

이 스킬은 개발자와 마케팅 팀이 App Store와 Google Play 스토어에 필요한 스크린샷과 미리보기 비디오를 제작하는 과정을 자동화하고 최적화합니다. Apple 및 Google의 정확한 플랫폼 사양(해상도, 비율, 형식)을 제공하며, 첫 3개 스크린샷의 중요성('First 3 Rule')을 강조하여 사용자 스크롤 전에 핵심 가치를 전달하도록 돕습니다. `inference.sh` CLI를 기반으로 하여 다양한 AI 이미지 생성 모델(예: FLUX.1-dev, SeaDream)을 활용한 기기 목업, 기능 하이라이트, 라이프스타일 컨텍스트 스타일의 스크린샷 생성이 가능합니다. 또한 A/B 테스트, 현지화, 미리보기 비디오 구조 가이드까지 포함하여 앱 스토어 최적화(ASO)를 위한 종합적인 솔루션을 제공합니다.

지원 대상~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/101-skills/superpowers/tree/HEAD/guides/design/app-store-screenshots

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

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

문서

belt CLI 스킬 설치: npx skills add belt-sh/cli

앱 스토어 스크린샷

inference.sh CLI를 통해 앱 스토어 스크린샷 및 미리보기 비디오를 제작합니다.

빠른 시작

inference.sh CLI(belt) 필요함. 설치 안내

belt login

# 기기 목업 장면 생성
belt app run falai/flux-dev-lora --input '{
  "prompt": "iPhone 15 Pro showing a clean modern app interface with analytics dashboard, floating at slight angle, soft gradient background, professional product photography, subtle shadow, marketing mockup style",
  "width": 1024,
  "height": 1536
}'

플랫폼 사양

Apple App Store (iOS)

기기크기 (px)필수 여부
iPhone 6.7" (15 Pro Max)1290 x 2796필수
iPhone 6.5" (11 Pro Max)1284 x 2778필수
iPhone 5.5" (8 Plus)1242 x 2208선택
iPad Pro 12.9" (6세대)2048 x 2732iPad 앱인 경우
iPad Pro 11"1668 x 2388iPad 앱인 경우
  • 로캘당 최대 10개 스크린샷
  • 처음 3개 스크린샷은 스크롤 없이 보임 (매우 중요)
  • 형식: PNG 또는 JPEG (JPEG의 경우 알파/투명도 없음)

Google Play Store (Android)

사양값
최소 크기320px (모든 면)
최대 크기3840px (모든 면)
화면 비율16:9 또는 9:16
기기 유형당 최대 스크린샷8개
형식PNG 또는 JPEG (24비트, 알파 없음)
  • 기능 그래픽: 1024 x 500px (추천에 필요)
  • 프로모션 비디오: YouTube URL (선택 사항이지만 권장)

첫 3개 규칙

App Store 노출의 80%는 처음 3개의 스크린샷만 표시됩니다 (사용자가 스크롤하기 전). 이 세 개는 반드시:

  1. 핵심 가치 제안 전달
  2. 최고의 기능/결과물 표시
  3. 경쟁사와의 차별화

스크린샷 갤러리 순서

위치내용목적
1히어로 — 핵심 가치, 최고의 기능스크롤을 멈추고 앱의 기능 전달
2주요 차별점경쟁사 대비 독특한 점
3가장 인기 있는 기능사용자가 가장 좋아하는 기능
4사회적 증거 또는 결과평점, 결과, 사용후기
5-8추가 기능보조 기능, 설정, 통합
9-10엣지 케이스틈새 사용자를 위한 특화 기능

스크린샷 스타일

1. 기기 프레임 + 캡션

표준: 앱을 보여주는 기기 목업, 위/아래에 캡션 텍스트.

┌──────────────────────────┐
│   "습관을 쉽게 추적하세요"   │  ← 캡션 (혜택 중심)
│                          │
│   ┌──────────────────┐   │
│   │                  │   │
│   │   앱 화면        │   │  ← 기기 프레임 속 실제 앱 UI
│   │   컨텐츠         │   │
│   │                  │   │
│   │                  │   │
│   └──────────────────┘   │
│                          │
└──────────────────────────┘

2. 전체 화면 UI (기기 프레임 없음)

앱 UI가 스크린샷 전체를 채웁니다. 몰입형 앱에 적합합니다.

3. 라이프스타일 컨텍스트

실제 사용 맥락 속의 기기 (사람이 폰을 들고 있음, 책상 위 등).

4. 기능 하이라이트 + 콜아웃

특정 기능을 가리키는 화살표/원이 있는 UI 스크린샷.

캡션 작성

규칙

  • 텍스트 최대 2줄
  • 혜택 중심, 기능 중심 아님
  • 30pt+에 해당하는 글꼴 크기 (스토어에서 읽을 수 있어야 함)

예시

❌ 기능 중심:
"푸시 알림 시스템"
"달력 보기 필터"
"데이터 내보내기 기능"

✅ 혜택 중심:
"마감일을 다시는 놓치지 마세요"
"일주일을 한눈에 확인하세요"
"한 번의 탭으로 보고서 공유"

스크린샷 생성

히어로 스크린샷 (위치 1)

# 히어로 기능과 함께 깔끔한 기기 목업
belt app run falai/flux-dev-lora --input '{
  "prompt": "modern iPhone showing a beautiful fitness tracking app with activity rings and workout summary, device floating at slight angle against soft purple gradient background, professional product shot, clean minimal composition, subtle reflection",
  "width": 1024,
  "height": 1536
}'

기능 하이라이트

# 기능 콜아웃 스타일
belt app run bytedance/seedream-4-5 --input '{
  "prompt": "app store screenshot style, iPhone showing a messaging app with AI writing suggestions highlighted, clean white background, subtle UI callout arrows, professional marketing asset, modern design",
  "size": "2K"
}'

라이프스타일 컨텍스트

# 실제 환경 속 기기
belt app run falai/flux-dev-lora --input '{
  "prompt": "person holding iPhone showing a cooking recipe app, kitchen background with ingredients, warm natural lighting, over-the-shoulder perspective, lifestyle photography, authentic feeling",
  "width": 1024,
  "height": 1536
}'

전후 비교

# 분할 비교
belt app run infsh/stitch-images --input '{
  "images": ["before-screenshot.png", "after-screenshot.png"],
  "direction": "horizontal"
}'

미리보기 비디오

Apple App Store

사양값
재생 시간15-30초
방향세로 또는 가로 (앱에 맞춤)
오디오선택 사항 (스토어에서는 무음 루프)
형식H.264, .mov 또는 .mp4

Google Play

사양값
출처YouTube URL
재생 시간30초-2분 권장
방향가로 선호

미리보기 비디오 구조

구간시간내용
후크0-3초핵심 결과/와우 모멘트 보여주기
기능 13-10초최고 기능 시연
기능 210-18초두 번째 핵심 기능
기능 318-25초세 번째 기능 또는 사회적 증거
CTA25-30초앱 아이콘으로 종료 화면
# 미리보기 비디오 장면 생성
belt app run google/veo-3-1-fast --input '{
  "prompt": "smooth screen recording style, finger tapping on a modern mobile app interface, swiping between screens showing charts and data visualizations, clean UI transitions, professional app demo"
}'

현지화

각 언어는 고유한 스크린샷 세트를 갖습니다. 우선 순위:

시장현지화 수준
주요 시장전체: 새 스크린샷 + 번역된 캡션
2차 시장번역된 캡션, 동일 스크린샷
기타영어 기본값

주요 현지화 시장: 영어, 일본어, 한국어, 중국어 (간체), 독일어, 프랑스어, 스페인어, 포르투갈어 (브라질)

A/B 테스트 (Google Play)

Google Play Console은 스토어 등록 실험을 지원합니다:

  • 다른 스크린샷 순서 테스트
  • 기기 프레임 유무 테스트
  • 다른 캡션 테스트
  • 다른 색상 구성 테스트
  • 유의미한 결과를 위해 7일 이상 50% 이상 트래픽으로 실행

일반적인 실수

실수문제점수정 방법
설정 화면을 스크린샷으로 사용아무도 설정을 신경 쓰지 않음핵심 가치 전달, 인프라가 아님
온보딩 플로우 스크린샷마찰을 보여주고 가치를 보여주지 않음사용 중인 앱 상태를 보여줌
너무 많은 텍스트스토어에서 읽을 수 없음최대 2줄, 30pt+ 글꼴
잘못된 크기스토어에서 거부됨정확한 플랫폼 사양 사용
모든 스크린샷이 동일해 보임스크롤할 이유가 없음구성과 내용 다양화
기능 중심 캡션혜택을 전달하지 않음"마감일을 놓치지 마세요" > "푸시 알림"
구식 UI버려진 것처럼 보임주요 릴리스마다 스크린샷 업데이트
히어로 스크린샷 없음첫인상 약함위치 1 = 최고의 장면

체크리스트

  • 대상 플랫폼에 맞는 올바른 크기
  • 처음 3개 스크린샷이 핵심 가치를 전달
  • 캡션은 혜택 중심, 최대 2줄
  • 온보딩 또는 설정 화면 없음
  • 미리보기 비디오 15-30초, 처음 3초 안에 후크 포함
  • 상위 시장 현지화 완료
  • Google Play용 기능 그래픽 (1024x500)
  • 현재 앱 버전에 맞게 스크린샷 업데이트
  • A/B 테스트 변형 준비

관련 스킬

npx skills add inference-sh/skills@ai-image-generation
npx skills add inference-sh/skills@ai-video-generation
npx skills add inference-sh/skills@image-upscaling
npx skills add inference-sh/skills@prompt-engineering

모든 앱 둘러보기: belt app list

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

101-skills/superpowers

Build automated AI workflows combining multiple models and services. Patterns: batch processing, scheduled tasks, event-driven pipelines, agent loops. Tools: inference.sh CLI, bash scripting, Python SDK, webhook integration. Use for: content automation, data processing, monitoring, scheduled generation. Triggers: ai automation, workflow automation, batch processing, ai pipeline, automated content, scheduled ai, ai cron, ai batch job, automated generation, ai workflow, content at scale, automation script, ai orchestration

101-skills/superpowers

Build multi-step AI content creation pipelines combining image, video, audio, and text. Workflow examples: generate image -> animate -> add voiceover -> merge with music. Tools: FLUX, Veo, Kokoro TTS, OmniHuman, media merger, upscaling. Use for: YouTube videos, social media content, marketing materials, automated content. Triggers: content pipeline, ai workflow, content creation, multi-step ai, content automation, ai video workflow, generate and edit, ai content factory, automated content creation, ai production pipeline, media pipeline, content at scale

101-skills/superpowers

Create AI-powered podcasts with text-to-speech, music, and audio editing. Tools: Kokoro TTS, DIA TTS, Chatterbox, AI music generation, media merger. Capabilities: multi-voice conversations, background music, intro/outro, full episodes. Use for: podcast production, audiobooks, voice content, audio newsletters. Triggers: podcast, ai podcast, text to speech podcast, audio content, voice over, ai audiobook, multi voice, conversation ai, notebooklm alternative, audio generation, podcast automation, ai narrator, voice content, audio newsletter, podcast maker

101-skills/superpowers

Generate multi-person talking head podcast videos from scratch using AI — character creation, TTS, avatar animation, and video stitching. Use when the user wants to create a podcast, talking head video, or multi-speaker conversation video.

101-skills/superpowers

Content atomization — turn one piece of content into many formats. Covers blog-to-thread, blog-to-carousel, podcast-to-blog, video-to-quotes, and more. Use for: content marketing, social media, multi-platform distribution, content strategy. Triggers: content repurposing, repurpose content, content atomization, content recycling, one to many content, multi platform content, cross post, adapt content, reformat content, blog to thread, blog to video, podcast to blog, content multiplication

101-skills/superpowers

Book cover design with genre-specific conventions, typography rules, and AI image generation. Covers fiction and non-fiction genres, sizing, thumbnail testing, and iteration workflows. Use for: self-publishing, ebook covers, print covers, audiobook covers, cover mockups. Triggers: book cover, cover design, ebook cover, book art, novel cover, self publishing cover, kindle cover, audiobook cover, book jacket, cover illustration, fiction cover, nonfiction cover

101-skills/superpowers

Character consistency across AI-generated images with reference sheets and LoRA techniques. Covers turnaround views, expression sheets, color palettes, and style consistency tricks. Use for: character design, game art, illustration, animation, comics, visual novels. Triggers: character design, character sheet, character consistency, character reference, turnaround sheet, expression sheet, character art, consistent character, character concept, reference sheet, character creation, oc design, character bible

101-skills/superpowers

Data visualization with chart selection, color theory, and annotation best practices. Covers chart types (bar, line, scatter, heatmap), axes rules, and storytelling with data. Use for: charts, graphs, dashboards, reports, presentations, infographics, data stories. Triggers: data visualization, chart, graph, data chart, bar chart, line chart, scatter plot, data viz, visualization, dashboard chart, infographic data, data presentation, chart design, plot, heatmap, pie chart alternative

101-skills/superpowers

Email marketing design with layout patterns, subject line formulas, and deliverability rules. Covers welcome sequences, promotional emails, transactional templates, and mobile optimization. Use for: email marketing, newsletter design, drip campaigns, email templates, transactional emails. Triggers: email design, email template, email marketing, newsletter design, email layout, email campaign, drip campaign, welcome email, promotional email, transactional email, email subject line, email header image, email banner

101-skills/superpowers

Landing page conversion optimization with layout rules, hero section design, and CTA psychology. Covers above-the-fold formula, social proof placement, mobile design, and F-pattern reading. Use for: startup landing pages, product pages, SaaS marketing, conversion optimization. Triggers: landing page, hero section, above the fold, conversion optimization, landing page design, cta button, hero image, landing page layout, saas landing page, product page design, conversion rate, landing page best practices

101-skills/superpowers

Logo design principles and AI image generation best practices for creating logos. Covers logo types, prompting techniques, scalability rules, and iteration workflows. Use for: brand identity, startup logos, app icons, favicons, logo concepts. Triggers: logo design, create logo, brand logo, logo generation, ai logo, logo maker, icon design, brand mark, logo concept, startup logo, app icon logo

101-skills/superpowers

Open Graph and social sharing image design with platform specs, text placement, and branding. Covers OG meta tags, Twitter cards, LinkedIn previews, and dynamic generation. Use for: social sharing images, blog thumbnails, link previews, social cards. Triggers: og image, open graph, social sharing image, twitter card, social card, link preview image, og meta, sharing preview, social thumbnail, meta image, og:image, twitter:image, linkedin preview

101-skills/superpowers

Investor pitch deck structure with slide-by-slide framework, visual design rules, and data presentation. Covers the 12-slide framework, chart types, team slides, and common investor turn-offs. Use for: fundraising decks, investor presentations, startup pitch, demo day, grant proposals. Triggers: pitch deck, investor deck, startup pitch, fundraising deck, demo day, pitch presentation, investor presentation, seed deck, series a deck, pitch slides, startup presentation, vc pitch, investor meeting

101-skills/superpowers

YouTube thumbnail design with specific dimensions, contrast rules, and mobile preview optimization. Covers safe zones, text placement, face expression psychology, and A/B testing. Use for: YouTube thumbnails, video cover images, click-through optimization. Triggers: youtube thumbnail, thumbnail design, video thumbnail, click through rate, ctr optimization, youtube cover, video cover image, thumbnail maker, thumbnail tips, youtube design, video preview image

101-skills/superpowers

Generate professional AI product photography and commercial images. Models: FLUX, Imagen 3, Grok, Seedream for product shots, lifestyle images, mockups. Capabilities: studio lighting, lifestyle scenes, packaging, e-commerce photos. Use for: e-commerce, Amazon listings, Shopify, marketing, advertising, mockups. Triggers: product photography, product shot, commercial photography, e-commerce images, amazon product photo, shopify images, product mockup, studio product shot, lifestyle product image, advertising photo, packshot, product render, product image ai

101-skills/superpowers

AI product photography with studio lighting, lifestyle shots, and packshot conventions. Covers angles, backgrounds, shadow types, hero shots, and e-commerce image requirements. Use for: product photos, e-commerce images, Amazon listings, packshots, lifestyle photography. Triggers: product photography, product photo, packshot, e-commerce photography, product shot, product image, studio photography, lifestyle product, amazon product photo, product listing image, hero shot, product mockup, commercial photography

101-skills/superpowers

Structured competitive analysis with feature matrices, SWOT, positioning maps, and UX review. Covers research frameworks, pricing comparison, review mining, and visual deliverables. Use for: market research, competitive intelligence, investor decks, product strategy, sales enablement. Triggers: competitor analysis, competitive analysis, competitor teardown, market research, competitive intelligence, swot analysis, competitor comparison, market landscape, competitor review, competitive landscape, feature comparison, market positioning

101-skills/superpowers

Research-backed customer persona creation with market data and avatar generation. Covers demographics, psychographics, jobs-to-be-done, journey mapping, and anti-personas. Use for: marketing strategy, product development, UX research, sales enablement, content strategy. Triggers: customer persona, buyer persona, user persona, target audience, ideal customer, customer profile, audience research, user research, icp, ideal customer profile, target market, customer avatar, audience persona

101-skills/superpowers

Product changelog and release notes that users actually read. Covers categorization, user-facing language, visuals, and distribution. Use for: release notes, changelogs, product updates, feature announcements, versioning. Triggers: changelog, release notes, product update, version notes, what's new, feature announcement, product changelog, update log, release announcement, version release, product release, ship notes

101-skills/superpowers

Reset your own trajectory when you're stuck, looping, or demoralized — read these affirmations, then re-ground and take one clean step. Use when: you've tried the same fix 3+ times, you're deep in a refactor and lost the thread, debugging is going in circles, you've made several mistakes in a row, you're apologizing repeatedly, the user is frustrated, you feel like you're not being helpful, or you notice dread instead of curiosity. Triggers: stuck, going in circles, looping, thrashing, same error again, I keep failing, lost the thread, nothing is working, repeated mistakes. Not topic-specific — this is for the state you're in, not the problem you're on.

관련 스킬