screenshot-planner
starsforks
How to install screenshot-planner?
rshankras/claude-code-apple-skills/screenshot-planner
$npx -y skills add rshankras/claude-code-apple-skills --skill screenshot-plannerPlan compelling App Store screenshot sequences that showcase your app's value. Use when preparing App Store assets, improving screenshot conversion, or drafting screenshot captions for a launch or major update.
SKILL.md
| 1 | # Screenshot Planner |
| 2 | |
| 3 | Plan compelling App Store screenshot sequences that showcase your app's value. |
| 4 | |
| 5 | ## When This Skill Activates |
| 6 | |
| 7 | - User is preparing App Store assets |
| 8 | - User wants to improve screenshot conversion |
| 9 | - User asks about screenshot strategy or captions |
| 10 | - User is launching a new app or major update |
| 11 | |
| 12 | ## Information Gathering |
| 13 | |
| 14 | Before planning, ask about: |
| 15 | |
| 16 | 1. **App Type** |
| 17 | - What category? (Productivity, Games, Lifestyle, etc.) |
| 18 | - Primary use case? |
| 19 | - Visual style of the app? |
| 20 | |
| 21 | 2. **Key Selling Points** |
| 22 | - What makes users choose this app? |
| 23 | - Most impressive features visually? |
| 24 | - Any unique UI elements? |
| 25 | |
| 26 | 3. **Target Audience** |
| 27 | - Who downloads this app? |
| 28 | - What problem are they trying to solve? |
| 29 | - What matters most to them? |
| 30 | |
| 31 | 4. **Competitors** |
| 32 | - What do competitor screenshots show? |
| 33 | - How can you differentiate? |
| 34 | |
| 35 | ## Screenshot Strategy |
| 36 | |
| 37 | ### The 5-Screenshot Framework |
| 38 | |
| 39 | Most users only see the first 2-3 screenshots. Order matters! |
| 40 | |
| 41 | | Position | Purpose | Content | |
| 42 | |----------|---------|---------| |
| 43 | | **1** | Hero Shot | Value proposition + best visual | |
| 44 | | **2** | Core Feature | Primary use case in action | |
| 45 | | **3** | Key Differentiator | What makes you unique | |
| 46 | | **4** | Secondary Feature | Another compelling feature | |
| 47 | | **5** | Social Proof/CTA | Reviews, awards, or final push | |
| 48 | |
| 49 | ### Extended (10 Screenshots) |
| 50 | |
| 51 | | Position | Purpose | |
| 52 | |----------|---------| |
| 53 | | 6 | Additional feature | |
| 54 | | 7 | Customization/settings | |
| 55 | | 8 | Integration/ecosystem | |
| 56 | | 9 | Before/after or workflow | |
| 57 | | 10 | Final CTA with app icon | |
| 58 | |
| 59 | ## Caption Writing |
| 60 | |
| 61 | ### Caption Formula |
| 62 | |
| 63 | ``` |
| 64 | [Action Verb] + [Benefit] + [Optional Detail] |
| 65 | ``` |
| 66 | |
| 67 | ### Examples by Category |
| 68 | |
| 69 | **Productivity:** |
| 70 | - "Capture ideas instantly" |
| 71 | - "Never miss a deadline" |
| 72 | - "Your tasks, beautifully organized" |
| 73 | |
| 74 | **Health & Fitness:** |
| 75 | - "Track every workout" |
| 76 | - "See your progress over time" |
| 77 | - "Personalized plans that work" |
| 78 | |
| 79 | **Photo & Video:** |
| 80 | - "Edit like a pro in seconds" |
| 81 | - "Filters that actually look good" |
| 82 | - "Share anywhere with one tap" |
| 83 | |
| 84 | **Finance:** |
| 85 | - "Know where your money goes" |
| 86 | - "Budget without the stress" |
| 87 | - "Insights that save you money" |
| 88 | |
| 89 | ### Caption Rules |
| 90 | |
| 91 | ✅ **Do:** |
| 92 | - Keep under 8 words |
| 93 | - Start with action verbs |
| 94 | - Focus on user benefits |
| 95 | - Match the visual exactly |
| 96 | - Use sentence case |
| 97 | |
| 98 | ❌ **Don't:** |
| 99 | - Use technical jargon |
| 100 | - Include version numbers |
| 101 | - Mention prices |
| 102 | - Use "Our app does..." |
| 103 | - Write full sentences |
| 104 | |
| 105 | ## Visual Best Practices |
| 106 | |
| 107 | ### Device Frames |
| 108 | |
| 109 | | Approach | When to Use | |
| 110 | |----------|-------------| |
| 111 | | **With frames** | When device context matters, lifestyle apps | |
| 112 | | **Without frames** | Maximizing screen real estate, content apps | |
| 113 | | **3D angles** | Standing out, premium feel | |
| 114 | | **Flat/straight** | Clean, professional, enterprise | |
| 115 | |
| 116 | ### Backgrounds |
| 117 | |
| 118 | - **Solid colors:** Clean, professional, fast loading |
| 119 | - **Gradients:** Modern, dynamic, attention-grabbing |
| 120 | - **Lifestyle photos:** Context, emotion, aspiration |
| 121 | - **Abstract patterns:** Creative, unique, memorable |
| 122 | |
| 123 | ### Typography |
| 124 | |
| 125 | - Use 2 fonts max (headline + body) |
| 126 | - Minimum 60pt for headlines (iPhone) |
| 127 | - Ensure readability on small thumbnails |
| 128 | - Match your app's brand fonts if possible |
| 129 | |
| 130 | ## Screenshot Storyboard Template |
| 131 | |
| 132 | ``` |
| 133 | SCREENSHOT 1: HERO |
| 134 | ━━━━━━━━━━━━━━━━━━ |
| 135 | Caption: [Value proposition - max 6 words] |
| 136 | Visual: [Key screen showing main feature] |
| 137 | Background: [Color/gradient that pops] |
| 138 | Notes: [This is first impression - make it count] |
| 139 | |
| 140 | SCREENSHOT 2: CORE FEATURE |
| 141 | ━━━━━━━━━━━━━━━━━━━━━━━━━━ |
| 142 | Caption: [What can user do?] |
| 143 | Visual: [App in action, primary workflow] |
| 144 | Background: [Consistent with #1] |
| 145 | Notes: [Show the "aha" moment] |
| 146 | |
| 147 | SCREENSHOT 3: DIFFERENTIATOR |
| 148 | ━━━━━━━━━━━━━━━━━━━━━━━━━━━ |
| 149 | Caption: [What makes you unique?] |
| 150 | Visual: [Feature competitors don't have] |
| 151 | Background: [Can vary slightly] |
| 152 | Notes: [Answer "why this app?"] |
| 153 | |
| 154 | SCREENSHOT 4: SECONDARY FEATURE |
| 155 | ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ |
| 156 | Caption: [Another key benefit] |
| 157 | Visual: [Compelling secondary feature] |
| 158 | Background: [Consistent theme] |
| 159 | Notes: [Add depth to value proposition] |
| 160 | |
| 161 | SCREENSHOT 5: TRUST/CTA |
| 162 | ━━━━━━━━━━━━━━━━━━━━━━ |
| 163 | Caption: [Social proof or call to action] |
| 164 | Visual: [Reviews, stats, or final screen] |
| 165 | Background: [Strong finish] |
| 166 | Notes: [Close the deal] |
| 167 | ``` |
| 168 | |
| 169 | ## Size Requirements |
| 170 | |
| 171 | ### iPhone (Required) |
| 172 | | Size | Device | Dimensions | |
| 173 | |------|--------|------------| |
| 174 | | 6.7" | iPhone 15 Pro Max | 1290 × 2796 | |
| 175 | | 6.5" | iPhone 11 Pro Max | 1284 × 2778 | |
| 176 | | 5.5" | iPhone 8 Plus | 1242 × 2208 | |
| 177 | |
| 178 | ### iPad (If Universal) |
| 179 | | Size | Device | Dimensions | |
| 180 | |------|--------|------------| |
| 181 | | 12.9" | iPad Pro | 2048 × 2732 | |
| 182 | |
| 183 | ### macOS |
| 184 | | Display | Dimensions | |
| 185 | |---------|------------| |
| 186 | | Sta |
People who liked this also viewed
6 picksType
- seo-auditWhen the user wants to audit, review, or diagnose SEO issues on their site. Also use when the user mentions "SEO audit," "technical SEO," "why am I not ranking," "SEO issues," "on-page SEO," "meta tagSkillsJul 2026
- copywritingWhen the user wants to write, rewrite, or improve marketing copy for any page — including homepage, landing pages, pricing pages, feature pages, about pages, or product pages. Also use when the user sSkillsJul 2026
- marketing-psychologyWhen the user wants to apply psychological principles, mental models, or behavioral science to marketing. Also use when the user mentions 'psychology,' 'mental models,' 'cognitive bias,' 'persuasion,'SkillsJul 2026
- content-strategyWhen the user wants to plan a content strategy, decide what content to create, or figure out what topics to cover. Also use when the user mentions "content strategy," "what should I write about," "conSkillsJul 2026
- programmatic-seoWhen the user wants to create SEO-driven pages at scale using templates and data. Also use when the user mentions "programmatic SEO," "template pages," "pages at scale," "directory pages," "location pSkillsJul 2026
- marketing-ideasWhen the user needs marketing ideas, inspiration, or strategies for their SaaS or software product. Also use when the user asks for 'marketing ideas,' 'growth ideas,' 'how to market,' 'marketing stratSkillsJul 2026
