Flow Nodes have two 2D visual types represented by pixels; video and graphic (an image).

Playing

To play a video, add the new Player node.

Player

This node takes video in and returns graphic out.

The new node is available in Flow Nodes 4.

Sampling

To sample a video frame into a graphic, use the Sample node.

Sample

Once you got the video frame, you can apply any graphic effect to it.

<aside> <img src="/icons/light-bulb_gray.svg" alt="/icons/light-bulb_gray.svg" width="40px" />

To get the frame count and fps of a video, use the video Metadata node.

Metadata

</aside>

Editing

To edit every frame in a video, a Video Edit node is required. It will loop through every frame in the video and apply the edit you specify. This map node takes two video inputs, the source and destination. Destination can be an empty video State node.

Video Edit

Seeking

If you want to seek the video with a slider, see the demo in the app or follow this guide:

1. Add a video State node and load in your video.
   1. Alternatively long press in iOS or right click on macOS, and import the video from the context menu or import it from the node creation panel.
2. Add a video Metadata node, this node can read the resolution along with the frame count.
   1. Wire the video outlet on the video state node to the metadata node.
   2. The frame count will be needed to calculate the frame index.
3. Add a Slider node.
   1. This node takes a binding to a float value as it’s input, a binding (a double wire).
   2. To get the value we will need to wire upstream (left) to a state.