About Shoppable Video
Discover how Cloudinary’s Shoppable Video Player, Motion.dev animations, and shadcn/ui components combine to create a seamless, interactive shopping experience in any Next.js store. Scroll down to see the features, or tap the button below to try the live demo.
Interactive Product Hotspots
Tap-ready pins pop up exactly when a product is on screen, revealing price, name and a Buy Now link without pausing the video.
Auto-Scrolling Product Panel
A slide-in panel lists every item as it appears, keeps itself in sync with the timeline, and highlights the product currently on screen.
Time-Synced Event Analytics
Every view, hover, seek and click is time-stamped and pushed to GA 4 / Segment, giving you conversion-grade insight at the second-level.
One-Click Checkout Links
Each call-to-action deep-links to your product page with optional discount codes pre-applied—no friction, more sales.
Built With
Next.js 15React 19Tailwind CSS 4shadcn/uiMotion.devCloudinary AI