Frontend UX/UI

Interactive Video Guide

This component modernized a client's onboarding workflow—originally built in 2018 with vanilla JS—by using React state hooks, useEffect, and the YouTube Player API to synchronize video playback, countdown timers (via React Countdown Circle Timer), and user instructions. GSAP and its ScrollTo plugin enabled smooth automatic scrolling between steps, resulting in a more modular, reusable, and controlled implementation.

Technologies used

• React
• GSAP
• JavaScript
• Tailwind CSS
• Next.js