The Benchmark Outdoor Outfitters website redesign was part of an individual academic project with General Assembly. Benchmark is a local area outfitter in Cincinnati, Ohio currently celebrating 50 years of success for their single location about 30 minutes outside of the city. My goal was to enhance the user experience and update the user interface of the Benchmark website during this redesign.
I tested the existing Benchmark site with four users to see where the user experience could be improved. I provided them each with the task of picking out a backpack, comparing it to other products and previewing the checkout experience.
Primary navigation was intuitive and easy to access.
Local navigation was redundant and not faceted.
Separate window for product description was difficult to navigate.
Checkout was fast and easy to use
With the existing sitemap appearing to hold up during usability testing, I decided to do a tree test to see if their navigation made sense.
90% of participants successfully located products in camping.
60% of participants successfully located product in snow sports.
90% of participants successfully located product in footwear.
My user persona was willing to buy outdoor equipment online but only with sufficient research. With input by product experts, friends or through product reviews they would buy the item if they really needed it. From there they might check instore or just click purchase.
From my user research I was able to understand two paths in the user journey. Both began with needing a product while one ends with product replacement and the other ends in a lifetime of product upkeep.
We all know the best part about purchasing a product is having the product in-hand and using it for the first time. In my user research I discovered that my users were surveying several different resources online and even then they sometimes preferred the in-store experience. Being a physical retailer Benchmark was able to direct their customers to both the online and instore.
With the existing user flow in tact, I set out to enhance the buying experience and make it easier to compare products with one another and to access other recommended products from the checkout page.
The user flow delineates a clear path to checkout but also includes a path for utilizing the search function to view the product list as well as a path back to the product page from the shopping cart.
My high fidelity frames show the product selection and comparison steps as well as the checkout process. The interface was updated with more whitespace to allow for less clutter on the page.
The homepage was left largely alone. With edits made to the primary navigation to allow easier navigation on hover.
The product selection page includes easier access to the product comparison tool and a visible star rating to connect to customer reviews.
The product comparison tool increased the size of the product image, allowed for reviews and gave the option of viewing the product page where the user could easily add the item to cart.
The product page splits into a three column design where the price and product information are both visible on the same page. In addition the product reviews are placed below.
The shopping cart allows for in-store pickup and shipping options. In addition related products are visible below to continue your search.
With few problems experienced during usability testing, the checkout page got rid of the accordion tabs for navigation and included an option to go back and review your order.
With a wide selection of products, it only makes sense for Benchmark to offer more information and granularity on their product selection online. I hope their product line can continue to expand as they grow and connect their customers to beneficial user experiences both online and instore.
We use cookies to analyze website traffic and optimize your website experience. By accepting our use of cookies, your data will be aggregated with all other user data.