In [Part 1] , we covered metadata and keyword strategy for iOS App Store Optimization. Now, let's dive into the visual elements that convert store visitors into users: app icons, screenshots, and app preview videos.
Visual assets are your app's first impression. While metadata helps users find your app, visuals convince them to download it. Apple provides specific tools and guidelines for optimizing these elements.
1. App Icon Design
Your app icon appears in search results, category listings, and on users' devices after download. It needs to be instantly recognizable and communicate your app's purpose at a glance.
Apple's Icon Requirements
- Size: 1024 x 1024 pixels (uploaded to App Store Connect)
- Format: PNG or JPEG
- Color Space: RGB
- No transparency: Icons must have a solid background
- No rounded corners: iOS applies corners automatically
Icon Strategy for FitTrack
For FitTrack (our fitness app example):
- Simple dumbbell icon with bold colors
- High contrast between foreground and background
- Recognizable at all sizes (from tiny search results to larger App Store listings)
Icon Consistency
Your icon should:
- Align with your brand colors
- Be consistent across updates (maintain recognition)
- Stand out from competitors in your category
Important: Apple reviews icons for compliance with App Store guidelines. Avoid:
- Using Apple's system icons or imagery
- Including screenshots or UI elements
- Violating trademark or copyright
2. Screenshots Optimization
Screenshots are displayed on your App Store product page and are crucial for conversion. Apple allows up to 10 screenshots per device type, and they can be different for iPhone and iPad.
Screenshot Specifications
iPhone:
- Up to 10 screenshots
- Required sizes depend on device (iPhone 6.7" display, 6.5" display, or 5.5" display)
- Aspect ratios must match actual device screens
iPad:
- Up to 10 screenshots
- Separate from iPhone screenshots
- Can showcase iPad-specific features
The First 3 Screenshots Rule
Users see the first 2-3 screenshots without scrolling. These are your most valuable real estate.
For FitTrack, the first 3 screenshots should highlight:
-
Screenshot 1: Main workout logging screen
- Show the core functionality immediately
- Add caption: "Track Every Workout"
-
Screenshot 2: Progress analytics dashboard
- Demonstrate value (results users can achieve)
- Add caption: "Visualize Your Progress"
-
Screenshot 3: Exercise library or meal planning
- Show additional key features
- Add caption: "Plan Your Nutrition"
Using Captions
Text overlays help users understand what they're seeing:
- Keep captions short (3-6 words)
- Use large, readable fonts
- Ensure text contrasts with background
Example for FitTrack:
Screenshot 1: "Log Workouts in Seconds"
Screenshot 2: "Track Your Strength Gains"
Screenshot 3: "Personalized Training Plans"
Show Real UI
Use actual app screens rather than marketing graphics:
- Display genuine app interface
- Show realistic data (not lorem ipsum)
- Use clean, uncluttered screens
Maintain Visual Consistency
- Use the same color scheme across all screenshots
- Apply consistent caption styling
- Keep backgrounds uniform
Screenshot Sequence Strategy
Recommended order:
- Core functionality — What your app does
- Key results — What users achieve
- Supporting features — Additional benefits
- Social proof — Ratings, testimonials (if applicable)
- Call to action — Final nudge to download
For FitTrack:
- Workout logging interface
- Progress charts showing improvement
- Exercise library with instructions
- Meal planning and nutrition tracking
- Community features or achievements
Device-Specific Screenshots
You can upload different screenshots for:
- iPhone
- iPad
- Apple Watch (if your app supports it)
Tailor screenshots to each device's strengths. For example, iPad screenshots can show more complex layouts that take advantage of larger screen real estate.
3. App Preview Videos
App Preview videos are short clips (15-30 seconds) that autoplay when users view your App Store listing. They provide an immediate sense of your app's interface and functionality.
Video Specifications
Technical Requirements:
- Length: 15-30 seconds
- Format: .mp4 or .mov
- Resolution: Matches device screen size
- Orientation: Portrait or landscape (based on app)
- Audio: Optional but recommended
Upload Limit:
- Up to 3 app preview videos per device type
- Different videos for iPhone and iPad
Video Content Strategy
First 3-5 Seconds Matter Most
Videos autoplay on mute. Hook users immediately with:
- Your app's main screen or action
- Clear demonstration of core functionality
- No lengthy intro animations or logos
For FitTrack video structure:
Seconds 0-5: Show user opening app and starting a workout
Seconds 6-15: Display logging exercises with quick taps
Seconds 16-25: Show progress charts updating
Seconds 26-30: Display meal planning feature
Video Best Practices
Show Real Interaction
Demonstrate actual app usage:
- Tap buttons
- Swipe between screens
- Show real workflows
Keep It Simple
Focus on 2-3 core features:
- Don't try to show everything
- Avoid rapid scene changes
- Give each feature a few seconds
Add Captions
Since videos autoplay on mute:
- Use on-screen text to explain actions
- Keep text minimal and readable
- Ensure captions are visible on small screens
Example for FitTrack:
- Caption 1: "Log workouts easily"
- Caption 2: "Track your progress"
- Caption 3: "Plan your meals"
Video Production Tips
Screen Recording
Use actual device recordings:
- iPhone or iPad screen recording
- Clean, updated iOS version
- Remove personal data or notifications
Editing
- Trim unnecessary frames
- Speed up slow actions slightly (1.2-1.5x)
- Add smooth transitions between scenes
- Export in highest quality
4. Product Page Optimization (A/B Testing)
Apple provides a feature called Product Page Optimization that allows you to test different variations of your visual assets.
What You Can Test
- App icons
- Screenshots (all or specific ones)
- App preview videos
Important: You cannot test metadata (title, subtitle, keywords) through this feature.
How Product Page Optimization Works
-
Create treatments in App Store Connect
- Up to 3 treatments at a time
- Each treatment can vary icon, screenshots, or videos
-
Set traffic allocation
- Distribute visitors across original and treatments
- Apple recommends running tests for at least 2-4 weeks
-
Measure results
- Track conversion rate (product page views to downloads)
- View impressions and downloads per treatment
-
Apply winner
- Make the winning treatment your default
- Start new test with different variations
Testing Strategy for FitTrack
Test 1: Icon Variations
- Original: Red dumbbell icon
- Treatment A: Orange dumbbell with circular background
- Treatment B: Minimalist barbell design
Measure: Which icon generates highest conversion rate
Test 2: Screenshot Order
- Original: Workout logging → Progress → Nutrition
- Treatment A: Progress → Workout logging → Nutrition
- Treatment B: Real transformation photos → Features
Measure: Which order converts better
Best Practices for A/B Testing
Test One Element at a Time
Don't change icon AND screenshots simultaneously. You won't know which drove results.
Give Tests Enough Time
- Minimum 2 weeks
- Wait for statistical significance
- Consider seasonality (January fitness rush vs. summer)
Test Meaningful Variations
Small tweaks may not show measurable differences. Test notably different approaches.
For FitTrack examples:
- Icon color: Red vs. Blue (meaningful)
- Screenshot caption font: Arial vs. Helvetica (too subtle)
Document Your Learnings
Keep records of:
- What you tested
- Results (conversion rate changes)
- Insights for future tests
5. Localization of Visual Assets
If your app serves multiple regions, consider localizing your visual assets beyond just text translation.
What to Localize
Screenshots:
- Translate all on-screen text and captions
- Use culturally appropriate imagery
- Consider different user preferences by region
App Preview Videos:
- Add subtitles in local language
- Adjust pacing for different markets
- Use region-specific examples if relevant
Icons:
- Generally keep consistent for brand recognition
- Rare exceptions for cultural sensitivities
Localization Strategy for FitTrack
For Spanish-speaking markets:
- Translate screenshot captions: "Track Every Workout" → "Registra Cada Entrenamiento"
- Use metric system in progress charts (kg instead of lbs)
- Feature exercises popular in that region
Implementation in App Store Connect
Apple allows you to upload different visual assets for each language/region:
- Select language in App Store Connect
- Upload localized screenshots and videos
- Keep icon consistent unless necessary
Putting It All Together: Complete Visual Strategy for FitTrack
App Icon
- Simple red dumbbell on dark gradient background
- High contrast, recognizable at all sizes
- Consistent with fitness/energy theme
Screenshots (First 3)
Screenshot 1: Workout logging interface
- Caption: "Log Workouts in Seconds"
- Shows clean UI with exercise list
Screenshot 2: Progress analytics
- Caption: "Track Your Strength Gains"
- Displays charts showing improvement over time
Screenshot 3: Exercise library
- Caption: "200+ Exercise Instructions"
- Shows detailed movement guide
App Preview Video (25 seconds)
- 0-5s: User opens app, taps "Start Workout"
- 6-15s: Logs 3 exercises quickly
- 16-22s: Views progress chart updating
- 23-25s: Checks meal plan for the day
A/B Testing Plan
Quarter 1: Test icon variations (color and style)
Quarter 2: Test screenshot order (feature-first vs. benefit-first)
Quarter 3: Test video focus (workout features vs. nutrition features)
Measuring Visual Asset Performance
Track these metrics in App Store Connect → App Analytics:
Key Metrics
Product Page Views
- How many users viewed your full app listing
- Indicates interest from search/browse
Conversion Rate
- Percentage of viewers who downloaded
- Direct measure of visual asset effectiveness
Retention Rate
- Users who keep app after download
- Indicates whether visuals set accurate expectations
Using App Analytics
Navigate to App Store Connect:
- Analytics → Metrics
- Select date range
- Compare periods before/after visual updates
- Review conversion rate trends
For FitTrack, track:
- Conversion rate changes after icon update
- Impact of new screenshots on downloads
- Video view completion rate (if available)
Conclusion
Visual optimization is critical for converting App Store visitors into users. Focus on a clear, simple icon, impactful first-three screenshots, and a concise app preview video.
In Part 3, we'll cover growth tactics: ratings, reviews, updates, and localization strategies to sustain long-term ASO success.
*This is Part 2 of our 3-part iOS ASO series. Read [Part 1: Metadata & Keyword Strategy]
Top comments (1)
Apple's Icon Requirements