top-app-ux-patternslisted

# Top App UX Patterns — What the Best-in-Class Shopify Apps Actually Do A teardown-driven playbook for designing or reviewing Shopify app UX. Built from a live analysis of six top-grossing apps (Klaviyo, Gorgias, Judge.me, Loox, Vitals, PageFly) representing an estimated $70M–$110M of combined Shopify-channel MRR. Use this skill to lift the converged patterns instead of inventing UX from scratch. --- ## 1. When to use Trigger this skill whenever you are: - Designing or reviewing a Shopify App Store **listing page** (hero, gallery, description, pricing cards, "Works with") - Designing the **first-run / install / OAuth → first value** flow - Designing **empty states** for any in-app screen (dashboard, settings, builder, etc.) - Designing the **pricing page** or choosing a pricing structure (flat / tiered / slot-based / usage-based) - Picking the **single addictive metric** for the merchant's dashboard - Reviewing UX for **install→activate→pay** conversion leaks - Comparing a competitor's UX against the converged best-practice set - Auditing copy on the listing or in-app for "outcome vs feature" framing - Choosing how to handle theme integration (theme code edits vs App Blocks / OS 2.0) - Deciding what onboarding data to collect at install vs. defer Do not use this skill for: backend architecture, billing implementation details (use `shopify-app-builder:app-billing`), or scope minimization (use `shopify-app-builder:audit-scopes`). This skill is purely about **what merchant