The goal of this project was to improve user experience and redesign their primary web property, and provide a baseline where Spartan could cull their international footprint of clone sites, to one unified web experience for the US, and their international licensees. The existing user experience at the time was developed to support a product line that was originally limited to a race schedule, and a number of fitness and health content types. Over time as Spartan has grown, their products have also grown in complexity and depth, thus making the user experience internally for content producers, and externally for visitors rather difficult to navigate, and data was showing a steady decline in engagement. So the goal was to come up with a design that would emphasize their flagship race product line while improving the customer journey to other products and services.
There were two main hurtles to overcome in order to improve user experience.
In 2016 Spartan launched a unique user interface designed to allow for primary and secondary content throughout their site, where the primary and secondary content would coexist on its pages. When first launched this duality of content was very effective at keeping a tremendous amount of information 'above the fold' however it had inherent limits to how content could be discovered and displayed. As Spartan's product offerings grew, with that growth came a tremendous constraint on how the UI could be leveraged to display it. The forced primary/secondary content model while great at keeping products and their forms visible at once, it made tertiary content difficult to navigate. The answer was to shelve the unique IA, and pursue a more traditional route. This however was a more technical problem than a design problem. The design ultimately required an extremely complex and cautious development path that allowed for restructuring the content all while the Technology department was migrating to a more robust technology stack simultaneously.
From a design standpoint the work was simple, design a site that matched industry standards, and leverages best practices in IA as opposed to trying to invent something entirely new. While this seems like an obvious albeit unexciting move, it would in fact greatly extend the possibilities for more creativity and diversity of content. So all we had to do was Sift through years content produced over years of rapid growth, and determine a new information architecture for the brand, that would support it existing content but allow for its ever growing number of product offerings including its ever expanding race event products, all while navigating the technical hurtles of a platform shift.
The examples provided in this project cover all the designs that are currently under development and continuous deployment. They all include a white navigation bar that was ultimately shelved by Spartan in favor of sticking with the color they have been using while they continue to cull other properties that continue to use it. However the majority of the IA work, and design language developed during this project is surviving the engineering process.
Originally Spartan had limited flexibility for the content of their home page, and the hierarchy of purpose was unclear.View Example
To improve content placement opportunities we opted to change the homepage from a card view to a standard scrollable home page with increased communications and promotional opportunities.View Example
In this example we experimented with a slider on the homepage, and a shop product feed, all designed to keep the offerings top of mind while keeping the mainstay product line above the fold. Click the link to view the clickable prototype of the entire racer persona flow.View Example