Mobile & Desktop Design Variations

Control

Original Site
Original ClickShades Mobile Hero
CONTROL

Current Live Site

clickshades.com.au
Issues Identified (CRO Audit)
  • Logo fails "squint test" - SHADES text too small/light
  • Missing main claim - no clear value proposition above fold
  • No reviews/trust signals visible in hero
  • No rotating top banner with key benefits
  • Selector UX doesn't auto-advance like throtl
  • No urgency elements (countdown, limited offer)
  • No "Talk to Sales Tech" support visibility
  • No popular models fallback for quick selection

Responsive Design

Recommended
LATEST

V7 - Responsive (Mobile-First)

January 15, 2025

Features
  • ADDED ClickShades brand colors (#2463af blue, #ffd600 yellow CTA)
  • ADDED throtl-style expandable car picker with type-to-filter
  • ADDED Mobile-first responsive layout
  • ADDED Desktop: horizontal selector, 4-column grids
  • ADDED Rotating benefits banner (inline on desktop)
  • ADDED Trust badges, popular models, urgency countdown

Mobile Variations

390px Viewport
V4

V4 - throtl Style + Real Images

January 15, 2025

Changelog
  • ADDED Real product images from ClickShades (hero background, popular models)
  • ADDED Star rating badge in hero (4.9 from 127 Reviews)
  • ADDED Rotating top banner with icons: Easy Fitment, Same-Day Dispatch, 14-Day Returns, Free Delivery, 87% UV
  • ADDED throtl-style expandable dropdown selector with "Type to Filter"
  • ADDED Year-first selection flow (Year → Make → Model → Submodel)
  • ADDED "Talk to a Sales Tech" support row with 1300-SHADES + AUS badge
  • ADDED Phone icon in header (search, phone, cart)
  • ADDED Promo banner with dismiss X ("Summer Sale! Get 15% OFF")
  • ADDED Urgency section with countdown timer
  • ADDED "Shop by Popular Models" with real product thumbnails
  • CHANGED Blue accent color throughout
  • CHANGED Selector auto-advances after selection
V3

V3 - Snapshades Layout

January 15, 2025

Changelog
  • ADDED Dark header matching Snapshades style (MENU + logo + cart)
  • ADDED Centered logo with inline CLICK + SHADES
  • ADDED "Stars from X Reviews" format like Snapshades
  • ADDED White selector card with rounded pill dropdowns
  • ADDED Red CTA button "SEARCH" (Snapshades style)
  • ADDED Floating 5.0 star review badge
  • ADDED Bottom navigation bar (Menu, Help, Account, Cart)
V2

V2 - CRO Principles Applied

January 15, 2025

Changelog
  • ADDED Rotating top banner (FREE Shipping, Same Day Dispatch, 14-Day Money Back)
  • ADDED Reviews bar with stars + "127 Reviews" above fold
  • ADDED Main claim + sub-claim as bullet points
  • ADDED "Popular Models" fallback (RAV4, Corolla, etc.)
  • ADDED Trust badges (100% Satisfaction, Australian Owned)
  • CHANGED Logo passes squint test - SHADES same size as CLICK
V1

V1 - Initial Design

January 15, 2025

Changelog
  • ADDED Initial mobile hero concept
  • ADDED Stacked CLICK / SHADES logo
  • ADDED Australian Owned badge
  • ADDED 100% Satisfaction Guarantee card
  • ADDED Trust row (Free Shipping, 4.9 Rating, Easy Install)

Desktop Variations

Full Width
DESKTOP

V5 - Desktop throtl Style

January 15, 2025

Features
  • ADDED Dark theme inspired by throtl.com
  • ADDED Inline horizontal vehicle selector (Year | Make | Model | Submodel)
  • ADDED Full-width benefits bar at top
  • ADDED Hero section with gradient background and product image overlay
  • ADDED Trust badges section (Perfect Fit, UV Block, Easy Install, Returns)
  • ADDED Popular models grid with cards
  • ADDED Urgency countdown banner
  • ADDED Full footer with navigation
DESKTOP

V6 - Desktop Snapshades Style

January 15, 2025

Features
  • ADDED Light, clean theme inspired by Snapshades
  • ADDED Split hero section (content left, image right)
  • ADDED Labeled vehicle selector form with Navy/Gold accent
  • ADDED "Why Choose Us" benefits cards with icons
  • ADDED Popular models grid with ratings
  • ADDED Customer testimonials section
  • ADDED CTA banner with dual buttons
  • ADDED Professional footer with social links