CeX Redesign
Complete redesign of CeX e-commerce website and mobile apps
Hey there, fellow design enthusiasts! I’m about to take you on a journey through one of my most exciting projects to date, the redesign of CeX’s digital experience. So, get comfy, and let’s get into how we transformed CeX from a cluttered digital garage sale into a sleek, user-friendly tech treasure. Ready? Let’s roll
About CeX: Not Your Average Second-Hand Store
Alright, before we jump into the nitty-gritty of the redesign, let’s talk about CeX. And no, it’s not pronounced the way you might think — it stands for Complete Entertainment Exchange. (I know, I had a good chuckle too when I first heard it!)
Picture this: It’s 1992, and somewhere in the UK, CeX is born. Fast forward to today, and this plucky little startup has grown into a global empire of gadget goodness.
CeX (Complete Entertainment Exchange) is a global retailer
specializing in buying, selling, and exchanging second-hand tech
and entertainment products, including phones, laptops, gaming
consoles, and DVDs.CeX operates both physical stores and online platforms.They’re
not just in the UK anymore. CeX has spread its wings to India,
Ireland, Spain, Australia, and beyond.Got trust issues with second-hand goods? CeX’s got your back with
competitive pricing and 5 year warranty. The company’s unique
buy-sell-exchange model allows users to trade in their products for
cash or store credit.And for all you eco-warriors out there, CeX is fighting the good fight
against e-waste. By encouraging the reuse of electronics, they’re
making sustainability cool.
Whether you’re browsing their stores (perfect for those “I need it now!” moments) or scrolling through their online platform, you’ll find a wide range of products and seamless shopping options.
Now that we’re all acquainted with CeX, are you ready to see how we gave their digital presence a much-needed glow-up?
Let’s get into the redesign process!
Why We Needed a Redesign?
Picture this: CeX, the go-to spot for second-hand tech treasures, was stuck in a time warp. Our digital presence was starting to feel like that old flip phone gathering dust in your drawer — functional, sure, but definitely not turning any heads.
The web and mobile platforms lacked the intuitive, seamless experience that modern users expect, and this was reflected in our analytics, bounce rates were rising, session durations were dropping, and overall conversions were stagnating.
It was clear: our digital experience needed CPR!
As a senior UX designer at CeX, I had the opportunity to lead the redesign of both our website and mobile apps.
The goal of the project was to:
Improve usability across web and mobile.
Increase user engagement.
Simplify key user flows like buying, selling, and exchanging.
Boost conversions, sales, and overall customer satisfaction.
We wanted our users to be able to buy, sell, and exchange their products with ease, from any device, without friction or confusion.
We kicked off this project with one clear question:
💡 “How can we make CeX Webuy a more enjoyable, functional, and efficient platform for our users?”
🧑🏻💼 Roles and Responsibilities in the Team
The CeX redesign project involved a cross-functional team. Here’s how the responsibilities were distributed:
Senior UX Designer (Me — Sejal Naik): Dedicated senior designer, responsible for user research, wireframes, prototypes, and overseeing the UX vision. I also worked closely with the development team to ensure the designs were implemented as intended.
Product Manager: Managed the project scope, timelines, and overall direction. Facilitated communication between stakeholders and ensured alignment on goals.
UI Designers: Focused on translating wireframes and low-fidelity designs into high-fidelity UI designs. Ensured visual consistency and adhered to the design system.
Third Party Design Consultants: Provided a structured atomic design system tailored for our product and guided our UX team on using it.
Developers: Implemented the designs into the web and mobile platforms. Collaborated closely with UX to solve technical constraints while maintaining design integrity.
QA Team: Tested the platform to ensure all functionalities worked as expected and the new design didn’t introduce any bugs or issues.
Marketing Team: Analyzed the impact of the redesign on traffic and conversions. Coordinated communication for the launch.
🔍 Scope and Constraints
Scope:
Redesign: Complete overhaul of the CeX website and mobile app, including buying, selling, and exchange processes.
Cross-Platform: Ensure that the design works seamlessly across desktop, tablet, and mobile devices.
New Features: Improve search functionality, add a more streamlined checkout, and revamp the user account section.
Constraints:
Time: We were working with a six-month timeline from kickoff to launch, with several milestones and feedback loops.
Legacy Systems: The existing platform had a lot of legacy code that required careful integration of the new design without breaking old functionalities.
Technical Limitations: Some design decisions had to be modified to fit within the limitations of the platform’s backend architecture.
🧑🏻💼 Who are we designing for?
Before we dove into the redesign, we needed to know exactly who we were designing for.
We zeroed in on two main groups:
The Tech Tycoons: These users are frequent buyers and sellers of second-hand tech products, often in their 20s and 30s. They’re confident in navigating websites and apps but are seeking efficiency in their user experience. They want quick access to information, transparent processes, and a seamless path to buying or selling items.
Casual Shoppers: These are more occasional users, perhaps less familiar with the second-hand tech market but attracted by the lower prices. They need a clear, guided experience to make informed decisions about purchases or exchanges.
We created detailed user personas (displayed after research section) and referred to them often.
🔎 Research and Understanding User Needs
After our initial reality check, it was time to roll up our sleeves and get our hands dirty with some serious user research. First stop? London, baby! 🇬🇧
We have a key market in the UK, where CeX has a strong presence. So after kick-off, I travelled to CeX HQ in London and worked closely with Stakeholders and real users for a month.
User Interviews: Getting Up Close and Personal
During this stay, we visited the CeX stores, warehouses and conducted in-depth user interviews. Here’s what we uncovered:
Pain Points: Users felt that the website and app navigation were confusing, with too many clicks required to get basic tasks done. Both platforms also lacked responsiveness, with mobile users reporting that the site often felt cluttered and hard to navigate on smaller screens.
Expectations: Many users expressed a desire for a cleaner, more intuitive interface that allowed them to easily browse, search, and complete transactions.
Behavior: Both UK and India-based users showed a strong preference for fast, simple interactions, especially when selling products or checking product availability. They wanted clear calls to action and an easy, streamlined checkout process.
We also sent out a survey and got over 200 responses.
Business Goals Alignment
We collaborated with stakeholders to ensure that the redesign aligned with CeX’s business goals, like increasing conversions, improving the buy-sell-exchange process, and maintaining brand identity.
Competitive Analysis: Studying the Market
Next, we conducted a competitive analysis. We analyzed similar services like GameStop, Music Magpie, and eBay in both the UK and India to see how they structured their platforms and what features resonated with their audiences. We identified areas where they excelled, like eBay’s powerful search functionality and places where CeX could stand out, particularly in terms of ease of selling products and exchange processes.
This analysis provided the groundwork for several key design decisions, especially regarding simplifying the interface and refining the search and navigation experience.
Data-Driven Insights:
Heuristic and Google Analytics Analysis of the CeX Website
We leveraged Google Analytics extensively to analyze the performance of the CeX website across several key parameters. By tracking metrics like user behavior, traffic sources, session duration, bounce rates, and conversion rates, we gained valuable insights into how users were interacting with the platform. We analyzed which pages had the highest drop-off rates, identified friction points in the checkout process, and monitored device-specific performance, especially on mobile. Additionally, the demographic and geographic data provided by Google Analytics helped us understand our user base better, including key markets like the UK and India. This data-driven approach guided us in refining user journeys, optimizing content, and improving overall site usability.
We also conducted a heuristic analysis on the existing CeX website to identify usability issues and areas for improvement. Using Jakob Nielsen’s 10 Usability Heuristics, we evaluated the site based on criteria like consistency and standards, error prevention, visibility of system status, and user control and freedom. Key issues identified included complex navigation, unclear calls to action, and inconsistent feedback during transactions. We also noticed that some processes, such as selling items, required too many steps, which led to user frustration. This heuristic evaluation provided a clear roadmap for simplifying interactions, improving clarity, and aligning the design with user expectations, ensuring a more intuitive and efficient experience in the redesign
Creating User Personas
Based on our research and analysis, we developed three key user personas to guide our design:
Tech Enthusiast Jon: A 32-year-old Londoner who buys and sells tech faster than you can say “cryptocurrency.”
Budget Shopper Neha: A 25-year-old Mumbaikar who buys second-hand tech to save money. She prefers a simple, mobile-first experience and quick product comparisons.
Gamer Ryan: A 20-year-old student who visits CeX frequently to trade in old games and buy new ones. He wants an exchange process faster than his gaming reflexes.
Armed with this information, we proceeded to the next stage of the project
💡 The Grand Plan: Developing a UX Redesign Strategy for CeX
Post research, we followed the detailed strategy for the CeX website and mobile app redesign, ensuring that all bases were covered from Information Architecture to launch and beyond.
Information Architecture → Design System → Wireframes → Design → Prototyping → Development & Handoff → Launch → Post-Launch Analysis & Iteration
Information Architecture (IA)
To create a logical structure and seamless navigation for users across platforms.
Content Audit: A thorough audit of the existing site content was performed to understand what information was outdated, irrelevant, or misplaced. This guided content pruning and restructuring.
User Flows: Mapped out user flows for key tasks, such as selling, buying, and exchanging products. This ensured users could easily complete their tasks with minimal friction.
Site Map: Developed a new site map that organized the platform into intuitive sections, improving discoverability and reducing the number of clicks to perform core actions.
⚛️ Design Phase: Crafting a Cohesive Design System
As part of our comprehensive redesign, we recognized the need for a robust and scalable Design System that would streamline our UX and UI processes across the CeX website and mobile platforms. To achieve this, we brought in a third-party UX consultancy with expertise in creating atomic design systems. The collaboration was a strategic move, allowing us to benefit from their experience in building design systems while also equipping our internal team for future growth.
The agency’s expertise allowed us to build reusable components, ranging from basic UI elements like buttons to more complex layouts, ensuring scalability and a cohesive user experience. They also conducted hands-on workshops to train our design and development teams on how to use and maintain the system. This partnership not only streamlined our design process but also empowered our in-house team to manage and scale the design system for future growth.
The Atomic Design Approach
The agency implemented the atomic design methodology, which breaks down UI elements into:
Atoms: Basic building blocks like buttons, icons, and text fields.
Molecules: Combinations of atoms that create functional components, such as search bars or dropdown menus.
Organisms: Complex UI sections, like headers, product lists, and navigation bars, formed by grouping molecules.
Templates and Pages: High-level structures that organize organisms into layouts, ensuring consistency across different pages and sections.
💻 Design Phase: Designing the Website and Apps
Wireframes
Visualize the structure and layout of key user interfaces.
Low-Fidelity Wireframes: We created low-fidelity wireframes to focus on functionality and layout without the distraction of color or branding. These wireframes were shared with stakeholders early to gather feedback before moving into more detailed designs.
Iterative Testing: Quick usability tests were conducted with wireframes to validate the flow of actions, particularly for tasks like selling and buying products. These tests informed refinements before moving to high-fidelity prototypes.
Design
Create polished, user-friendly, and visually engaging designs that align with user needs and business goals.
High-Fidelity Designs: Once wireframes were approved, we created high-fidelity designs. Focus was placed on a clean, uncluttered layout with a clear visual hierarchy to guide users seamlessly through tasks.
Responsive Design: Designs were optimized for mobile, tablet, and desktop, ensuring the site performed well across all devices, with particular attention to touch targets, content scaling, and mobile-specific interactions.
User-Centered Visuals: We designed with the user personas in mind, ensuring the interface was simple for both tech-savvy users and occasional shoppers. Key actions, like “Sell Now” or “Exchange,” were highlighted with prominent, accessible buttons.
Prototype and Testing: Validating Our Assumptions
After the design phase, we created an interactive prototype and conducted in-house testing. We tested the new design against the old one, specifically measuring how quickly users could complete common tasks like finding a product, selling an item, or making a purchase.
Design Decisions: Every decision we made aimed to improve the user experience:
Simplified Navigation: We reduced the top-level categories and introduced a more dynamic, sticky menu that adapts as users scroll.
Mobile-First Approach: Given the large portion of mobile users, the new design prioritized mobile usability, with larger touch targets and a cleaner layout.
Streamlined Selling Process: We introduced a more guided, step-by-step process for users selling their items, making it easier to find their product and complete the transaction.
Improved Search Functionality: We made the search bar more prominent and improved search algorithms for faster, more accurate results.
Click here to check complete comparison of screens.
Development & Handoff
Objective: Ensure smooth translation of designs to code with a strong collaboration between designers and developers.
Collaboration with Developers: We maintained close communication with the development team throughout the process, providing them with annotated design files, design specs, and ensuring that the design system was fully integrated into their workflow.
Design Reviews: Regular design reviews with developers were held to ensure that what was being built was consistent with the vision and intent of the design. We made adjustments as needed based on technical constraints
🎉 Launch and Results: Measuring Success
Six months after the project kickoff, we opted for a soft launch to a small percentage of users, allowing us to monitor feedback and resolve any unforeseen issues before rolling out the redesign to the entire user base.
We first launched to Italy territory.
Post that we launched to Mexico, Malaysia, India, Netherlands, Australia.
Then we finally launched to UK, our main territory with vast user base.
Post-launch, we closely monitored the data using Google Analytics, and the results were incredibly positive.
We tracked key metrics such as traffic, conversion rates, and user interactions with the redesigned site, helping us gauge the success of the launch.
Conversions Increased: Overall conversions saw a 22% boost within the first three months.
Sales Growth: Sales from both web and app increased by 16%, driven largely by improved usability and reduced friction during transactions.
User Engagement: Average session duration increased by 17%, indicating that users were spending more time exploring the platform.
Lower Bounce Rates: Bounce rates dropped significantly across both platforms, especially on mobile, where we saw a 23% decrease.
Post-Launch Analysis & Iteration
To continuously improve the user experience based on data and user feedback.
Ongoing Improvements: Based on post-launch data and feedback, we continued to refine the site, introducing small updates to improve performance, usability, and conversion rates.
Iterative Design Process: The design system and user feedback were used to make ongoing adjustments, ensuring that the platform stayed current, user-friendly, and aligned with changing user needs.
A/B Testing: We conducted A/B testing to compare the redesigned pages against the original versions. Key metrics, such as time to task completion, bounce rate, and conversion rates, were tracked to determine the effectiveness of the redesign.
Usability Testing: Post-launch, we conducted usability testing to ensure that the redesigned features were meeting user expectations and were easy to use across devices.
Performance Monitoring: Using Google Analytics, we monitored performance metrics like page load times, session durations, and conversion rates after the launch to ensure that the redesign met both user and business goals
Wrapping Up Our CeX-y Redesign Adventure
Whew! What a journey, right? We’ve laughed, we’ve cried (okay, maybe just me during those late-night design sessions), and we’ve transformed CeX’s digital experience from “meh” to “marvelous.” 🎉
As we wrap up this case study, I can’t help but feel a mix of pride and excitement. Pride in what we’ve accomplished — a sleeker, more intuitive interface that makes buying, selling, and exchanging second-hand tech a breeze. And excitement for all the users who’ll now have a much smoother experience navigating the wonderful world of pre-loved gadgets.
Here are some key takeaways from this redesign adventure:
User-first, always: By really digging into user pain points, we were able to craft solutions that actually make a difference. Remember, folks: happy users = happy business!
Simplicity is king (or queen): We proved that you don’t need all the bells and whistles to create an effective design. Sometimes, less really is more.
Collaboration is magic: This project reinforced the importance of working closely with different teams. Developers, business analysts, and stakeholders all played crucial roles in bringing this redesign to life.
Iterate, iterate, iterate: Our willingness to test, learn, and refine was key to the project’s success. Perfect is the enemy of good, but “really freaking great” is achievable with enough iterations!
Tech can be sustainable (and stylish): We helped showcase that choosing second-hand tech can be a sleek, modern experience — good for your wallet and the planet.
So, what’s next for CeX? Well, that’s for them to know and us to eagerly anticipate. But one thing’s for sure, with this new design foundation, the future’s looking bright (and user-friendly)!
Thanks for sticking with me through this case study. I hope you found it as illuminating and exciting as I found the project itself. Now, if you’ll excuse me, I think I hear a second-hand Nintendo Switch calling my name on CeX Webuy. After all this redesign work, I think I’ve earned a little gaming break, don’t you? 😉🎮
Got questions about the redesign? Burning desire to share your own experiences? Or maybe you just want to geek out about UX? Drop a comment below or hit me up on LinkedIn. Let’s keep the conversation going