The Import node acts as a container for external media assets. You can import vector graphics (SVG), raster images (PNG, JPG), and video files (MP4, WebM).
Once imported, the asset is treated like any other shape You can connect it to Transform, Color, or other property nodes to manipulate its position, scale, rotation, and appearance.
Parameters
| Parameter | Description |
|---|---|
Label | The display name for the node in the graph. |
Source File | Import an image or video from your computer. |
Source URL | Paste an image or video URL to import from the web. |
Position | Moves the imported content in X and Y direction. |
Size | Controls the size of the content. |
Scale | Scales the content from its center. |
Rotation | Rotates the content around its center. |
Opacity | Controls the transparency of the content. |
Blur | Applies a Gaussian blur effect to the content. |
Frame Range | Sets the start and end frames for playback. |
Playback | Toggles animation playback. |
Usage
To use the Import node, click the “Source” button on the node’s parameters panel. This will open a file dialog, allowing you to select a file from your computer.
- Vector Images (SVG): Imported SVGs are rendered as vector graphics, preserving their scalability and original appearance.
- Raster Images (PNG, JPG, etc.): Standard image formats are imported as raster graphics.
- Video Files (MP4, WebM, etc.): Videos can be imported for animated playback. See the Video Playback section below for more details.
- A Note on GIFs: Animated GIFs are imported as static images, using only their first frame. They will not animate and the playback controls will not be available.
File Handling and Portability
To make projects self-contained and portable, most imported files are embedded directly into your project file. This means you can delete the original file from your computer, and it will still be available in your project. Yay!
| File Type | How It’s Handled |
|---|---|
| Images (PNG, JPG, etc.) | Embedded directly into the project file as data. The original file is no longer needed. |
| SVG | The full SVG code is embedded into the project file. The original file is no longer needed. |
| Small Videos (less than 5MB) | Embedded directly into the project file as data. The original file is no longer needed. |
| Large Videos (more than 5MB) | Linked locally for the current session. Not saved with the project. The original file must be kept on disk during project reopening. Otherwise will throw an error. |
Video Playback
When a video file is imported, additional parameters for controlling playback will appear:
- Frame Range: Allows you to set the
StartandEndframes for the playback loop. The values are automatically clamped to the video’s actual duration. - Playback Toggle: The play/pause button next to the Frame Range inputs controls the animation on the main canvas.
Playback is only visible on the main canvas render. The node preview in the graph will show a static video icon to indicate that the source is an animated video.