10 Examples of Badges Used in Gamification

Badges are the most visible part of any achievement system, and visibility is the point. The design decisions that determine whether a badge system retains users sit not only in what gets rewarded but in how those rewards are shown: to the user, to their community, and at what moment.

Trophy's platform data captures this directly. Apps that make achievement progress visible to others produce average streaks 34% longer than apps where progress remains private.

Badge visibility	Avg streak length (days)	p95 streak length (days)
Social features enabled	5.69	12.00
No social features	4.25	7.00

Source: Trophy platform data, April 2026. Streak length distributions comparing organisations using social gamification features against those that do not.

The p95 difference is as striking as the average: the most engaged users in social-feature apps maintain 12-day streaks versus 7-day streaks without them. Visibility doesn't just nudge average behaviour; it pulls the most committed users substantially further.

The ten platforms below each make distinct decisions about how to display badges , where they appear, who can see them, what additional information accompanies them, and when they're surfaced. Each decision has consequences.

1. GitHub: Permanent Public Display as Professional Identity

GitHub's badges and contribution history live permanently on a public profile. There's no option to make the contribution graph private by default, no "friends only" setting, no separate feed for achievements. The public display is the design.

What makes GitHub's approach distinctive is the audience. The people who can see a developer's contribution history aren't strangers , they're potential employers, open source collaborators, and professional peers whose opinion carries genuine weight. A sparse contribution graph has professional implications that a sparse fitness log doesn't. The accountability pressure comes not from the size of the audience but from its relevance.

The contribution graph is also cumulative: every green square stays on the profile permanently. Unlike a leaderboard position that changes weekly, or a streak that resets to zero, the GitHub history only grows. This creates a compounding social investment , the longer a developer uses GitHub, the more their profile represents, and the higher the cost of abandoning it.

The badge design implication: permanence and audience relevance matter more than audience size. A small, professionally relevant group creates more accountability than a large anonymous one.

2. Khan Academy: Visual Hierarchy That Communicates Progress at a Glance

Khan Academy's badge system uses distinct visual tiers ; Meteorite, Moon, Earth, Sun, Black Hole, each with progressively more elaborate artwork. A user can tell at a glance whether a badge represents a minor accomplishment or a significant one, without reading any label.

This is badge design solving a specific problem in long-form learning: progress is gradual and easily invisible. A learner who has spent three months working through algebra can feel like they're still at the beginning. The visual tier system converts that invisible progress into a concrete, legible signal: a Black Hole badge communicates "this person has done a significant amount of work" in a way that a point total or percentage bar doesn't.

The second function is aspiration. A new user who sees the range of badge tiers understands immediately that there's a long way to go. The artwork quality difference between a Meteorite and a Black Hole creates pull toward the higher tiers , the badge has to look worth earning for the pursuit to feel meaningful.

The design principle: when progress is gradual or internal (learning, skill development, habit formation), visual differentiation in badge artwork does retention work that text alone can't.

3. Reddit: Badges as Community Membership Signals

Reddit badges communicate identity within specific communities rather than achievement on a global scale. A badge earned on a particular subreddit signals investment in that community , it's visible to everyone who encounters that user's comments, but its meaning is fully legible only within the community that awarded it.

Reddit also uses badges to signal platform access and status: premium membership, moderator status, and verified contributions. These are visible on every comment and post, not tucked away on a profile page. The persistent visibility is deliberate: a badge seen only by the user who earned it has no social function.

The display strategy is contextual rather than central. Reddit doesn't have a "badge showcase" page that lists everything a user has earned. Badges surface where they're relevant , attached to user names in threads where the context makes them meaningful. This reduces badge fatigue while maintaining the social signal function.

The lesson: where a badge appears matters as much as whether it exists. Context-appropriate display (alongside content the user contributed) is more effective than a hidden collection page.

4. Strava: Event Badges That Create Time-Bounded Urgency

Strava's permanent achievement system (KOM/QOM, segment records, personal bests) runs alongside a separate category of limited-time event badges: seasonal challenges, virtual races, global events like the Virtual San Silvestre 5K.

The display distinction between these two categories matters. Permanent achievement badges signal long-term capability. Event badges are time-stamped , they show when the challenge was completed, which links the badge to a specific moment rather than a general state of ability. An event badge from the 2024 Virtual London Marathon means something different to the viewer than a badge showing all-time 5K speed.

The time-bounded display also creates urgency that evergreen mechanics can't produce. A badge available for six weeks has a closing window; a user who wants it has to act now. Trophy's platform data shows the p95 of streak lengths extends significantly with social features, and event badges are a primary mechanism for pulling that right tail , the most engaged users show up specifically for time-limited achievements.

The combination of a permanent progression system and periodic event badges gives Strava users two distinct reasons to engage: the ongoing pursuit of capability badges and the short-term urgency of event badges. Neither alone sustains engagement as effectively as both together.

5. Headspace: Streak Badges as the Primary Visual in the App

Headspace puts the streak badge at the centre of the main app interface rather than on a separate achievements page. The current streak length is the first thing a returning user sees.

This display decision reflects a specific product insight: for a meditation app, the streak is the product. The primary value Headspace is trying to deliver , consistent daily practice , is exactly what the streak measures. Putting the streak badge at the centre of the interface rather than treating it as a secondary reward makes the desired behaviour impossible to miss.

The visual design of the streak badge changes as the streak grows: longer streaks get more elaborate flame designs. This progressive visual reward means the badge itself becomes more prominent and more personally meaningful as users invest more time in the product. A user with a 90-day streak has a visually distinct badge from a user with a 5-day streak, and that distinction is visible every time they open the app.

The placement principle: badge placement should reflect product priority. If streak consistency is what the product is trying to drive, the streak badge should be the first thing users see, not one item in a list of achievements.

6. Duolingo: Badges Placed Inside the Learning Flow

Duolingo doesn't surface the full badge collection as the primary engagement mechanism. Badges appear at specific moments in the learning experience: after a lesson streak reaches a milestone, when a league position is achieved, when a skill is mastered; rather than being viewable at any time from a central showcase.

Some badges are tied to features users might not have discovered yet: Stories, Podcasts, specific practice modes. Because these badges appear only when the user engages with the relevant feature, they function as in-flow discovery prompts rather than as items on an achievement checklist. A user who unlocks a badge after completing their first Stories lesson becomes aware of Stories as a permanent feature through the badge reward rather than through onboarding copy.

The implication for badge display strategy: not all badges should be visible before they're earned. Showing the full collection of unearned badges creates a to-do list that can feel overwhelming or arbitrary. Surfacing badges at the moment of relevant discovery creates a different relationship between the user and the badge , the recognition arrives at the exact moment of first engagement with the feature being rewarded.

7. Stack Overflow: Tiered Badge Artwork to Signal Achievement Weight

Stack Overflow uses a three-tier visual system for badges: bronze, silver, and gold. Each tier has a distinct icon colour. The tier is visible at a glance on every badge displayed on a user's profile, and it communicates immediately how significant the achievement was relative to others.

This tiered display solves a specific problem: badge collections become meaningless if every badge looks the same. A profile with 200 identical-looking badges doesn't communicate anything about the user's relative contribution or effort. Stack Overflow's colour differentiation means a single gold badge reads differently from twenty bronze badges even before anyone reads the label.

The profile display is intentionally dense ; Stack Overflow shows badge counts per tier (e.g., "3 gold, 15 silver, 47 bronze") rather than listing each one individually. This gives viewers a rapid signal about contribution level without requiring them to read badge names. A user with three gold badges is quickly recognisable as a significant contributor.

Trophy's Achievements API returns a rarity field on every achievement , the percentage of users who have earned it. This field exists specifically to support tiered display: teams can use rarity to classify badges as common, rare, or elite and apply corresponding visual treatment, replicating the Stack Overflow signal without hardcoding fixed thresholds.

8. Untappd: Badge Collections as Completionist Engagement

Untappd displays earned badges in a collection that functions as a permanent personal record of the user's beverage exploration. The collection is public by default, visible on profiles and surfaced in a social feed that shows friends' recent badge unlocks.

Two display decisions create the engagement loop. First, the social feed shows friends' badge unlocks in real time , when a friend earns an "IPA Explorer" badge, that badge appears in your feed as an implicit recommendation that the category is worth exploring. The badge display doubles as content discovery. Second, the collection page shows both earned and unearned badges in a browsable grid. Seeing a partially-filled grid activates the Zeigarnik effect: the incomplete state creates psychological tension toward completion.

The "partially completed collection" display is a deliberate design choice. Many apps hide unearned badges and only show what's been achieved. Untappd does the opposite , visible gaps create a pull toward filling them. This works specifically because the action required (trying new beers) is enjoyable rather than effortful. For apps where the behaviour being rewarded is inherently rewarding, showing the gaps is a more effective engagement mechanism than hiding them.

9. Nike Run Club: Seasonal Badge Design to Maintain Visual Freshness

Nike Run Club issues new badge designs for seasonal events and challenges. The visual design of the badge changes with the challenge theme : a winter distance challenge has different artwork from a spring speed challenge; rather than using a single consistent badge template.

This matters because badge collections accrue over time. A user who has been with Nike Run Club for two years has a profile that tells a visual story , different artwork from different seasons creates a timeline of activity rather than a uniform stack of identical-looking badges. The collection functions as a personal history rather than just an achievement checklist.

The seasonal design also addresses badge fatigue. A user who has earned five distance badges with identical artwork may not be motivated to earn a sixth. Five distance badges from five different seasons, each with distinct visual design, creates a different completionist impulse , the difference between the badges is visible and therefore motivates continued participation.

The principle: badge artwork should have enough visual variety that a growing collection looks richer rather than more repetitive. Seasonal or themed design achieves this without requiring a completely different badge system for each new challenge.

10. Playground Sessions: Immediate Display at the Moment of Frustration

Playground Sessions surfaces badge notifications at specific moments in the learning experience rather than batching them into a summary or waiting for the next app open. When a user crosses a mastery threshold, the badge notification appears immediately within the practice session.

The timing matters because piano learning has a specific frustration pattern: early progress feels fast, intermediate stages feel slow, and the gap between attempting a passage and mastering it can span days of practice. A badge that appears the moment a mastery threshold is crossed arrives at the exact point where the user is most likely to feel the payoff of their effort.

Batching badge notifications into daily summaries or showing them on the next app open loses this effect entirely. A "you earned a badge last Thursday" notification carries no motivational weight. The recognition has to be immediate to complete the behavioural loop: effort, improvement, recognition, in sequence within the same session.

Trophy's Achievements API evaluates triggers in real time and returns completion events as they happen rather than in batches. This makes immediate in-session badge delivery the default rather than a feature requiring custom scheduling infrastructure.

The Display Layer Is Where Badge Systems Succeed or Fail

The ten examples above share an observation: the design decisions that produce durable engagement are display decisions as much as they are reward decisions.

GitHub's contribution graph retains developers not because contributing to open source earns a badge, but because that badge lives permanently on a professionally relevant profile. Headspace's streak badge works because it sits at the centre of the interface rather than on a secondary achievements page. Stack Overflow's tiered colour system communicates contribution weight at a glance because the visual differentiation is legible. Untappd's completionist engagement works because unearned badges are visible alongside earned ones.

Four display principles emerge across these implementations. Placement should reflect product priority: the badge for the behaviour you most want to drive should appear where users can't miss it. Audience relevance matters more than audience size: a small group of professionally or socially relevant peers creates more accountability than a large anonymous one. Visual differentiation communicates achievement weight: identical-looking badges for achievements of different significance flattens the signal. Timing should close the behavioural loop: recognition that arrives after the session is over loses the associative connection between effort and reward.

For teams building badge systems with Trophy, the Achievements API returns a rarity field for each achievement and delivers completion events in real time, supporting tiered display and immediate in-session notification without custom scheduling infrastructure.

FAQ

Should I show users badges they haven't earned yet?

It depends on whether the action required to earn the badge is inherently appealing or effortful. Untappd shows unearned badges because trying new beers is enjoyable , seeing the gap creates a pull toward a pleasant activity. For badges that require effortful or repetitive actions, showing the full unearned collection can feel overwhelming. A better approach for effort-based systems is to show the next one or two achievable badges rather than the complete catalogue.

How prominently should I display badges in my app's UI?

Placement should match product priority. If the badge tracks the primary behaviour you want to drive (like Headspace's streak badge at the centre of the interface), it should be prominent and unavoidable. If badges are supplementary to the core experience, a profile or achievements tab is appropriate. Avoid burying badges several taps deep if they're meant to influence daily behaviour.

Does showing badge progress to other users actually improve retention?

Trophy's platform data shows apps with social streak features produce average streaks 34% longer than apps without them (5.69 days versus 4.25). The p95 is more pronounced: 12 days versus 7. Social visibility works through accountability rather than competition , the pressure of a publicly visible streak or badge progress applies regardless of where the user sits in any ranking.

What's the right way to handle badge rarity?

Rarity signals (what percentage of users have earned a badge) add display value when they're visible on the badge itself rather than hidden in a tooltip. Stack Overflow's bronze/silver/gold tier system achieves this through colour. Trophy's Achievements API returns a rarity field as a percentage, which teams can use to automatically classify badges as common, rare, or elite and apply corresponding artwork or colour treatment.

Should badges be permanent or time-limited?

Permanent badges that represent capability or milestone achievements should never expire; the compounding investment value depends on permanence. Time-limited event badges work well as supplements to a permanent system: they create short-term urgency without undermining the long-term progression structure. Removing or expiring a badge a user has already earned is one of the fastest ways to generate active disengagement.

How do I avoid badge fatigue as the collection grows?

Visual variety across badge artwork is the primary tool. Nike Run Club's seasonal design means a growing collection looks richer rather than more repetitive. Stack Overflow's tier system prevents a large collection from becoming visually homogeneous. For apps where badge accumulation is the point (Untappd), the collection display needs to remain visually engaging at 50, 100, and 500 badges. For apps where badges are supplementary, a limit on how many are shown in the primary profile view prevents the collection from becoming noise.