About the project
JBL's e-commerce website, which is spread over 40 countries, has not been updated in a long while. The design was inconsistent & outdated. We gave it a fresher look, with better UX & innovative shopping experiences.
Role: UX research, design, project management
Team: Subi, Jeff, Joseph
Duration: 2020, 2021
JBL site, before our redesign
The website had inconsistent design throughout & global design considerations were not accounted for. The layout was not responsive & looked outdated. Brand experience & user flow needed improvement.
We conducted user tests on the existing website. JBL's target audience (20 - 40 years old, interested in consumer audio) were given some tasks to perform, to uncover the pain-points of the site.
Users felt that the site was functional, but it was old-fashioned and lacked branding.
Key user feedback
Site has all the basics
Good brand recognition & trust
Information heavy & cluttered
Too generic & old fashioned
Step one was multiple meetings with stakeholders, to figure out the project scope, business needs & timelines. This gave me insight into the brand & how to better represent it.
Sales through the mobile
site surpassed desktop, which made us focus on a mobile-first approach.
Insights from competitors
I conducted an analysis of JBL's competitor sites. The takeaways? Customers want to buy into you as a brand before they buy your products. Mobile optimization is key & information should be digestible at a glance.
Sketches & discussion
We dived down into the current site, to review the current ux & identify challenges & opportunities for improvement. We had request design critiques & design sessions with both team members & stakeholders. Ideation was done with rough sketches & refined further, which lead us to wireframing.
The aim was to keep the designs light & fresh, while adding pops of orange (JBL's brand color) & colorful images, without overpowering the user.
Home page: an immersive brand experience
Pops of bright colors, while maintaining JBL's signature look & giving the website a fresh, light feel. Focus was on lifestyle elements & rethinking shopping experiences.
Checkout: fast & efficient
We revised userflows to improve the overall user experience & to reduce cart abandonment during checkout. We also included multiple payment & design considerations for multiple regions.
Product detail page
Product landing page
Things that added complexity to the project
Getting stakeholders on board with design decisions.
Stuck on an iteration loop
A multitude of design considerations for different countries.
Insufficient communication with developer team
Too many screens, too many files