ROCCAT
Challenge: A gaming hardware store needed an eye-catching, interactive experience that would work across their global stores. They also wanted their site to be WCAG 2.0 compliant.
Process
We led several discovery sessions to build a persona for the typical customer and gathered all internal stakeholder requirements. After the client signed off on our approach, I built an IA to frame the content for the site and define the template we would build.
With the IA, we built out the site navigation and page structure for each template. I converted content structures to wireframes and prototyped the interactions.
After the wireframes were handed off to the designer, I ran preliminary accessibility analysis to catch major issues before we presented them to the consultant. I worked with the developers to integrate the consultant’s feedback to achieve WCAG 2.0 compliance.
Finally, I QA’d the navigation and each module as they were completed to ensure they fulfilled the client’s functional and design requirements.
Team and Tools
Internally, I collaborated with the UX Strategist and development team to construct our approach to the site. During the design phase, I also worked with the visual designer from the client's company and a third-party accessibility analyst.
After initial sketches on paper, we wireframed, comped, and prototyped in Adobe XD. For accessibility analysis, I used axe DevTools.
The finished site was built on Shopify, using a custom theme built with Tailwind UI.
Results
The client successfully implemented the design throughout their American, European, and Asian storefronts. Feedback from customers was positive.
The new site had already grown this year with the addition of new products and initiatives.
