UX/ UI Design

Encouraging new users to join Tegger

Year
2021
Role
UX Designer
Company
Tegger
Encouraging new users to join Tegger

Overview

Tegger is a start-up that rewards user with mini-props, a cryptocurrency, for browsing on affiliated websites. With mini-props, users can purchase items and services in the Tegger Marketplace.

Problem

Registration was unfortunately not high enough with the existing solution, a widget that hovered on the right-hand side of Tegger-affiliated sites. My task was to redesign the widget with the following goals:

  • To help users realize the benefits and entice them to sign up.
  • To redesign the widget to fit within new size constraints.
  • To help integrate the widget with the rest of Tegger and mitigate confusion about Tegger's offerings.
How widget registration and rewards worked
  1. A user browsing on a Tegger-affiliated site would see the flashing circular widget which contained the Tegger logo.
  2. If a user clicked on the widget a pop-up Sign Up appeared. The incentive for registration was the text "Win Prizes for Browsing Here"
  3. A user could register through Facebook, Google, or Email.
  4. Once signed in, mini-props accumulated based on the time users spent viewing affiliate websites.

When the flashing widget is clicked a small pop-up would appear that would prompt users to sign up for Tegger.

Size constraints

A challenge that Tegger encountered before I joined was that the widget had to be smaller in size due to Google Better Ads Standards. In previous iterations of the widget there was more information such as rewards a user could gain from browsing but the start-up minimized the size of the widget to comply with Google's regulations.

An earlier iteration of the Tegger widget that blocked content on mobile. The text says users can earn prizes for browsing here with Uber and Rappi as examples.

According to Google, the widget could not look like the following:

  • Ad density higher than 30%
  • Flashing animated ads
  • Large sticky ads
  • Full-screen scroll-over ads
Examples of ads not allowed by Google Better Ads Standards.

Discovery & Research

To understand the problems of the existing widget I applied Heuristic Evaluation. Through my analysis it appeared clear that there was no real CTA on the widget before it is clicked on and the widget provided little information about the product. In addition to this, the sites that the widget was on were chock-full of ads and this blended into them.

Usability Testing

For qualitative research, I conducted 5 usability tests. I found five participants that were interested in the concept of earning perks for browsing content. One of the biggest issues I observed during the testing was that users did not consider clicking on the Tegger widget because they didn't know what it was and they were hesitant to sign up due to the lack of information provided. During the tests the participants expressed the following:

  • Users did not notice the widget before they were cued to.
  • Hesitancy to give their data to an unknown source.
  • They did not click on ads and the widget looked like click-bait.
  • Desire for more information about Tegger before seeing a sign up page.
  • Wanting more evidence that they could trust Tegger, such as seeing that it was affiliated with the site they were on.
  • Skepticism about the widget blocking content on the screen, especially on mobile.

Due to these findings, I chose to focus on the following needs in my re-design: 

  • Noticeability on crowded page
  • Informative and Trustworthy nature
  • Small size as to not block content

How Might We

Thinking about these problems led me to ask the following HMW questions:

  • HMW communicate Tegger's benefits to users more effectively?
  • HMW get users to trust Tegger more
  • HMW make Tegger more visible to users?
  • HMW engage users on the first sight of the widget?
  • HMW make Tegger more visible to users?

Comparable Problems

To ideate potential solutions, I conducted comparative analysis. I looked into products such as Brave browser, Qmee, and Younow that allow users to earn points either through browsing or using a widget. One of the products that seemed most comparable was the Chrome extension Honey. Similar to Tegger, the app:

  • Is geared toward users who want perks or a good deal
  • Has a widget that is the main touch-point for most users
  • Has a points system that users can then exchange for other goods
Screenshot of Honey

The First Iteration

For the first iteration I created a simple user flow that can be seen below:

An initial pop-up screen that invites users to click to on it with the text "Earn rewards for browsing"

  • A screen with the options to Sign Up, Log In, or Learn More
  • An onboarding that goes through 4 screens
  • The expanded version of the widget
  • The collapsed version of the widget (the collapses if a user clicks on it

User Flow

Set-backs

Unfortunately, right after Tegger launched the new iteration, one the Tegger affiliates, Cultural Collectiva, said Tegger would either need to make the widget smaller or they would take it down. The direction of the widget changed for this reason and Tegger chose to instead focus on attracting users with a small widget that displayed an increasing number of points. I created a gif for this version in Illustrator but my role at Tegger ended before I was able to see the results of it.

Gif visualizing the accrual of points.