.svg)
.svg)
.svg)
Creating a fantasy-inspired leaderboard for school competition
The Ron Clark Academy uses energy, recognition and competition as part of the student experience. The leaderboard needed to translate that spirit into a digital interface where students could understand their ranking, track progress, celebrate achievements, and stay motivated throughout the school year.
The goal was not simply to display scores but to make progress feel visible and rewarding.
Making complex performance data feel more playful
.svg)
Leaderboards can become difficult to read when they combine rankings, points, badges, levels, team performance, and individual progress. At the same time, highlighting only top performers can make the experience less motivating for everyone else. The challenge was to create a system that clearly recognizes achievement while still giving every student a reason to keep progressing.
Turning the leaderboard into a living school experience
We designed the leaderboard around large student portraits, expressive frames, house colors, ranking states, decorative elements, and layered backgrounds. Instead of applying one visual style across the screen, we refined each level of the interface individually from the overall composition down to borders, badges, textures, highlights, avatars, and small supporting graphics.
The result is a leaderboard that still communicates ranking clearly, but feels much more like a part of the Ron Clark Academy world.
Not ready to book a call yet?
Take a quick tour of how we work, what to expect, and how UXRS can support your product before starting a project.
Building the Fantasy Leaderboard System
We explored how competition, school identity and progress tracking could work together without making the interface feel like a traditional analytics dashboard. The process moved from research and visual exploration into multiple leaderboard concepts before defining the final direction.
Research
We explored patterns from gamified learning products, games, competitive ranking systems, and educational platforms. The focus was on how ranking, progress, recognition, and visual rewards can work together while keeping the experience understandable for students.
Visual Mood Board
The visual direction draws from fantasy games, collectible systems, and character-driven interfaces. Rather than applying game styling as decoration, we used it to make ranks, houses, achievements, and student identity feel like part of one coherent world.
AI Visual Creation
AI became part of the visual exploration process rather than a replacement for design decisions. We used generative tools to explore 7,000+ visual details, including decorative elements, textures, frames, character treatments, backgrounds, and supporting fantasy-inspired assets.
The volume allowed us to test many variations quickly, but the main work was in selection and refinement. Individual elements were reviewed, combined, adjusted, and brought into a consistent visual system so the final interface would feel intentionally designed rather than AI-generated.
UI Concept Iteration 1
The leaderboard uses strong avatar hierarchy, house colors, rank positioning, and achievement indicators to make performance easier to scan. The visual system gives top positions more emphasis without removing context for the rest of the leaderboard.
UI Concept Iteration 2
In this iteration, we changed the background, moving the scene from a dark magical space to a warm, lively atmosphere of a royal settlement.
Final UI Concept
The final Kingdom’s Journey concept created a living world with day phases, decorative details, House identity, and a playful block-pixel style.
«Kingdom’s Journey Concept»
The final leaderboard creates a more expressive way for students to understand progress and achievement. Instead of reducing performance to a number, the system uses rank, identity, milestones, and team context to create multiple sources of motivation.
The interface also provides a scalable foundation for future challenges, badges, team competitions, and other gamified learning mechanics.
A school leaderboard shouldn’t only show who is winning. It should give every student a reason to see their progress, stay involved, and keep moving forward.
Start a conversation
Tell us about your product or challenge and we’ll help you move it forward.
.svg){kind=icon}
Other ways to connect
You can also connect with our team through social platforms and follow our latest design work and updates.
.svg)
.svg)
.jpg)
.svg)
.svg)
.svg)
.svg)
.svg)