Getting Started

This first tutorial follows the pre-Revolutionary (pick one) tradition of "read in images—comp the images together—render the images out" to give you an idea of what Shake is about. The following Intermediate tutorial discusses parameter animation, basic color correction, node manipulation, how to launder money, and other things that beat puttering around the house. The Advanced tutorial section discusses how to track, pull keys, work with Z channels in exceedingly clever ways, and how to work with expressions and macros. Nothing that you need to survive a post-nuclear holocaust, but still useful tricks all the same.

Before you begin the tutorials, it is really highly beggingly pleadingly achingly suggested that you poke around the Overview section. The Overview section contains information about color corrections, keying and spill suppression, masking, transforms, caching, premultiplication, bit depth, logarithmic color space, the cure for cancer, and so on. The Masks section of the Overview is in a tutorial format, so there you go, a little tutorial bonus.

Mac OS X Notes. The following information relates to Shake on Mac OS X and its documentation.

Use a 3-button mouse. Although you can press Ctrl and click the mouse button (of a 1-button mouse) to show context menus in the Shake interface, a 3-button mouse greatly enhances the Shake workflow. Shake also supports the middle roller wheel of a 3-button mouse.

Delete vs Del key. The Shake documentation refers to the delete key on the Macintosh keyboard as the Backspace key. This is the key immediately below F12. The Del key (a small key in a group of six keys, such as Page down, Page Up, and Home) is referred to as the Delete key. If you are using a smaller Macintosh keyboard without the Del key, use Option+delete (again, the delete key below F12).

Command Vs Ctrl. You can use Command or Ctrl interchangeably for hot keys. For example, use Ctrl+C or Command+C to copy an object.

Launching Shake in the Terminal. Mac OS X wraps up binaries and its contents into one icon in the browser. Clicking on the Shake icon in Mac OS X launches Shake. However, you can right-click the Shake icon to obtain the Show Package Contents menu option. Select Show Package Contents in the context menu to continue to open sub-directories. In the command line, cd down inside of shake.app to shake.app/Contents/MacOS/ to find the actually binary to be launched in the Terminal.

Note: This guide distinguishes between behavior found in Shake and Shake in the Tremor-style interface.

In this tutorial, composite four rendered images over a gradation. The elements are from a swell animation called Vanilla Pudding, a project from Wild Brain in San Francisco. These guys are great, not least because they were kind enough to pass on footage for this tutorial, but also because they like to mix 3D and 2D animation. So extend a laurel and hardy handshake to Karen Ansel and Nicolas Weigel. Backslapping aside, this version pales in comparison to the actual Wild Brain Vanilla Pudding shot (oops, more backslapping). The project has been trimmed down in complexity so you do not have to download an inordinate amount of footage.

For those of you into narrative motivation, Vanilla, our cubically cranial gal, does not take to kindly to some other kids that have torn the wings off a butterfly. In the shot prior to this scene, Vanilla pulls the gun out of her nethers. Here, she takes aim with aforementioned gun and fires. The missile, by the way, is a miniature hippopotamus that drools.

Frame 1
Frame 28
Frame 56

Launching Shake

To launch Shake, do one of the following:

The second command (shake GUI 1) launches Shake in the Tremor-style interface.

Note: The Tremor-style is not available for Mac OS X.

What is the difference between the two styles? The classic Shake is a little friendlier for doing expressions, Tremor-style is a little friendlier for doing basic work.

Shake style:

When using Shake in the Tremor-style, set your monitor to a minimum 1600-pixel width.

Tremor Style:

The two interfaces run the same in terms of button behavior, but have a slightly different layout:

  1. Viewers. Used to view images. Shake creates as many floating viewers as you want. Tremor-style has up to 4 docked viewers.
  2. Node View. The area you build your compositing tree. Both allow you to open the Node View in other panes, however.
  3. Node Tabs. Nodes (functions modifying images) are created from here. Tremor-style allows you to put up favorite functions.
  4. Parameters. Your nodes are tuned here. The Tremor-style gives you plenty of space to tune your parameters. Shake has each parameter listed out in a scrolling window.

In addition, the Shake window can be resized. Tremor-style fills the entire screen.

Contextual Help

Since this may be as much as you ever read in the documentation, here is the most important part: As you pass the cursor over buttons,a brief message appears that states its function, as well as the relative hot key. In Shake, this help window is the right text window at the bottom of the interface. In the Tremor-style, it is in the Expression Box just above the center Function Bar on the left side.

Help in Shake style:

Help in Tremor Style:

Click the right mouse (right-click) button to view contextual menu functions. For example, right-click the Viewer Channel button, and the menu appears. The letters are the hot keys for each choice. Therefore, the right mouse button can also be considered as contextual help.

One more tricky bit about some of the buttons: Some have different behaviors between clicking and holding. For example, clicking the Viewer Channel button in the Viewer toggles between the RGB and the Alpha View states. Holding the mouse on the Viewer Channel button gives additional choices.


click hold down

 

Overriding the default button choices. To override the default choices, press Ctrl+hold and select your next option. For example, the default button behavior for View RGBA Channels button is to toggle between RGB View and Alpha View. To modify the behavior to toggle from RGB View to Red View, then to Alpha View and back to RGB View, perform the following steps:

  • Ensure the View RGBA Channels button is on RGB View.

  • Ctrl+hold the button, select the Red View button and release the mouse.

  • Ctrl+hold on Alpha and release the mouse. Because Alpha View already toggles to RGB View, you do not have to specify this behavior.

  • Select Save Interface Settings from the File menu to save this behavior.


Loading Images

Every image process in Shake is done by creating a node and linking it in the Node View. The nodes are found in the Node Tabs (Image, Color, Filter, etc.).

Do not confuse this node with the Load and Save buttons at the top of the software — these are for loading and saving scripts.

Browsing Tips

  • Use the Up Directory button (or press Backspace) to browse up one level.

  • Double-click a directory to go down one level.

  • After clicking in the file list area, press the Up and Down Arrow keys to scroll up or down, or type the first letter of the file you want.

  • Middle-mouse or Alt+left mouse to scroll the window—you do not have to use the scroll bar on the right.

  • The tutorial directories are stored in the Directories pull-down menu, as well as recently visited directories and favorite project directories:



If you double-clicked before reaching the vanilla images, click on the Image - FileIn node to launch the browser.

Looking at Images, Parameters, and Channels

Four nodes appear in the Node View. Each node is a function that can be viewed or modified. In this exercise, all of these are FileIn nodes that load images.

You might note the pretty thumbnails. As you can see from the mid, vanilla, and hill images in the above illustration, the thumbnails also indicate transparency if there is an accompanying alpha channel. The smoke element is blank because frame 1 is black.

Here's a swell trick to impress your date with next Saturday: Drag the vanilla node over the mid node in the Node Tree—it does a mini-composite for you. Does this help you composite or change your tree at all? Nope, but it's cool, innit?

To do an actual composite, you must connect the nodes. This happens in a moment, so stop fidgeting and pulling the hair of the girl in front of you.

A bit about thumbnails:

  • The thumbnails represent the frame at the time of file loading.

  • To refresh to the current frame, select the node and press R with the cursor in the Node View.

  • To view the alpha channel, place the cursor over the thumbnail and press A. To return to RGB, place the cursor over the thumbnail and press C.

  • Any node can have a thumbnail— select the node and press R.

    Note: The thumbnails do not dynamically update (see below).

  • To hide thumbnails, select the nodes and press T. Press T again to enable the thumbnails.

  • Under the Globals tab are additional controls for the thumbnails. They do snazzy things, no doubt, but if you want to know more about these earth-shattering functions, jump to Interface - Node View.

Go ahead, ask the question. It's obvious you want to ask it..."Why aren't the thumbnails always updating?" Shake doesn't dynamically update thumbnails because it is either inefficient or inaccurate. Suppose you are working on 6K plates—do you really want to spend all of your time resizing 6K plates down to tiny icons? That's rhetorical, by the way. As another example, imagine a script of 900 nodes—the drag on the script would be phenomenal. The most efficient and accurate way to check a node is to load the node into the Viewer.

This nicely brings you to the next subject, loading and viewing nodes.

Viewing a node or loading its parameters:

In the above illustration, the vanilla image is the currently viewed node, as indicated by the little light on the left side. The 1A indicates it is in Viewer 1, buffer A. The tiny text field on the right side indicates the vanilla parameters are also loaded. OK, true, there is only the one node in the illustration. Just try to get past that.

Use the help window to get information on nodes. As you pass the cursor over a node (no need to click), the resolution, bit depth, node name and type, and channels are displayed. For example, you can see that the vanilla image is a FileIn node named vanilla, is 8-bit, has RGBA channels, and is 720x540 pixels:

Look at the different channels in the Viewer by toggling the View Channels button . For example, toggling it to the Alpha channel to view the alpha.

However, nobody actually uses that button. Remember when you pressed the right mouse on the View Channels button, and it listed the hot keys? Use the hot keys instead when the cursor is over the Viewer to quickly look at a channel. All the cool kids in the back row are doing it.

Setting the Frame Range and Playing Sequences

There are two places to set the frame range in Shake.

The first and most important is in the Globals tab. The Globals tab lists all script settings—the frame range, proxy settings, default resolutions, GUI settings, and quality settings. The normal Parameters tab is a listing of parameters for a specific node.

There are three ways to jump to the Globals tab:

The first parameter in the Globals tab is the timeRange parameter. This frame range determines what frames are rendered. Although it is saved in the script, you can override it in the command line. Press the Auto button to examine the FileIns and determine the range automatically.

To enter the time range:

The timeRange parameter is extremely flexible and can be manually edited:

entry calculates
1-56 Frames 1 to 56
20-30 11 images from frames 20 to 30
1-56x3 Frames 1, 4, 7, etc.
1,10,20-30x2 Frames 1, 10, 20, 22, 24, 26, 28, and 30

Click the flipbook button to launch a flipbook render of any node. This launches a render into a floating window. (If you are testing a FileOut node, the actual FileOut is not executed. To render, use the Render command—either right mouse in the Node View, or use the Render menu). Otherwise, the sequence is rendered into memory and you can play it back. A few play controls for the flipbook:

entry calculates
. (Think of this as the > key) Play forward
, (Think of this as the < key) Play backward
R, G, B, A, C Show the red, green, blue, alpha, and color channels
Shift+left mouse drag Scrub through the animation
Esc Close the window

 

For more flipbook controls, see Interface - Flipbook.

Once the flipbook is gone, you lose all links to it, so you cannot save the images or use the images again. You can have as many flipbooks as memory allows. You can stow the flipbooks and retrieve them later, but they take up memory.

The second way to indicate a frame range and get playback is with the Time Bar. This displays the range that you want to concentrate on, and does not get saved into the script.

To set the playback range for the Time Bar:

Basic Compositing

Each of these elements has an alpha channel that makes the images ready (and easy) to composite.

The Layer node has two inputs, called knots, on the top of the node. The smoke node is attached to the first knot.

Information flows downward in the Node View—the image information is passed from the smoke and vanilla nodes, and fed into the Layer1 node to perform the composite:

smoke vanilla Layer1

The operation parameter is listed in the Layer1 parameters. Over is the most frequently used operation, and assumes an alpha channel exists in the first image input. You can select a different compositing mode with the pull-down menu, but for this composite, stick with Over.

The node compositing logic is similar to language: "Input 1 is Over Input 2." Therefore, the inputs are switched, the compositing order is reversed.

 

The node logic is switched—smoke is over vanilla, and vanilla is over smoke:

This is bad.

To break a connection, place the cursor over the the noodle and when the noodle turns red, press Delete. You can also Ctrl+click the noodle.

 

 

The result composite appears.

Windowing

Shake has several windowing conventions:

Function Hot key Notes
Expand a window full screen Space Bar Press the Space Bar again to zoom back to normal.
Pan a window Middle mouse or Alt+left mouse Works in all windows, including the Browser and the Tremor Function Bar.
Zoom a window Ctrl+middle mouse or Ctrl+Alt+left mouse Works in the Node View, the Viewer, the Time Bar, and the Curve Editor.
Zoom in on a Viewer +/- (by the Backspace key) Gives you an integer-based zoom so you have fewer round-off artifacts on your display. The zoom follows the cursor.
Reset a View Home Works on the Node View, the Viewer, the Time Bar, and the Time View.
Resize a pane   Grab a border between two panes to resize.
Select a tab Tab In Tremor-style only. Hold down the tab key and drag the cursor left and right and the tab column it is over is selected.

Setting Resolution

Shake is not only resolution independent, but can also dynamically change resolution during the compositing process. For example, you can simultaneously output a HD image and 601 video image. Won't that impress the family on your next holiday visit?

There are three ways to set your composite resolution:

In this example, use the first technique and composite elements over an image of the desired resolution.

Every Layer operation (that is, every node in the Layer tab, not just the Layer node itself) can select the output resolution.

Create a sky element for the background with a radial gradation that is generated by an Image - RGrad node. Nodes that generate images, such as Image - RGrad, Ramp, ColorWheel, and RotoShape have associated width and height parameters.

Notice that the RGrad1 width and height are set to 720x486, and Layer3 has a height of 540 pixels. To match the height of RGrad1 to the height of Layer3, you have several options:

This is fine and dandy, but what about the next time you create an Image node? You don't necessarily want to manually change a node each time it is created. Therefore, Shake has a default width and height, found under the swell format pop-up menu in the Globals tab. You can select from presets (Cinemascope, Academy, different flavors of NTSC, PAL, HD), or open the sub-tree to set your own.

Setting the defaultWidth and defaultHeight in the Globals tab is the best solution, as it is very rare to have a 7-node composite. A normal composite typically requires multiple RGrads, RotoShapes, and QuickPaint nodes to help with masking.

Changing defaultHeight does not change the height of the current RGrad, but next time you create an RGrad, it automatically takes the defaultHeight.

Next, reset the parameters for the RGrad, and update defaultHeight.

For more information on resolution, check Overview - Resolution.

Tuning Parameters

This section discusses the different ways to tune the parameters of a node. Nodes can have text fields for numerical entry, widgets to help you select color, or onscreen controls for interactive placement. RGrad has all three parameters. The fine glowing ball in the background does not really convey a feeling of the sky on a nice, warm, non-compositing work day, so modify RGrad1 in the the following steps.


Controls for the onscreen controls are on the Viewer bottom. A few helpful buttons:

Autokey When enabled (green), a keyframe is created for parameters linked to onscreen controls. You do not need it in this exercise.
Delete Key In case you enabled Autokey, there is also Delete Key. Go to the frame that has the keyframe you want to delete, and blow it away into oblivion.
OSC Color Sets the color for the onscreen controls.
OSC Display Toggle Onscreen controls are always displayed.
OSC Display Toggle Onscreen controls are invisible when moved.
OSC Display Toggle Onscreen controls are turned off. Hold down the onscreen control visibility button to access this option.

Notice as you modify the parameters, the parameters adjust to return the numerical data.

You can modify the text fields in several ways.

Classic Shake interface:

Drag the slider to modify the value.

Click once to select the text field.

Double-click for a type insertion point.

Ctrl-drag in the text field to activate the virtual sliders. This gives you more precision and the ability to go beyond the slider limits.
Shift, Ctrl, or Alt+left and right arrow. Place the cursor over the text field and hold down Shift, Ctrl or Alt and tap the left and right arrow keys. This raises or lowers the number. Shift+arrow is 10x the normal increment, Ctrl is the normal increment, and Alt is .1x the normal increment.

 

Stylus Users: If you are using a stylus, go to the Globals and enable virtualSliderMode. This assists you with the virtual slider. You should also assign one of the stylus buttons to be the right mouse.

 

Tremor-style interface:

Drag in the text field to modify the number. The green bar displays an approximate position of the number in its expected range.
Ctrl+drag in the text field for more precision.
Double-click to type in a number.
Shift, Ctrl, or Alt+left and right arrow. Place the cursor over the text field and hold down Shift, Ctrl or Alt and the tap the left or right arrow keys to raise or lower the number. Shift+arrow is 10 x the normal increment, Ctrl is the normal increment, and Alt is .1x of the normal increment.
Drag below the text field to access the mini-slider. This allows you to quickly jump to the minimum and maximum values.

 

Animation of parameters is explained in the next tutorial.

RGrad has two Color Picker buttons—one button to control the center color of the RGrad, and one button to control outside the center of the RGrad. (What does one call that, anyway? Perhaps The-Outside-The-Center-Part.)

With the Color Pickers, you can edit color in several ways:

To use the virtual color pickers, hold down the key on the keyboard that corresponds to the channel you want to modify and drag the cursor left and right anywhere on that row. You can select:

(R)ed, (G)reen, (B)lue, (O)ffset, (H)ue, (S)aturation, (V)alue, (L)uminance, (C)yan, (M)agenta, (T)emperature

With this mechanism, you can effectively gang all three channels by holding the O (offset) key down and sliding left and right. (That's more fun than feeding peanut butter to a dog.)

With these powerful world-conquering skills, your result is similar to the following illustration.

Transforming Images

Those of you who were the type to sit in the front row of school and give apples to the teacher (and no doubt incur a great deal of nasty comments from the back of the class, and also probably got beat up a lot) may have noticed that the hill element, being a smaller image resolution than mid, is tucked behind the mid element. As always, there are several ways to correct this problem. One way is to use the Move3D to transform it.

To transform the hill image:

To reset a node: Right-click in the Parameters area and select Reset All Values.

Due to Shake's tricky Infinite Workspace there is never any clipping of an image if it goes out of frame—you can always retrieve it later. You can view Layer4 to confirm the entire hill image is still there.

The Infinite Workspace is your best friend. For more information on how good a friend it is, check out Overview - The Infinite Workspace.

Fading an Element

The final step in this exercise (before rendering the animation) is to fade the smoke.

As demonstrated in this tutorial, everything in Shake is done with a node.

Rendering a Sequence to Disk or Tape

If you are still awake, render the image sequence after you save this soul-shattering vision of humanity's existence.

To save the script:

To render files to disk:


In the Render Parameters, you can enter a new time range, proxy scale, quality level, motion blur and number of CPUs to use for the render. The first line asks you if you want to render all FileOut nodes, or just the active ones. You can also select the FileOut node after you have opened the window.

Batch Rendering in a Shell

You can choose to render on the command line. Click the Save button at the top of the interface to save the script. If you haven't saved yet, it prompts you for a script name, otherwise it writes over what you had before. (Ctrl+Shift+S is Save As.)

shake -exec vanilla_test.shk -v

The -v means "verbose," so it tells you the render status. For more information on the command line, see the Command line docs.

To override the time range, use the -t option:

shake -exec vanilla_test.shk -v -t 10-20

or

shake -exec vanilla_test.shk -v -t 1-56x2

The above command renders every other frame.

Well, that was Tedious

If you ever see the comment, "Congratulations, you just completed your first lesson of product X" in a tutorial, run screaming out of the building immediately. Steal donuts on your way out and have a tasty snack.