Slazenger’s Digital Transformation
Overview
Slazenger, a historic sportswear brand, required a digital transformation to modernise its website, improve user experience, and establish an independent brand presence outside the Sports Direct ecosystem. The existing website failed to capture Slazenger's refreshed identity after its 2022 rebrand, presenting outdated aesthetics and usability issues. The project aimed to align the digital experience with the new brand vision while implementing a mobile-first, user-centric redesign with improved navigation, product discovery, and a streamlined checkout process, enhancing product discovery, reducing bounce rates and improving costumer satisfaction.
Role
As Design Lead, I oversaw the end-to-end UX/UI redesign, which included:
-
Leading the strategic overhaul of the website’s design.
-
Collaborating with marketing, development, and cross-functional teams.
-
Establishing Slazenger’s first atomic design system to ensure consistency and scalability.
-
Driving user research, wireframing, prototyping, and usability testing phases.
Project goals
-
Improve product discovery and navigation
-
Enhance mobile usability and performance
-
Strengthen Slazenger’s independent brand identity
-
Ensure a cohesive and scalable design system
-
Create a visually engaging and intuitive shopping experience
UX Process
The project followed a structured 5D UX Process:
Key Activities:
-
Stakeholder Interviews: Defined business objectives, technical constraints, and brand aspirations.
-
Data Analysis: A 6-month traffic review identified mobile usability challenges, high bounce rates, and navigation difficulties.
-
Competitor Benchmarking: Studied brands like Nike, Lacoste, and Axel Arigato to define best practices.
-
UX Audit: Identified key pain points such as outdated aesthetics, clunky navigation, and inconsistent branding.
Main pain points
Difficult Product Discovery
Cluttered Layout
Overwhelming navigation
Brand Identity Misalignment
No Design System in place
Key design solutions
Modern, Clean UI & Branding Refresh
-
Simplified layout with more spacing and better readability
-
Slazenger Yellow highlights to reinforce branding consistency
-
Updated iconography for a modern, premium feel
Improved Navigation & Search
-
Mega Menu update, reorganizing categories by sport instead of gender
-
Enhanced search functionality for better product discovery
-
Clearer category structuring with sections for clothing, footwear, accessories, and sports
Mobile-First Optimisation
-
Faster load times and performance improvements
-
Mobile-friendly navigation and checkout experience
Enhanced Brand Identity & Content
-
"We Are Slazenger" section was planned but canceled due to content and licensing limitations
-
Dedicated Collaborations Page to highlight partnerships and brand collaborations
Checkout & Footer Enhancements
-
Simplified checkout steps for a smoother user journey
-
Footer redesign with more structured, relevant links and updated payment icons
Results & impact
-
Enhanced Brand Alignment: The new design reflects Slazenger’s modernised identity while preserving its sporting heritage.
-
Improved Navigation & Product Discovery: The intuitive mega menu and PLP enhancements make browsing easier.
-
Stronger Visual Consistency: The atomic design system ensures a cohesive and scalable UI across all pages.
-
Optimised Mobile Experience: A mobile-first approach enhances usability on all devices.
-
The redesign drove a +389% lift in traffic, reduced bounce rate by 11.1%, and streamlined user journeys, delivering faster, more efficient browsing across devices.
Next steps
-
Personalisation Features: Implement dynamic content tailored to returning users.
-
Enhanced Brand Storytelling: Further integrate video and interactive content.
-
Iterative Updates: Maintain engagement through regular improvements based on analytics insights.
-
Areas to monitor: Engagement depth (pages/session, session duration) dipped. Worth investigating whether journeys are now more efficient or if users aren’t exploring enough post‑redesign.
Conclusion
The Slazenger website redesign successfully transformed an outdated eCommerce platform into a modern, brand-aligned experience. By focusing on UX enhancements, product discovery, and a mobile-first approach, we strengthened the brand’s digital presence and created a seamless shopping experience.
