Mozilla Skin*/?>

CL2 Animation

From ConduitWiki

There are several ways to create animation in Conduit Live. The method to choose depends on the use case, and of course user preference.

Keyframe animation

The method familiar from many other video applications is keyframe animation, in which key values are set at specific times, and the application takes care of interpolating values for the majority of frames that fall between the key frames. Keyframe animation is usually controlled with curves that offer a visual representation of how the values change over time.

Conduit Live 2 offers keyframe animation in two node widgets: Slider Bank and Animation Curves. Both use the same interface for creating and editing keyframes, the Curve Editor window:


When you set keyframes on a Slider Bank node widget, they will override the slider values that you would otherwise enter manually using the controls in the Sliders window (or using a hardware device like a MIDI controller). This is the easiest way to set keyframes, because you can preview the animation using the slider controls, then "set it in stone" by creating keyframes.

(Note that this method requires that your project is in Timeline mode. If you need to create keyframes in Free Run mode, see below.)

To create slider keyframes, click on the "Curve" icon next to the slider's input field (in the Sliders window). This opens the Curve Editor window.

In Free Run mode, it's not possible to set slider keyframes. This is because sliders in typical Free Run projects are controlled by user interaction (either the on-screen controls or through a MIDI connection), and enabling keyframes would obstruct the expected interaction.

Instead, the Animation Curves node widget can be used to create keyframes that are computed in Free Run mode:


An Animation Curves node widget can contain as many curves as you need. The node has a single output port, through which the current values for all the curves are output as a list. (In other words, it works just like the Slider Bank node, and can be used in its place.)

Each curve has options that can be accessed by clicking on the "Tools" button (gear icon):

  • Loop mode: Play once / Loop. If "play once" is set, the animation curve's value remains at its last value after the curve's last keyframe has been reached.
  • File import/export. The animation curve can be saved as a plain-text file, and loaded back to Conduit.

Procedural animation

Animation can also be created procedurally, that is, by writing a program that renders animated graphics. Conduit offers an extensive programming interface that's accessible through JavaScript. Thanks to Conduit's advanced JavaScript engine, it's possible to do realtime and GPU-accelerated rendering in JavaScript programs.

A good place to start learning about graphics programming in Conduit is the Tutorials section of this wiki.

Conduit Live 2 also includes another graphics programming language, the popular Processing. The Processing website describes it as follows:

Processing is an open source programming language and environment for people who want to create images, animations, and interactions. Initially developed to serve as a software sketchbook and to teach fundamentals of computer programming within a visual context, Processing also has evolved into a tool for generating finished professional work. Today, tens of thousands of students, artists, designers, researchers, and hobbyists who use Processing for learning, prototyping, and production.

To use Processing, create a Processing Effect node widget in the Conduit Live project.

Stage Tools animation

Stage Tools is an add-on to Conduit Live. It's a complete toolset for creating live performances.

Stage Tools makes it possible to create animation through events that are triggered live. Events can be programmed into sequences that can modify almost anything in in the Conduit Live project: animate sliders, load video clips, change Conduit effects, perform JavaScript operations, etc.

For more information, please see Stage Tools overview.