A small wayfinding fix, validated by usability testing
Role
Sole product designer
Scope
Diagnosis, usability testing, redesign, retest
During my time working on a heritage auction platform, customer support was regularly receiving calls from users who couldn’t work out how to navigate to the live auction to take part. The path technically worked, but it wasn't obvious, particularly for users who were logged out or hadn't yet registered as a bidder. Through usability testing during a live auction, I was able to diagnose where in the journey users were getting stuck and make some simple changes to improve the success rate. Upon retesting, the proportion of users who could complete the task rose from 30% to 80%.
Before and after image of the auction page header.
The problem
When an auction went live, a banner appeared below the navigation featuring a live indicator, the auction name and a “view auction” button. Clicking the button took users to the auction page. However, the banner remained in place, making it unclear whether anything had actually happened, as the persistent banner was still prompting the same action.
The auction page header then presented different actions depending on the user's state:
Logged out users were shown sign-up and log in options, with the prompt “Log in/Sign up to register as a bidder”, but with no indication of how to proceed to the live auction.
Logged in users, who were not registered as a bidder, were shown a “register as a bidder” button, but again with no explanation that this step was necessary to take part.
The actual path was: log in, register as a bidder, and only then would the "view live auction" button appear. Each of the steps was required, but nothing made this clear to the user, which caused the confusion seen by customer service.
Diagnosis
To discover where users were having trouble, and find out how bad it was, I ran a usability test during a live auction using a remote testing tool, with participants who passed a number of screening questions. Because testing had to take place while an auction was live, the sample size was necessarily small, but it was sufficient to identify the main usability issues. The task was simply to reach the live auction.
Of the 10 users I tested with, 7 failed to get there - a success rate of 30%. Once arriving on the auction page, they weren’t clear what steps they needed to take to watch the live auction and the persistent banner added to the confusion as it made it appear they hadn’t arrived where they needed to be. It wasn’t surprising that customer service was receiving a number of calls as the interface was not making it clear to users how to proceed.
Original header states featuring the persistent live auction banner and missing instructions of how to proceed.
The changes
The solution centred on clearer signposting and involved two small changes:
Removing the banner from the auction page. Once a user was on the auction page, the banner had done its job, so persisting only served to confuse the user. Removing it made landing on the page feel clear the step had been completed.
Adding tooltips to the auction header telling users exactly what to do. Below the relevant button(s), depending on the user's state, I added the messages: "Log in and register as a bidder to watch the live auction," or, for users already logged in, "Register as a bidder to watch the live auction." These tooltips only appeared during the live auction and added some much needed clarity to the flow.
Redesigned header states, with live auction banner removed and tooltips added throughout the flow.
The result
Following the changes, I retested the same task during another live auction with five users. Although the sample remained small, four out of five participants were able to navigate to the live auction, up from three out of ten in the first round, which was a dramatic shift in success rate.
Anecdotally, during live auctions that followed, customer support reported noticeably fewer calls, and in some cases none, which matched the findings from the second round of usability testing.
Reflection
The lesson here is that the problem was due to the lack of instruction, not the flow itself. Each step was necessary and already built but users were left in the dark on how to proceed. By making small changes rather than a full redesign, I was able to significantly improve the task success rate, with minor development resources required.