Project Spotlight: Badges
Badges already existed in Garmin Connect, but in a bad way. We were tasked with replacing them.
Badges in Garmin Connect needed work. We knew that. It didn’t take long before we realized it needed a complete overhaul. For this project I handled the mobile design and my counterpart, Tim Noltkamper, tackled the web portion. Together, we were both responsible for architecting the new badge system as a whole.
In the end we designed a system with over 100 badges catering to a specific assortment of Garmin Connect users. Feedback received both internally and externally indicates that this was a huge improvement over the outgoing, uh, “thing.”
Here’s how we did it…
So, what’s a badge? Why do they exist and why do we need them? There are plenty of other apps out there that have badges; Garmin knew it wasn’t changing the game. Rather, it was bringing Connect up to speed with others in the industry. This gave us the opportunity to take a look at what’s out there to see what works, what doesn’t, what we like, don’t like, and so on.
Badges exist to motivate users. At least in our usage, we want to convince the user to do something he or she may not have otherwise done (i.e. increase app engagement). In the Garmin Connect world, this translates to either interacting with new features or doing extra physical activity. Do the badges actually matter? I’d say they’re kinda like points on Whose Line Is It Anyway.
- Predictable – Available badges and how to earn them should be easy to learn.
- Ongoing – Our old system fizzled out after several months; the new one should allow users to continue to earn meaningful achievements indefinitely.
- Scarcity – Zombie Badge! More on this later…
- Engaging for multiple user types– some of the badges should be able to be earned by our everyday walkers while others should only be attainable by athletes running marathons.
- Visually appealing – we’d need to work closely with our graphics team for some kickass artistry.
Throughout the design we pointed back to these to make sure everything we included contributed to at least one of the five items listed above. There were also apps out there we identified as ones that shouldn’t be mimicked — looking at you, Untappd.
Knowing that the badge system that was being replaced was simple to a fault, we had the opportunity — and challenge — to design a system that was much more complex. I say “and challenge” because it still had to be easy enough for users that don’t understand all the ins and outs of our platform. Duh. Here’s what Tim and I came up with:
Badge Points and Levels
Each badge is assigned a difficulty level. Easy badges earn the user 1 point, while the most difficult badges earn 8 points. Typically, the more effort required to earn a badge, the more points it’s worth.
Points contribute to levels. Users start out at level 1 and can work their way up to level 5. It serves as a quick indicator to how many badges someone has earned.
To reinforce the pillars, we instituted several types of badges and features.
A user can earn these once. For example, Get 15,000 steps in one day. The first time you get 15k, you’ll earn the badge. The next time you hit 15k, you won’t earn the badge.
Earn these badges more than once. For example, Run a marathon. We determined an extraordinary effort like this should be rewarded every time it’s achieved.
Users earn can these only when they become available. For example, Record an activity on your birthday or Run the Garmin Marathon on April 21, 2018.
Series and Connections
Badges that are part of a series will show as related badges. Our assumption is if a user earned the 10K badge, they may be inclined to go after the the next badge in the series. Showing a list informs the user that the next badge is earned by running a half marathon.
Keeping a social mindset, the user’s connections are also shown. The connection that most recently earned it is listed first. This was done to keep things interesting for the user — maybe they earned it at the same event!?
A fair amount of design thought was put into the system design and isn’t spelled out for the user.
Badge level thresholds were setup to allow the user to move from level 1 to level 2 quickly, but the move from level 4 to level 5 takes considerably more effort.
Feature-learning badges were put in place to let badge hunters quickly earn easily attainable badges while learning about various Garmin Connect features in the process. Garmin Connect is a big ol’ app. This encourages users to explore new features they may not have otherwise discovered.
Instant gratification was a necessary component. From a Dev standpoint, it would’ve been much easier to run a nightly process. As an example, this would’ve meant that a user could’ve gone for a morning run, and 18 hours later, he/she would be awarded the badge earned during the run. Again, badges aren’t for everyone, but for those that are seeking them out, as UX designers we pushed for a backend system that instantly recognized and rewarded badges.
Another angle for motivating users has been by injecting scarcity. The best example of this is the zombie badge. Starting out, only 3 of us had this badge — we were ‘patient zero’ so to speak.
This is one of the few badges that a user can’t easily earn; they have to compete in a challenge with a user that has the badge. It didn’t take long before several thousand users contracted the virus. Between tweets, reddit posts, and forum discussions, this badge definitely piqued the interest of our users:
The badges designed were quite dynamic in the sense they are awarded to users based on criteria from virtually every single feature found on the Garmin Connect platform. From a development and testing standpoint, each individual badge could actually be considered mini feature. Initially we weren’t planning on releasing internally for testing, but it became clear that our team needed to spend time with the new system before it went live.
Testing internally for about 6 weeks was a great way to snuff out what wasn’t working. While normally I’d say UX designers shouldn’t be solely focused on testing, my designer counterpart and I were. It was tedious, but out of us, QA, Dev, and the product team, we were the most knowledgeable to quickly answer how a bug should be addressed.
In all, Tim and I spent about 6 months designing the system and another 3 or 4 supporting it through development. It’s one of the largest projects I’ve worked on in my career. And there’s a lot more to the system than I’ve outlined in this post. I hit on the main pieces but there are also things like social sharing, leaderboard, not annoying users that don’t care about badges, privacy, comparing, and profile view.
There are still unreleased features and new badges coming soon, but I can’t talk about until they’ve been released. So stay tuned!