We reimagined the e-commerce website for Leetdesk to offer a AAA experience for enthusiastic gamers and a backend that is easier for the brand to manage.
Next.js, Prismic, Shopify
Branding, Design, Development, Maintenance
LeetDesk reached out to us, seeking a rebuild of their existing and self-made WordPress and WooCommerce site. Our mission was to increase conversion rates and optimize the site to make it run faster and smoother. LeetDesk also wanted a solution that was easier to maintain, allowing for easy updating and content changes that didn’t require coding or cause layouts to break.
We started with a branding workshop to learn more about Leetdesk's brand. With this workshop, we wanted to pin down their target customers and discover the best way to offer value and engagement to them.
The discovery session revealed Leetdesk's target audience are hobby gamers looking to level up their gameplay with the best peripherals, hardware, and gadgets. These customers self-identify as gamers with regular day jobs, and while they may not be 'pros', they want the pro experience.
With this new understanding of Leetdesk's customer base, we developed a branding guideline and user flow with wireframes to plan the site's structure. The main page structure remained the same, but we designed a new internal page content structure with improved customer flow and on-brand wording.
Our designers used the brand guidelines and wireframe slides to craft a custom design with a professional, sleek, futuristic look. They chose a more appealing modern font and created a more cohesive design to lead customers through the website's new, more natural flow.
Leetdesk's signature edge element was integrated as a recurring design element throughout the site, as light streaks and gradient borders. This intentional design keeps the customer's mind securely on the product. We also created custom videos, images, and icons to produce a clean and consistent look across the site.
To create a website with rapid-fire responsiveness and good SEO, we used Next.js as a web framework and Shopify as the E-Commerce platform and integrated it via the Storefront API. Next.js and edge computing detect the user's language, location and currency. To support the brand's request for easy content editing, we used Prismic. Every text, image, and video is editable and new pages or content blocks can be easily added. Prismic supports multiple languages, so Leetdesk's team can edit content in different languages.
We then helped the LeetDesk team become familiar with these technologies and explained how to move over data from the old services to the new ones.
Scroll-based animations were added to display the Leetdesk in a unique and engaging way. The more a customer interacts with the site, scrolling down the page, the more information and animations are revealed.
We added tons of functionality by integrating the new site with Shopify apps and other third-party modules like:
- Customer reviews
- Server-side GTM tracking
- Affiliate marketing
- 2D & 3D configurator with save option
With these integrations, we were able to create things like an effective review section where customers can see the LeetDesk in action in other gamer's homes, and read their impressions. If a customer stops in the middle of customizing their Leetdesk with the new configurator, they can easily save this configuration, share it, and access it later from a nice short link.
To play off the target customer's inclinations, we integrated easter eggs hidden around the site in the form of interactive LeetDesk-branded games. Gamers on the scavenger hunt must search around the website for the mini-games and WIN the games to unlock the codes.
We can't imagine a better incentive to interact with the site, than a quest that gives (free!) loot. Good luck and happy hunting!