RoundUp — UX & Gamification
BLOCKv, 2017 | Design Lead (UI/UX/Interaction)| Duration: 8 months
🐦 @hunterrice20
As a project under blockchain company, BLOCKv, RoundUp mission was to leverage their digital object technology in gamifying university campus life. From research, we learned that universities were struggling to engage students at on-campus sporting and educational events.
The iOS application is an engagement tool for colleges and universities to help students discover campus events, and stay engaged during their attendance. I led design on this project from concept to launch, utilizing data collected from user testing and HCD.
Challenge
Influencing mentality, emotion, and brand awareness is what marketers are challenged with every day. Billboards, print ads, social media ads, and commercials can all be effective in accomplishing this — for example, a new NBA commercial evokes excitement and leads to a fan’s ticket purchase to see Steph Curry face Lebron. Although getting the fan to Oracle Arena was the desired outcome, its influence is limited because the experience ends once this fan reaches the stadium’s door.
The challenge of RoundUp was to take this concept past the front doors and inside the live event, impacting real-world behavior, interactions, and ultimately purchase decisions.
Focus
Our RoundUp team targeted venues that would have no shortage of events — universities. Our goal was to design and integrate a simple, engaging game-layer on top of existing events.
It wasn’t hard for us to see why event discovery tactics of flyers, poster boards, and outdoor placards weren’t the most effective. They lacked organization and consolidation, so the initial step towards university adoption was providing immediate value through a cleaner digital interface.
The second step, gamification.
Gamification
In order to successfully increase engagement on campus, RoundUp would need to provide an element of fun that would make the process of attending events interactive, challenging, and competitive.
To increase event attendance, RoundUp would reward students with points for “checking in”. Participants would compete to accumulate points in order to win prizes. Depending on the event, the university could offer rewards for students who arrived early, or stayed the duration of the event. For example, the first 100 students to check in to the basketball game (based on geolocation) would receive a free hotdog coupon to redeem at the concessions stands. Once redeemed, that digital coupon could transform into a free t-shirt coupon, contingent on staying the whole duration of the event.
To start, I analyzed the five critical mechanics necessary for successful gamification, and conducted brainstorms to determine each component’s role within our UI. We explored the five following keys: rules & constraints, value proposition, positive reinforcement, progress, and variability.
1. Rules & Constraints
Rules: Clearly defined rules must be simple, continuously explained and reiterated throughout the product. Early adopters have very little patience, so the learning curve needs to be close to zero for stronger retention.
We narrowed it down to three simple steps, and threaded these throughout the app:
- Discover events hosted on the app
- Attend (check-in) to earn points.
- Top 3 campus scoring leaders each week win a valuable prize.
I designed an engaging tutorial that familiarized new users with these three steps before sign up (right), and was easily accessible in a more detailed view throughout the app (left).
Constraints: Limitations make or break a game — meaning, it’s critical that maximum input feels attainable and boundaries are set within reach. If total possible actions are infinite, players will feel discouraged and therefore will have a drastic decrease in motivation. It was important for us to find our sweet spot — not too easy, not too hard — and we accomplished this through hours of data analyzation and focus groups. Here are 3 examples of constraints that worked very well to RoundUp’s advantage.
- Event Constraints: The easiest of the three, that I didn’t have to do much work towards, was the natural constraint of events. On average, there were about 25–40 events hosted on RoundUp per campus each week, so I made that number clear in the UI. Checking in to all 40 events felt difficult, yet feasible.
- Invitation Limits: An extremely effective growth hack that had the ability to boost players into the next leaderboard position, was the concept of inviting friends to events. Each time a user invited a friend, they earned 50 points. I limited this to 2 invites per event, which would sometimes double the potential value of that event (100 points for attending, and 50 per invite). It wasn’t uncommon for a user to invite 100 contacts their first week!!!
- Time Pressure: Each Sunday night, we would announce a new prize that our users would work towards during the course of the week. This kept motivation high, because if our users had to study for midterms that week, or joined the app late, they could pick it back up the following week. I made this clear in our UI by displaying a countdown timer on the main page that would reset each Sunday. This would urge participants to act quickly to increase their position before time expired.
2. Value Proposition
Like any situation, before jumping into a time commitment, it’s important to know the end payout. App gamification, like any video game or slot machine, revolves around working towards a goal or prize. Thus, RoundUp would need to echo this by giving prominence to incentives.
The visualization of incentives, or in this case, a weekly GRAND PRIZE, is the simplest way to increase motivation. If you’ve seen a car hovering over slot machines in a casino, you know that it’s not atypical to see gamers flocking to nearby slots.
I would imitate this interface by reserving the most prominent real estate to clearly display this weekly prize. As you can see below, the Coachella tickets act as that red casino Viper that never leaves the user’s sight and keeps motivation at its max! Each event in the carousel beneath it acted as its own game, where users could attend and earn bonus points while interacting within the event venue.
3. Positive Reinforcement
One issue that arose due to the three-winner-only system, is that it guaranteed a loss to ~99% of participants. In order to keep spirits high during the full course of each week/competition, it was crucial to implement, what I like to call, “Small Wins”. These are commonly seen as coins, trophies, and badges.
In our case, they were seen as coupons (ie. the free hotdog coupon), and trophies. I designed a trophy case that housed the user’s accomplishments and assets collected. Emoji trophies were rewarded to users when completing small tasks along their journey to the top prize. These were the Small Wins that kept each user engaged and motivated.
4. Progress
Another important mechanic in any game, is the active competition between users. Progress bars and leaderboards gives users context on how they are doing in comparison with the rest of the players.
I implemented a competitive campus-wide leaderboard that displayed rankings, highlighting the 3 top students who were nearest to the grand prize. This drove engagement and word of mouth virality, as students liked to share their rank and boast to friends.
5. Variability
When products begins to feel repetitive, it most likely means its end is nearing. Of course in RoundUp, new events could be discovered each day, and new prizes offered each week. But in order for the game to have long term sustainability, there would need to be additional surprises that users could discover while engaging on their own.
Prizes such as free swag, or the hotdog example above kept our users’ attention, and fostered really strong engagement levels. To take it a step further, some days before the prize announcement, we would push out notifications letting our users know about a “24 hour Double Time”, where users could earn twice the amount of points for any action taken. Below is an example of a live event that was upgraded to 1,000 points from its original 500. This was a tactic that universities could take advantage of in order to draw attendance to less popular events.
Role in UI & Interaction Design
Through the initial research of our Generation-Z target market, I formed a clear vision of what RoundUp’s experience would become. I had a lot of fun with it’s friendly aesthetic, utilizing vibrant colors, bold fonts, high-contrast backgrounds, interactive elements, and rounded corners.
I designed interactions to be mostly gesture based, and explored bouncy transtitions and animations. I worked with the development team to bring these visions to life.
Takeaway
Gamification isn’t for every product. It’s important to understand target demographics, and reasons for wanting to add entertainment to a product. RoundUp was a perfect candidate because our research showed that students were very receptive to the idea of improving the disorganized event discovery process into something easy, fun, and engaging.
RoundUp has become a tool that many universities throughout the country have adopted to increase student involvement, engagement, and motivation. We designed innovative product growth hacks, gamification techniques, and of course, a few novel UX research methods:
