timeline
Nov 2020 - May 2021
project type
Product and Systems
project overview
NZXT is a PC hardware company dedicated to serving the gaming community. Our goal on the DTC product team was to reimagine the NZXT e-commerce experience from the ground up by redesigning the NZXT website and custom product configurator.
contribution summary
Redesigned full product experiences for implementation
Co-led and created design system and accessibility guidelines
Collaborated with cross-functional partners on IA strategy, designs, and prototypes
Supported creative and marketing partners
problem space
NZXT DTC products make up a high percentage of the company's revenue. As we continue to grow as a company and a brand, it was important that we prioritized improving our e-commerce platforms while still maintaining regular business needs, campaigns, product launches, and partnership programs.
approach
Our team started by gathering insights on what was impactful to customers in their user journey on the NZXT website. Our product design and research teams narrowed down a few high-level pain points to prioritize first.
🎮
FPS gamer
👁️
High resolution gamer
☕️
Casual or social gamer
😎
Hardware enthusiast
pain point 1 & 2
Finding a solution for pain points 1 and 2 meant we had to make some foundational updates to the NZXT website. We did some user journey research, card sorting, and revisited our IA as a team.
Pain point 1/ Two separate websites for custom builds and individual PC parts
Solution: Remapping IA to combine platforms to one singular point of purchase
Pain point 2/ Website and configurator navigation is not intuitive
Solution: Tree testing and card sorting to align on user priorities
future goals
Our plans were to continue adding future product enhancements to serve as even more of a connection between individual PC parts, the custom configurator, and prebuilds on the NZXT e-commerce website.
1/ 'Work Bench' which offers product suggestions and acts as a quick way to find and add related products
2/ Configurator updates that include other customizable products in addition to being able to find those products in retail
pain point 3 & 4
Our solution for pain point 3 and 4 was to build a dedicated design system created to support the cross-functional web (DTC) teams at NZXT aka Atlas. This way we could guarantee consistent design and allow for maximum efficiency within our teams which is always a +1.
Pain point 3/ Design language is not consistent throughout platforms and pages
Pain point 4/ Pages contain a lot of information with little hierarchy
Solution: Creating a dedicated design system which contains design and content guidelines, a component library, and tooling information
Atlas is one of two design systems under our umbrella design system, Olympus. Take a deeper dive into our design system work for Atlas, Prometheus, and Olympus.
pain point 5
There were four main reasons it was challenging for users to absorb product comparison information:
there was too much information at once, sometimes repeated
the design of the comparison tables were not user friendly
there was no consistency on the placement of the tables
the comparison tables were not mobile friendly
Pain point 5/ Product detail comparisons and information are not efficient for quick intake
Solution: Improving on design, content, and placement of comparison data
pain point 6
The previous NZXT website and configurator were built mostly focusing on desktop sizes. As we gathered data indicating that nearly half our total users were accessing the site using their phones, we wanted to improve the mobile experience as much as possible.
Pain point 6/ Mobile screens are not prioritized
Solution: Focusing on components and designs that work well in all screen sizes, prioritizing mobile-friendly designs
product launch
After some user testing and a lot of collaborative effort, we successfully launched the NZXT website and configurator while balancing our business-as-usual needs.
💻
⬆ 19.3% average increase in Prebuild conversion rate
🏗️
⬆ 15.5% average increase in Custom conversion rate
🛒
⬆ 600k increased qualified shoppers by the end of 2021
📈
⬆ 63% increase in revenue from 2020 to 2021
post launch success
We kept in mind that as an e-commerce business, it would not be unusual to see fluctuation in data depending on the time of year. That said, since the launch of the new NZXT website and configurator, we were excited to see that all our hard work paid off. We felt super grateful for our community and customers for giving us constructive feedback for the future.
learnings
It's been an exciting experience for me to work so extensively on this global e-commerce platform. Because this was a ground-up project not only for design but also engineering, creative, and copy, there was a lot of cross-team collaboration which I really enjoyed and feel like I gained a lot of insight from.
Something I learned is how important process and timeline is for such a major project especially having to juggle designing something new while maintaining regular business needs. I also think practicing designing your MVP (or MUP) and improving upon that is really important. We know that not everything we have live today is perfect, but it's an on-going process and understanding that these designs can and will change is important.
I am so proud of everyone on my team(s) for accomplishing what we have so far and as we look forward, the goal is to continue improving on what we've started.