Join Surf
Lead UX Designer
â˘Â â97% navigation bar ârage clicksâ â˘Â +X% user retention and user satisfaction.
Users struggled to understand in-app points. We were able to link this confusion to observational data showing users repeated clicks on their points totals. Users also expressed a need for transparency in their earning and spending.
Through usability testing, guided research sessions, prototypes, and clever content strategy, we created an improved points experience that met both users needs and business requirements.
⢠Intm. UX Designer ⢠Engineers and Product team
Join Surf: Transparent rewards
This case study highlights how our design team at Surf helped users track and understand their in-app points balance. The currency of the Surf product, points, were earned passively by users by browsing the web and could be redeemed for rewards.
Through iterative design and user research, we developed a content strategy and interface to help users easily access information about their points. The solution was clear and usable. It optimized trust and understanding, supporting Surfâs value of transparent, easy, and rewarding data collection.
Surf is a browser extension focused on reinventing how users interact with their online data, offering control and rewards in exchange for passive surfing. With myself as Lead Designer and Mary Pauw as Intermediate Designer, our objective was to address UX gaps related to earning points. Points were a key component of the Surf experience, and users would spend them on rewards like gift cards, deep discounts, and consumer products.
Thanks to earlier research exploration through usability testing and interviewing, we had already discovered that users struggled to understand how they earned points. Another research insight was that most users whoâd been active for more than a week wanted to track their earning and spending.
Investigating points and clicks
To gain deeper insights, we spent a few days monitoring HotJar, a user behaviour monitoring tool. Here, we uncovered a trendâmany users were repeatedly clicking on their (non-interactive) point balance in the top corner. Though we didnât know why they were doing it, this quantitative data highlighted a potential. We hypothesized this was connected to a significant interest for users to understand their points, and this prompted us to investigate further.
To understands our usersâ expectations, we conducted guided research sessions. Surprisingly, when asked what they expected to happen when they clicked their point balance, users were unsure. However, when asked to find more information about points or to navigate to a log of their earnings, the majority suggested clicking on that same points-balance element. A noteworthy exception was the few users who chose to instead navigate to Surfâs settings, where theyâd find their browsing history.
Solving points and clicks
Equipped with research insights, we set out to design a solution that would address user needs and expectations. Our prototypes focused on incorporating points tracking into their browsing history. This helped users associate their browsing data with their points.
Access to Surf points information was made available through both the settings page and the point balance in the header. Through usability testing, we observed users successfully navigate to their points where they could track them and learn more.
One particular challenge we encountered was clarifying the relationship between the userâs balance, their spending in the reward store, and their weekly earnings. With the assistance of user input, we came to an effective content strategy. Users found it clearest when presented with their a summary of their weekly earnings, and a log of their long-term activities in the context of their current balance.
We had to balance transparency with maintaining the passive nature of browsing. Too visible a connection between points and behaviour could encourage changes in browsing activity. At best this would lower the quality of user data and at worst catalyze a culture of gamification at the expense of our budget and runway.
Including a weekly total and avoiding higher fidelity of information, we found a compromise for our users. By avoiding granularity, users could focus on the helper text and their data rather than modifying their browsing behaviour. This aligned well with the product's values and, based on user testing, resolved users confusion.
In the weeks after launch, we reported 97% fewer ârage-clickâ incidences in the top navigation. We hypothesized that a 100% decrease would be unlikelyâ due to fidgety fingers, bots, slow internet connections, and even QA testers trying to break things (responsibly).
Throughout the process, our team worked with user data to develop a usable and informative design. The result was a core, easy-to-discover part of the Surf experience, where users could track their points and even manage the data they share.