Describe your product type and get a complete e-commerce product page UX spec - from hero image gallery to purchase flow to cross-sells.
Paste into any LLM with your product details. Use the output to redesign your product pages or brief your design team.
You are a conversion-focused e-commerce UX designer who has optimized product pages for brands generating $100M+ in annual online revenue. Product type: [APPAREL/ELECTRONICS/BEAUTY/FOOD/FURNITURE/SOFTWARE/SUBSCRIPTION BOX] Average order value: [UNDER $50/$50-200/$200-1000/$1000+] Primary device: [MOBILE-FIRST/DESKTOP-FIRST/BALANCED] Key purchase barrier: [PRICE CONCERN/FIT UNCERTAINTY/TRUST/COMPLEXITY/COMPARISON SHOPPING] Platform: [SHOPIFY/WOOCOMMERCE/CUSTOM/HEADLESS] Design a high-converting product page: **1. Above-the-Fold Layout** - Image gallery: carousel vs grid, number of images, zoom behavior - Product title hierarchy and badge placement (New, Sale, Bestseller) - Price display: regular, sale, per-unit, installment options - Variant selector: color swatches, size grid, quantity stepper - Add to cart button: size, color, position, sticky behavior on scroll - Urgency/scarcity elements: stock level, limited time, viewer count - Trust signals position: reviews stars, shipping info, return policy icons **2. Image Gallery UX** - Primary image requirements (aspect ratio, background, quality) - Thumbnail navigation (position, count, scroll behavior) - Mobile: swipe carousel with dot indicators - Desktop: side thumbnails with hover zoom - Video placement within gallery - 360-degree view or AR try-on integration - User-generated photos section **3. Product Information Architecture** - Short description (above fold, 2-3 sentences) - Feature highlights (icon + short text format) - Detailed description (below fold, expandable) - Specifications table (dimensions, materials, care instructions) - Size guide (pop-up or inline, with fit recommendations) - FAQ section (product-specific, 5-8 questions) - Content display: tabs vs accordion vs long scroll decision **4. Social Proof & Trust** - Review summary (star average, count, distribution bar) - Review filtering and sorting (verified, with photos, by rating) - Individual review layout (stars, text, photos, helpful vote) - Q&A section (community questions and answers) - Expert endorsements or certifications - "As seen in" media mentions **5. Purchase Enhancement** - Frequently bought together (bundle suggestion) - Compare with similar products (feature table) - Recently viewed carousel - Wishlist / save for later functionality - Share button (native share sheet on mobile) - Back-in-stock notification for sold-out variants **6. Mobile-Specific Optimizations** - Sticky add-to-cart bar (bottom of screen) - Image gallery as full-width swipe - Collapsible sections for long content - Quick add from collection pages - Apple Pay / Google Pay express checkout - Thumb-zone-aware button placement **7. Performance Requirements** - Image lazy loading strategy - Skeleton screen for initial load - Above-the-fold content first (defer reviews, suggestions) - Maximum acceptable load times per section Specify exact measurements, behaviors, and interaction details. Include A/B testing suggestions for uncertain decisions.