Navigation
Getting Started
Spotlight supports seven types of interactive experiences. Each has its own builder in the dashboard with a shared three-panel layout.
Place interactive markers on any image. Each hotspot triggers a popover with product details, links, or custom HTML content.
Common use cases:
Let users drag to rotate a product through a sequence of frames. Supports single-row (horizontal) rotation with autoplay and drag interaction.
Common use cases:
Compare two images with a draggable slider. The user drags a handle to reveal more or less of each image.
Common use cases:
Create multi-scene guided experiences. Each scene is a hotspot image with navigation links between scenes, forming an interactive tour.
Common use cases:
Display interactive 3D models with orbit controls, lighting, animations, and auto-rotation. Visitors can rotate, zoom, and explore the model from any angle.
Common use cases:
Add interactive hotspot pins to video content with time-based triggers. Hotspots appear and move along keyframed paths as the video plays, with product popovers and chapters.
Common use cases:
Guide users through annotated screenshots with region highlights and zoom. Create multi-scene experiences that walk viewers through key areas of an image with mask overlays.
Common use cases:
| Feature | Hotspot | 360° Spin | Before/After | Tour | 3D View | Video Hotspot | Spotlight |
|---|---|---|---|---|---|---|---|
| Assets needed | 1 image | 12–72 frames | 2 images | 1 image per scene | 1 3D model | 1 video | 1+ images |
| Interactive elements | Markers + popovers | Drag rotation | Slider handle | Markers + scene links | Orbit + zoom | Time-based markers + popovers | Region highlights + annotations |
| Autoplay | No | Yes | No | No | Auto-rotate | Yes | No |
| Mobile friendly | Yes (touch) | Yes (swipe) | Yes (touch drag) | Yes (touch) | Yes (touch orbit) | Yes (touch) | Yes (touch) |
| Best for | Product detail | Product overview | Comparisons | Walkthroughs | 3D showcases | Shoppable video | Feature walkthroughs |