A playful star rating UI that celebrates user selection with dynamic motion and a burst effect; the higher the rating, the more pronounced the animation and celebratory burst

Click on the stars

PROBLEM:
Star rating UIs often feel flat and unrewarding; Users benefit from an engaging feedback moment that confirms their action, boosts satisfaction, and encourages them to provide feedback more thoughtfully.

GOAL:
Design a star rating UI that provides engaging, rewarding feedback through motion and celebratory effects, confirming user actions, enhancing satisfaction, and encouraging meaningful feedback submission

SOLLUTION:
Tapping a star triggers a subtle jiggle on the selected star and its neighbours; Once the selection is confirmed, a gentle burst emits tiny particles and a soft glow before settling. Higher ratings produce more pronounced motion and a more celebratory burst.

TECHNICAL NOTES:

  • Built with Rive State Machines to manage interactive states and transitions.

  • Click triggers to control the animation.

  • Fully vector-based, lightweight animation for high-performance rendering.

  • Exported as a .riv file, ready for direct integration on mobile and web platforms.

Let’s Create
Human-Centred
Digital Experiences

Send an Email

Let’s Create
Human-Centred
Digital Experiences

Send an Email

Let’s Create
Human-Centred
Digital Experiences

Send an Email

Create a free website with Framer, the website builder loved by startups, designers and agencies.