Features
Explore SceneStep's main features and how to use them for creating and managing scenes or workflows.
Overview
SceneStep provides powerful tools to build, automate, and collaborate on scenes and workflows. You can create visual scenes for applications, automate repetitive tasks, work with teams in real-time, and export your work seamlessly.
Scene Building Tools
Drag-and-drop interface to design interactive scenes with nodes and connections.
Workflow Automation
Set up triggers, actions, and conditions to automate processes across apps.
Collaboration Features
Share scenes, invite team members, and edit together with version history.
Export and Sharing
Export to JSON, images, or embed codes for easy integration and distribution.
All features integrate with the SceneStep API at https://api.example.com for advanced customization.
Scene Building Tools
Build scenes using a node-based editor. Drag nodes onto the canvas, connect them, and configure properties.
Create a New Scene
Open the dashboard and click New Scene.
GET https://api.example.com/v1/scenes
Add Nodes
Drag from the node library. Common nodes include Input, Transform, and Output.
Connect and Configure
Draw connections between nodes. Double-click to edit properties like position or data mappings.
// Example node configuration
const sceneNode = {
id: "node-1",
type: "transform",
position: { x: 100, y: 200 },
data: { scale: 1.5 }
};
Workflow Automation
Automate workflows with triggers and actions. Connect to external services via webhooks or API calls.
Set up incoming webhooks for real-time automation.
// POST to your webhook URL
fetch("https://your-webhook-url.com/webhook", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ event: "user.signup", userId: 123 })
});
Run workflows on a cron schedule.
CRON: 0 9 * * 1-5 # Every weekday at 9 AM
Collaboration Features
Invite team members and collaborate in real-time. Track changes with version history.
Review scene layout
Check node positions and labels
Feedback on automation
Test triggers and actions
Final export prep
Export and Sharing
Export scenes for use elsewhere or share via links.
{
"scene": {
"nodes": [...],
"edges": [...]
},
"version": "1.0"
}
// Generate embed code
const embedUrl = "https://dashboard.example.com/embed/scene/abc123";
<iframe src="${embedUrl}" width="800" height="600"></iframe>
Use the API to automate exports: POST https://api.example.com/v1/export/scene/{id} with format parameter.