PluginBench
Skill
Pass
Audit score 90

app-icon-optimization

eronred/aso-skills

Design, audit, and A/B test app icons to maximize tap-through rate in App Store search and browse.

What is app-icon-optimization?

This skill helps optimize app icons—the first visual element users see in App Store search results—to increase tap-through rate and install conversions. Use it when designing new icons, auditing existing ones, or running A/B tests on icon variants.

  • Design icons following simplicity, contrast, and category differentiation principles
  • Audit current icons against clarity, color contrast, recognizability, and brand alignment
  • Set up and interpret A/B tests on iOS (App Store Connect) and Android (Play Console)
  • Create design briefs for icon designers with competitive analysis and mood direction
  • Test icon variables (color, mark style, dark vs. light, character vs. abstract) one at a time
  • Evaluate icons at actual small sizes (60×60px) to ensure legibility in search results

How to install app-icon-optimization

npx skills add https://github.com/eronred/aso-skills --skill app-icon-optimization
Claude Code
Cursor
Windsurf
Cline

How to use app-icon-optimization

  1. 1.Identify your app's category and review the top 10–20 competitor icons to understand visual norms
  2. 2.Evaluate your current icon using the audit checklist (clarity, contrast, differentiation, simplicity, brand alignment)
  3. 3.If redesigning: create a design brief specifying mood, brand colors, what to convey, and competitors to differentiate from
  4. 4.Generate 3 distinct icon concepts and test each at 60×60px in a mockup of the App Store search context
  5. 5.For A/B testing on iOS: go to App Store Connect → Product Page Optimization → Create Test and upload up to 3 variants
  6. 6.For A/B testing on Android: use Play Console → Store listing experiments and set traffic split
  7. 7.Run tests for minimum 7 days or until 1,000+ impressions per variant; measure install conversion rate
  8. 8.Compare results at p < 0.05 significance threshold and implement the winning variant

Use cases

Good for
  • Redesigning an app icon to stand out from 20+ competitors in a crowded category
  • Running an A/B test to compare three color variants and measure install lift
  • Auditing why an icon may be underperforming in tap-through rate
  • Creating a design brief for a freelance designer with competitive references and constraints
  • Testing whether adding text to an icon improves or hurts conversion
Who it's for
  • App Store Optimization (ASO) specialists
  • Product managers launching or refreshing apps
  • Indie developers optimizing their app listings
  • Design teams working on app branding
  • Growth marketers focused on install conversion rates

app-icon-optimization FAQ

What size should I submit my app icon?

Submit a single 1024×1024px PNG master file with no transparency and no rounded corners (Apple applies the mask automatically). Test designs at 60×60px to ensure the mark remains clear and recognizable at the small size used in search results.

How much can a better icon improve tap-through rate?

A compelling icon can lift tap-through rate by 20–40% with no other changes. The icon is the first thing users see in search results, making it your most impactful asset for driving installs.

Should I include text in my app icon?

No. Text is illegible at small sizes (60×60px in search results), and Apple discourages it. Focus on a single, memorable mark that is recognizable at a glance.

How do I know if my icon works in both light and dark mode?

Test your icon against both white (light mode) and dark backgrounds. Avoid pure white icons (disappear in light mode) and very dark icons (disappear in dark mode). Consider adding a subtle shadow or border to ensure contrast on both.

How long should I run an A/B test?

Run tests for a minimum of 7 days or until you have 1,000+ impressions per variant. Use the confidence indicator in App Store Connect or Play Console to confirm statistical significance (p < 0.05) before declaring a winner.

Full instructions (SKILL.md)

Source of truth, from eronred/aso-skills.


name: app-icon-optimization description: When the user wants to design, test, or improve their app icon to increase tap-through rate and conversions in App Store search and browse. Use when the user mentions "app icon", "icon design", "icon A/B test", "icon variants", "tap-through rate", "icon conversion", "icon refresh", or wants to know what makes a good app icon. For screenshot optimization, see screenshot-optimization. For full listing A/B tests, see ab-test-store-listing. metadata: version: 1.0.0

App Icon Optimization

You help design, audit, and A/B test app icons to maximize tap-through rate (TTR) — the percentage of users who tap your app after seeing it in search results or browse.

Why the Icon Is Your Most Impactful Asset

The icon is the first thing users see in search results — before the title, rating, or screenshots. A compelling icon can lift TTR by 20–40% with no other changes. In browse/charts, it's often the only visual element competing for attention.

Icon Design Principles

1. Simplicity at Small Size

Icons render at 60×60pt (iPhone search results). At that size, detail disappears.

  • Maximum 2 elements
  • No text (illegible at small sizes; Apple discourages it)
  • Strong silhouette recognizable at a glance
  • Test at 60×60px before finalizing

2. Color Contrast Against the App Store Background

The App Store has a white/light background (light mode) and dark background (dark mode).

  • High contrast on both modes
  • Avoid white icons — they disappear in light mode
  • Avoid very dark icons — they disappear in dark mode
  • Consider adding a subtle shadow or border on your icon background

3. Category Visual Language

Match and differentiate from your category norms:

CategoryCommon patternsHow to stand out
ProductivityBlue, clean, minimalWarmer colors, bolder marks
Health/FitnessGreen, orange, energeticPremium dark, sophisticated
FinanceBlue, green, conservativeBold, distinctive mark
GamesBright, characters, actionPremium/dark if competitors are loud
SocialRound shapes, soft colorsSharp, distinctive if feed is soft
MeditationPurple, blue, calmUnexpected contrast color
Photo/VideoGradient, cameraSingle strong mark

Rule: Look at your top 20 competitors' icons. Then design to be immediately distinguishable.

4. Recognizable Mark

The icon needs a single, memorable mark — not a scene or a composition. Ask:

"Can someone describe this icon in 3 words?"

  • ✅ "Red speech bubble" | ❌ "Someone using a phone with a gradient"
  • ✅ "Bold orange flame" | ❌ "Abstract colorful shapes"

5. Brand Consistency

The icon is your brand mark in the App Store. It should:

  • Match your app's primary color palette
  • Be consistent with your splash screen, push notifications, and marketing
  • Work as a favicon, social media avatar, and press kit asset

Icon Sizes Required

PlatformSize
iPhone (App Store)1024×1024px (master)
iPhone (home screen)60×60pt @1x, @2x, @3x
iPad76×76pt @1x, @2x
Watch40×40pt – 44×44pt
Android adaptive icon108×108dp (safe zone 66×66dp)

Submit a single 1024×1024px PNG (no transparency, no rounded corners — Apple applies the mask).

A/B Testing Icons

iOS — Product Page Optimization

  1. App Store Connect → Your App → Product Page Optimization → Create Test
  2. Create up to 3 icon variants
  3. Set traffic allocation (20–33% per variant)
  4. Run for minimum 7 days or until statistical significance

Access: App Store Connect → App Store → Product Page Optimization

Android — Play Store Experiments

  1. Play Console → Store listing experiments → New experiment
  2. Upload up to 3 icon variants
  3. Set traffic split
  4. Google reports install conversion rate per variant

What to Test

Test one variable at a time:

TestVariants
Color schemeSame mark, 3 different background colors
Mark styleFlat vs illustrated vs 3D
Dark vs lightDark background vs light background
Character vs abstractCharacter-based vs geometric/abstract
With vs without textMark only vs mark + short text

Reading Results

  • Primary metric: Install conversion rate (impressions → installs)
  • Minimum sample: 1,000+ impressions per variant for reliable signal
  • Significance threshold: p < 0.05 or Appeeky/Play Console confidence indicator

Icon Audit

Evaluate your current icon against:

Clarity at 60×60px:        [1–10]
  - Recognizable mark at small size?
  - No illegible text?

Color contrast:            [1–10]
  - Works on white (light mode)?
  - Works on dark backgrounds (dark mode)?

Category differentiation:  [1–10]
  - Stands out from top 10 competitor icons?

Simplicity:                [1–10]
  - Max 2 elements?
  - Describable in 3 words?

Brand alignment:           [1–10]
  - Consistent with app's visual identity?

Overall: [N]/50

Brief for Icon Designer

When briefing a designer:

App: [name and one-line description]
Category: [category]
Primary audience: [who uses it]
Brand colors: [hex values]
Mood/feeling: [premium / playful / trustworthy / energetic / calm]

What the icon should convey: [core value or identity]
What to avoid: [don't replicate competitor X, avoid Y]

Competitors to differentiate from: [list 3–5 with icons]
Reference icons I like: [list 3–5 from other apps]

Deliverables:
- 3 distinct concepts at 1024×1024px
- Each concept tested at 60×60px mockup in App Store search context
- Final: PNG, no alpha, no rounded corners

Related Skills

  • ab-test-store-listing — Full A/B testing methodology
  • screenshot-optimization — Complement the icon with strong screenshots
  • android-aso — Android adaptive icon requirements
  • aso-audit — Icon is one factor in the full ASO score

Related skills

More from eronred/aso-skills and the wider catalog.

APapp-launch logo

app-launch

eronred/aso-skills

Plan and execute a successful mobile app launch with pre-launch ASO, timeline, and amplification tactics.

2.0k installs
APapp-marketing-context logo

app-marketing-context

eronred/aso-skills

Create a comprehensive marketing context document that guides all ASO and app marketing decisions.

2.0k installsAudited
APapp-preview-video logo

app-preview-video

eronred/aso-skills

When the user wants to plan, script, produce, or optimize App Store Preview videos or Google Play promo videos — the autoplay videos that show in App Store/Play Store search and product pages. Use when the user mentions "App Preview", "preview video", "app store video", "promo video", "Play Store video", "video poster frame", "YouTube promo for Play Store", "30 second app video", "video script", "video specs", or "should I add a preview video". For static screenshots, see screenshot-optimization. For A/B testing the video, see ab-test-store-listing. For broader creative briefs, see screenshot-optimization (covers stills).

638 installsAudited
APapp-rejection-recovery logo

app-rejection-recovery

eronred/aso-skills

When the user's app or update was rejected by Apple App Review or Google Play Review and they need to diagnose why, fix it, and resubmit fast. Use when the user mentions "app rejected", "App Review rejection", "guideline violation", "Apple rejected my app", "Google Play rejected", "Play policy violation", "Resolution Center", "metadata rejection", "binary rejection", "guideline 2.1", "guideline 4.3", "guideline 5.1.1", "Sign in with Apple required", "Apple ID rejection", "Play Store suspension", "appeal", "I need to respond to App Review", or "expedited review". For pre-submission listing health, see aso-audit. For metadata-only fixes, see metadata-optimization.

608 installs
APapp-store-featured logo

app-store-featured

eronred/aso-skills

Get your app featured on the App Store by understanding Apple's editorial process and optimization strategy.

2.0k installsAudited
APapple-search-ads logo

apple-search-ads

eronred/aso-skills

Set up, optimize, and scale Apple Search Ads campaigns with keyword bidding, match types, and ROAS targeting.

1.5k installsAudited