Templates and Component Library
For Polaris, I was tasked with creating key functionality of the product detail templates that are specific to user need, product features, and internal department goals. The following are showing related components applied to the recipe for one of those Templates, the Functional Style.
A mockup of the 3,500 pound winch kit page with my recommendation on behavior, functionality and user experience.
This is only a portion of the pattern library. Here is a simplified version of the mockup using content from the current PDP. A complete list of template components and related functionality.
The Total Solution would have a couple states for Accessories and Parts, and a single state for Apparel. For Accessories and Parts, the Total Solution would fall into two states: “Enhance” and “Required”. The “Enhance” state would show unrelated products together that would enhance the performance of the viewed product.
The “Required” state would show any products that are required for installation and basic use. For Apparel, the Total Solution would show the Enhance state only, bringing together ensembles that are going to enhance the product’s use and functionality.
Fitment Guide Concept
The Fitment Guide will behave primarily as a reference point for users to choose a size for apparel, and to find parts that fit their vehicles. The user will be able to access the Fitment Guide easily on the PDP page within the Hero section. For parts and accessories, the user’s model comes up within the image gallery after they make a selection. This way, the user is only looking at parts that fit their vehicle.