UX & UI Design
nFlight Web
Overview
How might we update the currrent nFlight Web fitting experience to eliminate confusion points around how users should complete the process? In addition, how might we make this updated version mobile-friendly?
Objectives
Business
Direct more customers to fitting facilities to finish the PING fitting process and order clubs.
Users
Decrease abandonment rate of nFlight Web by creating an experience that walks users through the process step-by-step, with no confusion around what they need to do to get a web fit recommendation for clubs.
Background & Assumptions
The idea behind nFlight Web was that customers could walk through this process before going to a golf fitting shop to get fit. It would serve as a starting point for fitters when helping a new customer. The website currently had high abandonment rates. The thought was that improving the experience would lead to more customer use of the site and more potential fittings at fitting centers where clubs could be purchased.
Original UI (Ex:Driver Fitting & Recommendatio)
Requirements
– Clarify order and steps required
– Create modifications for mobile version of the site
Additional Considerations
Some club questions are dependent on answers to other club questions. Ex: You cannot answer Hybrid & Crossover questions until you complete the Driver and Iron sections. At first glance it seemed as if a user could get fit for any club (by selecting a botton navigation button), but if they did so out of order they would receive the following error messages.
Error Messages Users Would Experience if They Clicked Out of Order
Solution
My solution involved some key changes.
Implementation of a Progress Bar
A progress bar was added so that customers knew exactly where they were in the web fitting process. It allowed users to navigate backward if necessary and understand how far they were from their recommendation.
Addition of Select Club Step
A step for selecting clubs was added, so customers could select exactly what clubs they wanted to be fit for and could see any dependencies that existed. This would allow them to avoid unexpected error messages later, as seen in the previous version of the website.
Guided Progression of the Get Fit Now Step
A number was added next to the club type, so users knew how many they selected to get recommendations for. In addition, at the end of each club type’s questions there was a button to go to the “Next Club.” This ensured that customers knew what to expect after answering all displayed questions and clicking the button to advance.