Profile Badges AI-Enhanced
Profile badges celebrate milestones like years on Xbox and Gamerscore. I designed their motion: a staggered intro, pointer tilt with a rainbow shimmer, an electric edge on high-tier badges, and click-to-replay. Premium effects scale with badge level.
The walkthrough above is a full pass over the badge row: staggered entrance, pointer tilt and shimmer, right-thumbstick rotation across the whole row, and click-to-replay.
Interaction States
Settled state. No effects running.
Electric edge, ambient glow, and a rainbow shimmer sweep.
Same shimmer, but no electric edge or glow. Effects scale with level.
Clicking drops the badge to 15% and fades it out over 120ms.
Particles gather before the badge appears.
Badge scales up through light rays, which fade as it rests.
Top milestone badge, settled.
Shimmer follows the pointer across the artwork.
Badge Panel
A devtools panel for reviewing every enumerable badge. Tenure and Gamerscore collapse to a single badge each with chevron steppers, so only two premium badges animate at once.
