custom-product-pages

Generates Custom Product Page metadata templates with screenshot strategies, keyword targeting, and audience-specific messaging for up to 35 page variants. Use when creating targeted App Store pages for different audiences, ad campaigns, or traffic sources.

110 stars

Best use case

custom-product-pages is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Generates Custom Product Page metadata templates with screenshot strategies, keyword targeting, and audience-specific messaging for up to 35 page variants. Use when creating targeted App Store pages for different audiences, ad campaigns, or traffic sources.

Teams using custom-product-pages should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/custom-product-pages/SKILL.md --create-dirs "https://raw.githubusercontent.com/gustavscirulis/snapgrid/main/.claude/skills/skills/generators/custom-product-pages/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/custom-product-pages/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How custom-product-pages Compares

Feature / Agentcustom-product-pagesStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Generates Custom Product Page metadata templates with screenshot strategies, keyword targeting, and audience-specific messaging for up to 35 page variants. Use when creating targeted App Store pages for different audiences, ad campaigns, or traffic sources.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# Custom Product Pages Generator

Generate metadata templates for Custom Product Pages (CPPs) — targeted App Store product page variants optimized for specific audiences, ad campaigns, or traffic sources.

## When This Skill Activates

Use this skill when the user:
- Asks to create "custom product pages" or "targeted App Store pages"
- Mentions "different App Store pages for different audiences"
- Wants to create pages for specific ad campaigns (Apple Search Ads, social media)
- Asks about A/B testing product page messaging
- Has multiple user personas and wants tailored messaging

## Minimum Eligibility

**CPPs only make sense when you have enough traffic to meaningfully split across pages.**

| Monthly Impressions | Recommendation |
|--------------------|----|
| **Under 2,000** | Don't create CPPs. Focus on optimizing your single default page. You won't have enough traffic per page to know if it's working. |
| **2,000-10,000** | Create 1 CPP max for your most distinct audience segment or highest-spend ad campaign. Monitor for 4+ weeks. |
| **10,000-50,000** | Create 2-3 CPPs. Enough traffic to compare performance across pages. |
| **50,000+** | Full CPP strategy. Multiple pages per segment, ad campaign-specific pages, seasonal variants. |

**Exception:** If you're running paid Apple Search Ads campaigns, CPPs are valuable even at lower organic volume because ad traffic is directed specifically to your CPP — you're not splitting organic impressions.

## How Custom Product Pages Work

- You can create up to **35 custom product pages** per app
- Each page gets a unique URL you can share or use in ad campaigns
- You can customize: **screenshots**, **app previews**, and **promotional text**
- The app icon, name, subtitle, and description remain the same across all pages
- Each page can be localized independently
- Available on iOS 15+ and macOS 12+

### CPP vs Product Page Optimization (PPO)
| Feature | Custom Product Pages | Product Page Optimization |
|---------|---------------------|--------------------------|
| Purpose | Targeted pages for specific audiences | A/B test default page |
| Count | Up to 35 pages | Up to 3 treatments |
| Elements | Screenshots, previews, promo text | Icon, screenshots, previews |
| URL | Unique URL per page | Same URL, random distribution |
| Use with ads | Yes (assign to ad groups) | No |

## Configuration Questions

Ask user via AskUserQuestion:

1. **How many custom pages?**
   - 1 page (single audience variant)
   - 2-3 pages (A/B campaign testing)
   - 4+ pages (multi-audience strategy)

2. **What are your distinct audiences?**
   - Different user roles (e.g., students vs. professionals)
   - Different use cases (e.g., personal vs. business)
   - Different traffic sources (e.g., Instagram vs. Google)
   - Different geographies/languages

3. **What will you customize?**
   - Screenshots only
   - Screenshots + app previews
   - Screenshots + promotional text
   - All three

4. **Traffic sources for each page?**
   - Apple Search Ads
   - Social media (Instagram, TikTok, etc.)
   - Website/blog
   - Email campaigns
   - Influencer partnerships
   - Organic/direct link

## Generation Process

### Step 1: Audience Analysis

For each audience segment:
- Define the primary value proposition
- Identify pain points this audience has
- Determine which features matter most
- Choose the emotional angle (productivity, creativity, fun, savings)

### Step 2: Generate Page Metadata

For each custom page:
1. **Page name** (internal reference)
2. **Promotional text** (170 characters, customizable per page)
3. **Screenshot strategy** (which features to highlight, in what order)
4. **App preview strategy** (optional, what to show in video)
5. **URL** (generated by App Store Connect, but plan the naming)

### Step 3: Screenshot Sequencing

Design the screenshot order for each page to match the audience's priorities:
- **Screenshot 1**: The hook — the single most compelling feature for this audience
- **Screenshot 2-3**: Core value proof — features that solve their specific problem
- **Screenshot 4-5**: Depth and trust — breadth of features, social proof

### Step 4: Produce Strategy Document

## Output Format

```markdown
# Custom Product Pages Strategy: [App Name]

## Audience Segments

| Segment | Description | Traffic Source | Page URL |
|---------|-------------|---------------|----------|
| [Name] | [Who they are] | [Where they come from] | [CPP URL] |

---

## Page 1: [Audience Name]

### Audience Profile
- **Who**: [Description]
- **Pain point**: [What frustrates them]
- **Value prop**: [What you solve for them]
- **Traffic source**: [Where this page is linked]

### Promotional Text (170 chars)
> [Customized promotional text targeting this audience]

### Screenshot Strategy
| Position | Feature | Caption | Why This Audience Cares |
|----------|---------|---------|------------------------|
| 1 | [Feature] | [Caption text] | [Relevance to audience] |
| 2 | [Feature] | [Caption text] | [Relevance to audience] |
| 3 | [Feature] | [Caption text] | [Relevance to audience] |
| 4 | [Feature] | [Caption text] | [Relevance to audience] |
| 5 | [Feature] | [Caption text] | [Relevance to audience] |

### App Preview (if applicable)
- **Opening shot**: [What to show first]
- **Key demo**: [Core feature for this audience]
- **Closing CTA**: [Call to action]

### Keyword Alignment
Keywords this audience is likely searching for:
- [keyword 1]
- [keyword 2]
- [keyword 3]

---

## Page 2: [Audience Name]
[Same format as Page 1]

---

## Implementation Checklist

- [ ] Create custom pages in App Store Connect
- [ ] Upload audience-specific screenshots for each page
- [ ] Write promotional text for each page
- [ ] Get unique URLs for each page
- [ ] Configure Apple Search Ads to use specific pages (if applicable)
- [ ] Set up UTM tracking for non-ASA traffic sources
- [ ] Monitor conversion rates per page
- [ ] A/B test within pages after initial launch
```

## Strategy Templates by Use Case

### Multi-Persona App
Example: Productivity app for students, freelancers, and teams

| Page | Audience | Screenshot Focus | Promo Text Angle |
|------|----------|-----------------|-----------------|
| Default | General | Overview of all features | Broad appeal |
| CPP 1 | Students | Note-taking, study tools, price | "The study companion that..." |
| CPP 2 | Freelancers | Time tracking, invoicing, clients | "Manage your freelance..." |
| CPP 3 | Teams | Collaboration, sharing, admin | "Team productivity that..." |

### Campaign-Specific Pages
Example: Fitness app running ads on multiple channels

| Page | Channel | Visual Style | Messaging |
|------|---------|-------------|-----------|
| Default | Organic | Clean, professional | Feature-focused |
| CPP 1 | Instagram | Lifestyle, aspirational | Transformation stories |
| CPP 2 | Google Search | Results-oriented | Data and progress tracking |
| CPP 3 | Podcast | Social proof | "As heard on [podcast]" |

### Feature-Specific Pages
Example: Photo editing app with multiple use cases

| Page | Feature | Target Search Terms |
|------|---------|-------------------|
| Default | All features | "photo editor" |
| CPP 1 | Portrait mode | "portrait editor", "selfie" |
| CPP 2 | Filters | "photo filters", "instagram" |
| CPP 3 | Collage maker | "photo collage", "grid" |

## Measurement & Optimization

### Key Metrics per Page
- **Impressions**: How many people see the page
- **Conversion rate**: Impressions → Downloads
- **Retention**: Do users from this page stick around?
- **Revenue**: Do users from this page convert to paid?

### Optimization Cadence
1. **Week 1-2**: Launch all pages, gather baseline data
2. **Week 3-4**: Identify best and worst performing pages
3. **Month 2**: Iterate screenshots on underperforming pages
4. **Month 3**: Test new promotional text variations
5. **Ongoing**: Refresh screenshots quarterly, adjust for seasonal relevance

## References

- Related: `generators/product-page-optimization` — A/B test the default page
- Related: `app-store/screenshot-planner` — Screenshot design and sequencing
- Related: `app-store/keyword-optimizer` — Keyword strategy per audience
- Related: `app-store/marketing-strategy` — Overall promotional strategy

Related Skills

product-agent

110
from gustavscirulis/snapgrid

Discover and validate product ideas, analyze markets, scope MVPs, and optimize app store presence for iOS/macOS apps. Use when user asks to discover, validate, assess, scope, or analyze product ideas, market opportunities, or when they mention "product agent", "app idea validation", "should I build this", "MVP", "market analysis", or "ASO".

product-development

110
from gustavscirulis/snapgrid

End-to-end product development for iOS/macOS apps. Covers market research, competitive analysis, PRD generation, architecture specs, UX design, implementation guides, testing, and App Store release. Use for product planning, validation, or generating specification documents.

product-page-optimization

110
from gustavscirulis/snapgrid

Generates A/B test plans and optimization checklists for your App Store product page — icon, screenshots, and app previews. Use when running Product Page Optimization tests or improving conversion rates.

swiftui-ui-patterns

110
from gustavscirulis/snapgrid

Best practices and example-driven guidance for building SwiftUI views and components. Use when creating or refactoring SwiftUI UI, designing tab architecture with TabView, composing screens, or needing component-specific patterns and examples.

watchOS

110
from gustavscirulis/snapgrid

watchOS development guidance including SwiftUI for Watch, Watch Connectivity, complications, and watch-specific UI patterns. Use for watchOS code review, best practices, or Watch app development.

visionos-widgets

110
from gustavscirulis/snapgrid

visionOS widget patterns including mounting styles, glass/paper textures, proximity-aware layouts, and spatial widget families. Use when creating or adapting widgets for visionOS.

test-data-factory

110
from gustavscirulis/snapgrid

Generate test fixture factories for your models. Builder pattern and static factories for zero-boilerplate test data. Use when tests need sample data setup.

test-contract

110
from gustavscirulis/snapgrid

Generate protocol/interface test suites that any implementation must pass. Define the contract once, test every implementation. Use when designing protocols or swapping implementations.

tdd-refactor-guard

110
from gustavscirulis/snapgrid

Pre-refactor safety checklist. Verifies test coverage exists before AI modifies existing code. Use before asking AI to refactor anything.

tdd-feature

110
from gustavscirulis/snapgrid

Red-green-refactor scaffold for building new features with TDD. Write failing tests first, then implement to pass. Use when building new features test-first.

tdd-bug-fix

110
from gustavscirulis/snapgrid

Fix bugs using red-green-refactor — reproduce the bug as a failing test first, then fix it. Use when fixing bugs to ensure they never regress.

snapshot-test-setup

110
from gustavscirulis/snapgrid

Set up SwiftUI visual regression testing with swift-snapshot-testing. Generates snapshot test boilerplate and CI configuration. Use for UI regression prevention.