--- name: app-icon-optimization description: Brief and evaluate an app Product's App Store icon for tap-through in search and browse. Use for "app icon", "icon redesign", "is my icon good", "icon A/B test", "icon brief for a designer". For the screenshots use screenshot-optimization. metadata: version: 1.0.0 --- # App Icon Optimization The icon is the first element a visitor sees in search results and often the only visual competing in browse and charts; a stronger icon moves tap-through rate by 20–40% with no other change. Output is one `listing` Proposal for the icon change, which the User has designed, ships in a build and marks done the day it goes live, plus a brief with the **evaluation checklist** scored on the current icon and the **icon brief** for a designer. Score every icon, the Product's and the competitors', from the picture itself with `view_image`. ## Gather 1. `read_context` — brand colors, mood, category, ICP, competitors. 2. The icons, through `fetch_url` on iTunes: Lookup (`https://itunes.apple.com/lookup?id=&country=`) for the Product when `read_product_state` gives its App Store Surface's `appId`, Search (`https://itunes.apple.com/search?term=&entity=software&country=&limit=1`) by name otherwise and for each competitor named in the Foundation doc. Each result's `artworkUrl512` is its icon: look at the Product's and every competitor's with `view_image`. The Product's `primaryGenreId` leads to the category's top apps, in [`references/category-conventions.md`](references/category-conventions.md). 3. `connector_asc_screenshots` when the ASC Connector exists — the first three screenshots of the primary locale, which sit beside the icon in a search result; look at them with `view_image` to judge the icon in its row. 4. `connector_asc_analytics` when the ASC Connector exists — impressions → product page views per source (search, browse), 30 days plus trend: the tap-through baseline an icon test must beat. Without it, say the baseline is unknown and that a Product Page Optimization test on the icon reads its own conversion per treatment. ## Evaluate and brief Category conventions, the colors competitors cluster on, and the ways to stand apart are in [`references/category-conventions.md`](references/category-conventions.md) — read it once the category is known. Sizes, file rules and the icon test procedure are in [`references/icon-spec.md`](references/icon-spec.md) — read it when writing the Deliverables and Apply sections. What neither the reads nor the pictures tell you — the mood the brand aims for when the Foundation doc names none, brand colors it does not list, whether the app already ships alternate icons — is an assumption: state it as one in the brief and plan on it. Five principles drive both the checklist and the brief: 1. **Simplicity at small size** — the icon renders at 60 × 60 pt in search results: two elements at most, a silhouette that reads at a glance, mark instead of text. 2. **Contrast in both store themes** — legible on the light and the dark App Store background; a mid-tone or a subtle border keeps it from vanishing in either. 3. **Category language, then distance** — describe the cluster the top competitors form, then choose the element (color, mark style, background) that separates the Product from it while it still reads as the category. 4. **One memorable mark** — describable in three words; a scene or a composition fails this. 5. **Brand consistency** — the mark matches the palette in the Foundation doc and works as favicon, avatar and splash. ## Output: one Proposal for the icon, and the brief The icon change is one `propose` with `appStoreField: "icon"`: `content` describes the new icon — the mark, the background, the colors, the lever that separates it from the cluster; `why` names the checklist line it fixes and the tap-through baseline it must beat. The brief, saved with `save_output`, carries the reasoning: the **assumptions**, then the checklist, the brief, the A/B plan and Apply below. **Evaluation checklist**, scored for the current icon and for each concept: ``` Clarity at 60 × 60 pt [1–10] mark reads at a glance, no text Contrast, light and dark [1–10] legible on both store themes Category differentiation [1–10] stands apart from the competitor cluster Simplicity [1–10] ≤ 2 elements, describable in 3 words Brand alignment [1–10] matches the Foundation doc palette and mood Total [N/50] and the lowest line, which the brief fixes first ``` **Icon brief**: ``` Product: [name — one line] Category: [category] Audience: [ICP] Mood: [premium / playful / trustworthy / energetic / calm] Brand colors: [hex] The icon conveys: [core value or identity] Competitor cluster: [3–5 competitors, three words each, the shared pattern] Differentiation lever: [color / mark style / background] Deliverables: 3 concepts at 1024 × 1024 px, each mocked at 60 × 60 pt inside a search-result row, light and dark; final PNG, no alpha, square corners (Apple applies the mask) ``` **A/B plan** — one variable per treatment (background color, mark style, light vs dark background, character vs abstract), up to three treatments, metric = conversion per treatment in Product Page Optimization; the tested icons ship in the build before the test starts. **Apply** — the winning icon goes into the app binary (asset catalog) and ships with a version; App Store Connect → Product Page Optimization for the test. Done when the icon change has its Proposal, the checklist scores the current icon on all five lines from the picture, the brief names the competitor cluster and the differentiation lever, the deliverables include the 60 × 60 pt mock in both themes, and the A/B plan states the baseline or that it was unavailable. ## Related Skills - `screenshot-optimization` — the three screenshots shown beside the icon in search. - `category-positioning` — when the category itself is in question, settle it before the icon. - `competitors` — a deeper read of the competitor set the cluster is built from.