GEAR FINDER
2016
Affiliate Programming
Category: Health & Fitness
Platform(s): Responsive Web, Faceted Solr Search, Drupal
Problem Statement: Generate new revenue through (1) affiliate link program leveraging brand expertise about bicycling gear and (2) increased ad revenue through increased engagement with gear-related content.
​
Lead all aspects of user experience from requirements gathering, information architecture, and functional specifications, through visual design.
​
AFTER:
BEFORE:
FUNCTIONAL SPECIFICATIONS
User Outcome Get quality and in-depth content towards making informed consumer purchase decision(s).​
​
USER FLOW DIAGRAM // The below diagram shows the primary path a user follows to generate a search result and view subsequent articles and related product(s).
RESPONSIVE ANNOTATED WIREFRAMES // Each annotated wireframe set articulates a functional area/page across all breakpoints. These were posted to respective Jira tickets on a sprint-basis for drupal development.
​
SAMPLES:
PDP Product Pages (mobile, tablet, desktop)
Product Card Overlays (mobile, tablet, desktop)
DESIGN HIGHLIGHTS
SEARCH FACETS
Prominent product category buttons offer users an immediate - and thoughtless - route to generate sets of meaningful product reviews and recommendations. Whereas a search input field speaks to users who know a particular model or part name and are moving quickly, facets offer an easy to follow reductive process for users that are trying to research or learn about a product or group of products. The UI provided prominent facet controls just below a search input field. User behavior confirmed assumptions: nearly all users engaged facet controls without ever using the input field. This increased the PV/Session to ~23 (from ~12).
FACETS provide an easy way to rapidly educe a result set.
(hover on sketches for descriptions).
ITERATIVE DESIGN
As a publisher of in-depth content considered to be experts of the field, product searches result in lengthy reviews of the sought-after products. Whereas, the patterns and functionality mimic the mindset of consumers (product-oriented), the content surfaced is editorial in nature. Therefore, the efficacy of a product widget surfaced on node-linked reviews is paramount to the success of the tool. Product widgets appear on articles or buyer's guides that have been linked to a product node. The following set shows an evolution of widgets (at the mobile breakpoint) that demonstrate the brand's gradual acceptance of a product-focus (away from editorial) evident in the widget pattern.
Product widget design evolved through iterative design and A/B Testing.
(hover on sketches for descriptions).
SCREENSHOTS