Scenario:

At ETHIndia, thousands of hackers scroll through endless prize listings from sponsors. Many users never even notice half the available prizes because the list feels like an infinite scroll of text.

Task:

Design and build a responsive web page that lists sponsor prizes using the Intersection Observer API. When a prize card enters the viewport, it should animate or highlight to signal visibility on the prizes index sidebar.

Goals:

• Showcase smooth scroll-based animations.
• Efficiently render large lists without lag.
• Each Sponsor will have multiple tracks and track will have track title, track description and multiple prizes like “1st Prize” , “2nd Prize”, “3rd Prize”. (Take a reference from our prizes page)
• Optimize for performance and perceived smoothness.
• Implement query based routing for sponsors such that the last active sponsor position persists even after a page reload. Example

Bonus:

• Responsive Screens for Phone and Desktop.

Focus:

Frontend performance, animation taste, and clean data rendering patterns.

Reference:

• https://ethindia2024.devfolio.co/prizes

• https://ethdenver2024.devfolio.co/prizes

  Screen Recording 2025-11-08 at 8.06.09 AM.mov