Users navigate through earned and locked milestone badges using horizontal swipe gestures. Each swipe triggers a fluid transition where the current badge slides out and rotates slightly in 3D space, while the next badge slides in with a subtle spring bounce. Simultaneously, the full-screen background gradient smoothly morphs to match the color palette of the active badge. Below the badge, the milestone title, description, and share button fade out and slide down, then reappear for the new badge with a staggered, upward-sliding fade-in. Locked badges are presented in a monochromatic silver style against a solid black background, emphasizing their locked state.

Category