Implement a CSS/JS Animation

Problem Live-code a given UI animation from a shared spec or reference clip — for example an element that fades, slides, or scales in response to user interaction — within the interview session.

Be ready to discuss

• Choosing the right tool for the job: CSS transitions or keyframes for simple state-based animation, versus the Web Animations API or a requestAnimationFrame loop for complex or interruptible sequences
• Structuring the component so animation state does not cause unnecessary re-renders — in a React context, keeping animation-driving state out of heavy re-render paths, or toggling CSS classes via refs
• Interruption handling: what happens when the user re-triggers the animation mid-flight, and how to cancel or reverse it cleanly rather than stacking transitions
• Accessibility: respecting prefers-reduced-motion instead of forcing motion on every user
• Performance: animating transform and opacity, which the compositor can handle off the main thread, rather than layout-triggering properties like width, top, or margin