Navigation
Getting Started
Spotlight supports five types of interactive experiences. Each is powered by a dedicated Scaleflex JS plugin and has its own builder in the dashboard.
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:
| Feature | Hotspot | 360° Spin | Before/After | Tour | 3D View |
|---|---|---|---|---|---|
| Assets needed | 1 image | 12–72 frames | 2 images | 1 image per scene | 1 3D model |
| Interactive elements | Markers + popovers | Drag rotation | Slider handle | Markers + scene links | Orbit + zoom |
| Autoplay | No | Yes | No | No | Auto-rotate |
| Mobile friendly | Yes (touch) | Yes (swipe) | Yes (touch drag) | Yes (touch) | Yes (touch orbit) |
| Best for | Product detail | Product overview | Comparisons | Walkthroughs | 3D showcases |