Drop your .spz, .splat, .ply, .gltf, or .glb file here to load

Infinity FPS

File

Tools

Local File Tools:

Compress PLYDecompress PLY

PLY to .splatPLY to .spz

SPZ to .ply

Preferred Viewer:

Local File Management

Please login (if needed) and save your splat before exporting to HTML.

Load From Json

Load Remote Splats (URL)

Load Example Splats

Controls:

W/A/S/D: Move camera
Q/E: Up/Down
I/P: Roll Camera
Mouse: Look around
Scroll: Move along path
Drag and drop a .splat or .ply file to load

Welcome to Story Splat!

Getting Started: Loading Your Model

There are two ways to add your 3D model to Story Splat:

Drag and Drop: Simply drag your model file directly into the viewer
URL Method: If your model is hosted online, click the "File" menu and paste the URL (must be CORS accessable)

Remember: You must create at least one waypoint before you can export your story. This first waypoint sets your initial camera position!

Creating Your Story Path with Waypoints

Waypoints are like stops on your story's journey. Here's how to use them:

Creating Waypoints: Click the "Waypoints" button and use the "+" button to add a new waypoint at your current camera position
Adding Details: Each waypoint can have:
- Text descriptions
- Spatial Audio
Ordering: Arrange waypoints to create your story's path - the camera will follow this path when viewing

Making Your Story Interactive

Story Splat offers several ways to make your story more interactive:

Hotspots: Add clickable points of interest in your scene
- Click or hover over "Hotspots" to view information
- Add text/image popups to each hotspot
- Link to external content
Collision Areas: Create invisible boundaries
- Use the "Collision" menu to add boundary boxes
- Keep viewers within specific areas
- Guide the story experience

Camera Modes Explained

Story Splat has three different ways to view your story:

Tour Mode: The camera automatically follows your waypoint path, perfect for presenting your story
Explore Mode: Free movement using WASD+QE keys, mouse looking, and I/P keys for camera roll.
Hybrid Mode: A special combination that:
- Follows the waypoint path as viewers scroll
- Allows free exploration at any time
- Perfect for interactive storytelling!

Tips for Great Stories

Start with an interesting first waypoint - it's what viewers see first!
Use hotspots to highlight interesting details
Add spatial audio to make your story more engaging
Test your story in different camera modes to see what works best
Save your work often using the File menu

Need More Help?

If you need any help, you can:

Join our Discord community (click the Discord button)
Check out the Examples page for inspiration
Email us at help@storysplat.com

View Full Documentation →

Discover PricingJoin Discord

Settings

Auto Frame Scene

Automatically frame the scene when loading new files

Use CORS Proxy

Enable this to bypass CORS restrictions when loading external resources.

Use Splat Fade Effect

Enable this to use node material for rendering splats

Camera Settings

Splat Transform

UI Color

Waypoints

Enter edit mode to modify waypoint positions

Autoplay Mode

When enabled, the camera moves along the path automatically.

Loop Mode

If enabled, the path loops from the last waypoint to the first.

Set the first waypoint at the current camera position

Hotspots

HTML Mesh ManagerBeta

Create New HTML Mesh

Content Type

HTML ContentDimensions

Fit Strategy

HTML Meshes (0)

Collision Meshes

Particle Systems

Scene Lighting

Effects Meshes Only

Enter edit mode to modify lights

Splat Swap Controls

Please upload an initial splat model first

Please add at least one waypoint to use waypoint triggers

Initial Splat

No splat loaded

Add New Splat

WaypointPercentage

WaypointChoose Splat File

Please sign in to add splats

Environment Skybox

Background Color

Upload Skybox

Rotation

3D Models

Custom Script EditorBeta

Saved

Scripts run only in exported HTML for performance and safety. Use Ctrl+S to save.

Security: Only run scripts from trusted sources. Scripts have full scene access in exported HTML.

Example Scripts

API Reference

Core Objects:

scene - Babylon.js scene object
camera - Current camera object
BABYLON - Full Babylon.js namespace
canvas - HTML canvas element

State Functions:

getScrollPercentage() - Returns 0-1 scroll progress
getCurrentWaypointIndex() - Returns current waypoint index
getHotspots() - Returns array of hotspot data
getHTMLMeshes() - Returns array of HTML mesh data
getSplats() - Returns array of splat meshes

Note: Scripts execute only in exported HTML files, not in the editor.

v2.0.0-preview

Enter ArcRotate Mode