Mobile Experience

​

Mobile Works Automatically

Looksy is built for mobile and works perfectly without any additional setup or optimization.

​

Native Camera Integration

When customers take selfies on mobile:

• Uses the native camera app on their device
• Quick, familiar, and intuitive
• Works on iOS and Android automatically
• No special permissions or setup required

​

What You Get on Mobile

Works automatically:

• Responsive button sizing
• Touch-friendly tap targets
• Native camera access
• Fast performance on mobile networks
• All browsers (Safari, Chrome, Firefox, Samsung Internet)
• All devices (phones and tablets)

​

Mobile User Experience

​

Customer Flow:

1. Tap “Try On” on product image
2. Take selfie using native camera OR upload from library
3. See result in 15-20 seconds

That’s it. Simple, fast, and works perfectly.

​

No Testing Required

You don’t need to:

• Test on different mobile browsers
• Test on different devices (iPhone, Android, tablets)
• Optimize button placement for mobile
• Add custom CSS for mobile responsiveness
• Check mobile performance

​

Customizing for Mobile

Button customization (colors, text, corner position) applies to both desktop and mobile automatically. To customize:

1. Go to Looksy dashboard
2. Click “Customize Button”
3. Adjust styling
4. Changes apply to desktop, mobile, and tablet

​

Mobile vs Desktop Usage Statistics

​

Why Mobile Matters

E-commerce mobile traffic data:

• 72% of Shopify traffic comes from mobile devices
• 65% of online purchases happen on mobile
• Mobile conversion rates average 1.8% vs 3.2% desktop
• Mobile users abandon carts 85% of time (vs 73% desktop)

Virtual try-on mobile data:

• 78% of virtual try-ons happen on mobile devices
• Mobile try-on users convert 22% higher than desktop
• Mobile engagement is 15% higher than desktop

---

​

Technical Architecture for Mobile

​

How Looksy Handles Mobile

WebAR Technology:

• Runs directly in mobile browser (no app download)
• Uses device camera via browser APIs
• Processes images on Looksy’s servers (not on device)
• Returns results to browser for display

Why this approach works:

• No app download friction (80% drop-off if app required)
• Works across all devices and browsers
• No device storage or processing requirements
• Instant access for customers

---

​

Mobile Performance Optimization

Built-in optimizations: 1. Lazy Loading

• Button loads only when needed
• Doesn’t block initial page load
• Minimal impact on page speed (< 50KB)

2. Async Processing

• Image upload happens in background
• Processing on cloud servers
• Progressive result loading

3. Network Optimization

• Image compression for uploads (reduces data usage)
• CDN delivery for global performance
• Works on 3G, 4G, 5G networks

4. Battery Efficiency

• No continuous camera usage
• Single-shot photo upload
• Minimal CPU usage on device

---

​

iOS vs Android Compatibility

​

iOS (iPhone & iPad)

Supported versions:

• iOS 13+ (iPhone 6S and newer)
• iPad OS 13+
• Safari, Chrome, Firefox browsers

Performance:

• Average try-on time: 16 seconds
• Camera access: Native iOS camera integration
• Upload from library: Full Photos app access

Known limitations:

• iOS 12 and older: Not supported
• Private browsing: Camera may require extra permission

---

​

Android Compatibility

Supported versions:

• Android 8+ (most devices from 2017+)
• All major browsers (Chrome, Firefox, Samsung Internet, Edge)

Performance:

• Average try-on time: 17 seconds
• Camera access: Native Android camera
• Upload from library: Gallery app integration

Device variations:

• Works across Samsung, Google Pixel, OnePlus, Huawei, etc.
• No device-specific optimizations needed
• Consistent experience across manufacturers

---

​

Tablet Support

iPad:

• Full support for all iPad models with iOS 13+
• Optimized for larger screen size
• Same features as iPhone

Android Tablets:

• Samsung Galaxy Tab, Fire tablets, etc.
• Full support on Android 8+
• Responsive layout adapts to tablet screens

---

​

Camera Permissions & Privacy

​

How Camera Access Works

First-time user flow:

1. Customer taps “Try On”
2. Browser requests camera permission
3. Customer approves (one-time)
4. Camera opens for selfie
5. Permission remembered for future visits

No permission required for:

• Uploading from photo library
• Browsing products
• Using try-on on desktop

---

​

Camera Permission Best Practices

iOS Safari:

• Settings → Safari → Camera → Allow
• Per-site permissions (customer approves once)
• Private browsing requires permission each time

Android Chrome:

• Settings → Site Settings → Camera → Allow
• Permission remembered across sessions
• Works in incognito mode

Troubleshooting denied permissions:

• Customer can reset in browser settings
• Alternative: Use “Upload from library” instead
• Clear instructions provided in modal

---

​

Privacy & Security on Mobile

Data handling:

• Photos processed in memory only
• Never stored on Looksy servers
• Transmitted via HTTPS encryption
• Deleted immediately after rendering

Customer privacy:

• No photo retention
• No training on customer images (without consent)
• GDPR and CCPA compliant
• No tracking or profiling

---

​

Mobile Network Considerations

​

Performance on Different Networks

5G:

• Upload: < 1 second
• Processing: 15 seconds
• Total: ~16 seconds

4G LTE:

• Upload: 2-3 seconds
• Processing: 15 seconds
• Total: ~18 seconds

3G:

• Upload: 5-8 seconds
• Processing: 15 seconds
• Total: ~23 seconds

WiFi:

• Upload: < 1 second
• Processing: 15 seconds
• Total: ~16 seconds

---

​

Data Usage

Per try-on:

• Upload selfie: ~500KB (after compression)
• Download result: ~400KB
• Total per try-on: ~1MB

For customer:

• 10 try-ons = ~10MB data usage
• Negligible for most mobile data plans
• WiFi recommended for best experience

---

​

Mobile-Specific Analytics

​

Track Mobile Performance

In Looksy Dashboard:

• Device breakdown: Mobile vs desktop vs tablet
• OS breakdown: iOS vs Android
• Browser breakdown: Safari vs Chrome vs others
• Mobile conversion rates: Track separately

Key mobile metrics:

• Mobile engagement rate (typically 25-35%)
• Mobile conversion lift (typically 20-28%)
• Mobile vs desktop performance comparison

---

​

Mobile Behavior Patterns

Typical mobile user:

• Browses on commute or in bed
• More impulsive purchases
• Higher engagement with visual features (like try-on)
• Lower patience for load times

Optimization insights:

• Mobile users try on more products (3.2 avg vs 2.4 desktop)
• Mobile try-on → purchase time: 2.5 hours (vs 4.7 hours desktop)
• Mobile users more likely to share results socially

---

​

Progressive Web App (PWA) Considerations

​

Looksy & PWA Compatibility

Works with PWA stores:

• Full compatibility with Shopify PWA themes
• Try-on button renders correctly
• Camera access works in PWA
• No additional configuration needed

Benefits in PWA:

• Faster page loads (cached assets)
• Offline product browsing (try-on requires internet)
• Add to home screen functionality
• Native app-like experience

---

​

Mobile Checkout Integration

​

Try-On to Purchase Flow

Mobile user journey:

1. Browse products on phone
2. Use virtual try-on
3. Add to cart (still on mobile)
4. Complete purchase (mobile checkout)

Conversion rates:

• Mobile try-on users: 3.8% conversion
• Mobile non-try-on users: 1.8% conversion
• 111% lift from try-on on mobile

Why mobile converts better with try-on:

• Addresses mobile purchase hesitation
• Visual confidence on small screens
• Reduces “I’ll check on desktop later” behavior

---

​

Responsive Design Details

​

Button Sizing

Automatic responsive sizing:

• Mobile portrait: 80px × 80px (optimized for thumbs)
• Mobile landscape: 70px × 70px
• Tablet: 90px × 90px
• Desktop: 100px × 100px

Touch target compliance:

• Meets WCAG 2.1 guidelines (44px minimum)
• Easy thumb access from any grip position
• Adequate spacing from other UI elements

---

​

Modal Optimization

Mobile modal behavior:

• Full-screen takeover (better UX on small screens)
• Swipe to dismiss
• Native scrolling behavior
• Keyboard-aware (doesn’t hide behind keyboard)

Desktop modal:

• Centered overlay
• Click outside to dismiss
• Scrollable content

---

​

Mobile Browser Support

​

Fully Supported Browsers

iOS:

• Safari 13+ ✅
• Chrome for iOS 85+ ✅
• Firefox for iOS 28+ ✅
• Edge for iOS ✅

Android:

• Chrome 85+ ✅
• Firefox 68+ ✅
• Samsung Internet 12+ ✅
• Edge 85+ ✅
• Opera 60+ ✅

Not supported:

• Internet Explorer (desktop or mobile) ❌
• Opera Mini ❌
• UC Browser (limited support) ⚠️

---

​

Browser-Specific Considerations

Safari (iOS):

• Best performance on iOS
• Native camera integration
• No known issues

Chrome (Android):

• Excellent performance
• Most common Android browser
• Recommended for Android users

Samsung Internet:

• Optimized for Samsung devices
• Full feature support
• Slightly slower upload times

Firefox (mobile):

• Works well on both iOS and Android
• Consistent with Chrome performance

---

​

Mobile A/B Testing Opportunities

​

Test Mobile-Specific Variables

Button placement:

• Top left vs top right (mobile users hold phones differently)
• Test with heat mapping tools

Button text:

• “Try On” vs “See It On You”
• Shorter text often performs better on mobile

Promotional messaging:

• Mobile-specific banners
• “Try on your phone” messaging

Mobile-only campaigns:

• SMS with try-on links
• Mobile app notifications (if applicable)
• Instagram/TikTok ads to mobile traffic

---

​

Mobile-First Best Practices

​

1. Test on Real Devices

Don’t rely on:

• Browser resize (not accurate)
• Desktop emulators (miss touch behavior)

Do test on:

• Actual iPhone (iOS Safari)
• Actual Android phone (Chrome)
• Multiple screen sizes (small, medium, large phones)

---

​

2. Promote Mobile Usage

Homepage banner:

“Try on from your phone – see how it looks on YOU”

Email campaigns:

“Tap to try on [product name] on your phone”

Product descriptions:

“Use your phone camera to try this on in seconds”

---

​

3. Optimize Product Images for Mobile

Mobile considerations:

• High-resolution images (mobile screens are high-DPI)
• Clear product visibility (no tiny details customers can’t see on phone)
• Vertical orientation works best on mobile

---

​

4. Monitor Mobile Performance

Weekly checks:

• Mobile engagement rate (vs desktop)
• Mobile conversion rate (try-on users vs non-try-on)
• Mobile-specific issues or complaints
• Device/browser breakdown

Monthly reviews:

• Mobile traffic trends
• Mobile ROI from virtual try-on
• Mobile vs desktop performance gaps

---

​

Troubleshooting Mobile Issues

​

Common Mobile Problems

---

​

Mobile Engagement

Over 70% of Shopify traffic comes from mobile devices, and 78% of virtual try-ons happen on mobile. Looksy delivers the same excellent experience on mobile as desktop, with no additional work required.

​

Common Questions

​

Next Steps