Documentation Index
Fetch the complete documentation index at: https://docs.imagine.art/llms.txt
Use this file to discover all available pages before exploring further.
Summary
App Builder turns any workflow into a standalone app. Add an Input Node to define what users can control, add an Output Node to define what they see, and everything in between runs behind the scenes. The result is a clean, focused tool — inputs on the left, results in the center.Before You Start
Make sure your workflow is complete and generating the results you want. App Builder packages what you’ve already built — so the better your workflow runs on canvas, the better it will run as an app.Step 1: Build Your Workflow
Create your workflow as usual on the canvas — connect prompts, generation nodes, editing nodes, and any other steps you need. This is your pipeline. The app will run it exactly as-is, but users will only see the parts you choose to expose.Step 2: Open App Builder
Click the App Builder tab in the left panel. Your Input and Output nodes will directly be added in the canvas. You’ll see options to add an Input Node and an Output Node if you mistakenly delete them from canvas.Step 3: “What should users control?”
This is where you define the app’s interface. Input Node will collect all user-facing parameters into one place.How the Input Node works
The Input Node collects parameters from your workflow through handle connections. Every node in your workflow has input handles - small connection points for parameters like prompts, images, or settings. To expose a parameter to app users, you connect that handle to the Input Node. There are two ways to do this: Option 1: Connect handles directly — Drag a connection from any node’s input handle to the Input Node on the canvas. That parameter now appears in the Input Node and becomes part of the app’s interface. Option 2: Use the “Set As Input” shortcut — Go to any node’s settings panel and click “Set As Input” next to the parameter you want to expose. This automatically creates the handle connection to the Input Node for you. Not everything needs to be user-facing - that’s the whole point. You choose which handles to connect. For example, you might expose the main prompt and an image upload, but keep the model selection, resolution, and step count locked to your preferred settings. Whatever isn’t connected to the Input Node stays hidden and runs with your defaults.Naming your inputs
Input field names are what users see when they open your app. Rename them to be clear and specific:| Instead of… | Use something like… |
|---|---|
| Input 1 | ”Describe your scene” |
| Image | ”Upload your product photo” |
| Text | ”Enter your script” |
| Parameter | ”Choose a style” |
Step 4: Add Presets (Optional but Recommended)
Presets are pre-filled input options that let users generate results immediately — without writing a prompt from scratch.How to add presets
- Click “Add presets” next to any input field in the Input Node.
- For text inputs: add preset prompts (e.g., a set of scene descriptions or style directions).
- For image inputs: add a set of predefined reference images.
- Click ”+ Add another preset” to add more options.
- Click ”+ Add new category” to organize presets into groups (e.g., “Female”, “Male”, “Product Shots”).
Step 5: “What should users see?”
Drag the Output Node onto the canvas and connect it to the final generation node in your workflow. This defines what result appears when the app finishes running. The Output Node supports multiple output types — images, videos, or audio — connected to a single node. Whatever your workflow produces at the end is what users see.Step 6: Preview Your App
Switch from Editor to App using the toggle at the top center of the screen. This shows you exactly what users will see:| Panel | What It Shows |
|---|---|
| Left | All input fields from the Input Node — prompts, file uploads, dropdowns, presets. Plus “Run App” and “Publish App” buttons. |
| Center | Generated output — images, videos, or audio displayed as a preview. |
| Right | Generation details — the prompt used, settings applied, and a thumbnail of the output. |
Step 7: Test Your App
Click “Run App” at the bottom of the left panel to test the full flow. Try different inputs, check that presets work correctly, and verify the output matches what you expect.Key Rules
- One Input Node and one Output Node per workflow — meaning one app per canvas.
- Both nodes must be connected for publishing to be available.
- Any node parameter can be exposed by connecting its input handle to the Input Node, or by using the “Set As Input” shortcut in that node’s settings.
- Input field names are editable — always rename them to be user-friendly.
- Presets are optional but recommended — they lower the barrier for new users.
Tips & Best Practices
- Expose only what matters. The fewer inputs users have to think about, the easier your app is to use. Lock down technical settings and only expose creative choices.
- Use clear, specific names. “Upload a front-facing product shot” is better than “Image Input.” Users should know exactly what to provide.
- Organize presets into categories. If you have many presets, group them (e.g., “Portraits”, “Landscapes”, “Abstract”) so users can browse without scrolling through a flat list.
- Test with someone unfamiliar. Your workflow makes sense to you because you built it. Have someone else try the app view to catch confusing labels or missing presets.
- Keep the output clean. Connect the Output Node to your final, polished result — not an intermediate step. Users expect the output to be the finished product.