LiveType Tutorial using Animated Mask

Turn on Character Map
First, make sure you have the character map turned on in the OS X preferences. Look in the upper right corner of the OS X finder window and look for a small flag that represents your country’s character map. If it is not there you need to turn it on in your OS X system preferences.

Navigate to your System Preferences, and click on the International flag icon.

You should now see your country's flag in the upper right corner of the OS X finder. Clicking on your country's flag will automatically bring up the character map.

Go ahead and launch the Livetype Application.

The inspector window is a place where you can type LiveType characters. Click inside the inspector window. Make sure you have a blinking text cursor within the inspector window text input box.

Open the character map, by clicking on your country's flag in the upper right corner of the OS X finder. The character palette box should appear.

Choose the roman font set. Then click on the miscellaneous category and find a small black square.

Click the insert button 4 times to place for small squares into the text area of the inspector window.

Make sure the four squares are center justified, by clicking on the center justification button. Then add two more rows with four squares on each row.

If you look at your Canvas window, you should now have 3 rows of squares that are spaced apart.

IMPORTANT: Make sure that none of the squares are selected. If you are not sure, use the keyboard shortcut command Apple + D to deselect everything.

The trick is to use the tracking and leading sliders to adjust the squares so they are perfectly touching each other.

Keep adjusting the sliders until the 12 small squares form one large square.

You may need to manually adjust each value by clicking in the numeric areas, because the sliders may not give you the exact values needed.

After you've adjusted the tracking and leading parameters, use the size parameter to zoom into your object until it fills the screen. I've selected all the squares, so you can see what I am talking about.

IMPORTANT: If you've selected any of the squares to make sure everything lines up, make sure you DE-SELECT them when you are finished before moving onto the next step.

Next, you need to adjust the viewable size of the Canvas window to 50%. This will allow you to see outside the viewable picture area.

Next, navigate to the track menu at the top of the screen and select add new effect. Or, you can use the keyboard shortcut (Apple + E).

You should now see a purple track underneath your yellow text track. Inside the purple track you will see two small triangles. These triangles represent keyframes. You will always have at least two keyframes per effects track. Make sure your indicator is positioned on first keyframe inside the purple effects track before moving onto the next step.

Next, select the first square, and drag it off the screen area. In this example, I am dragging it to the upper left corner of the Canvas window.

You will notice that all the other squares should move together. For an added effect, go ahead and rotate the square around a couple times by positioning your cursor in the upper right corner of the square and thereby rotating it around.

All the other squares should follow the same exact action as the first square.

IMPORTANT: Make sure your position indicator is still parked on the first keyframe within the purple effects track.

To get the squares so they move into place on at a time, you need to adjust the sequence timing. Navigate to the Inspector window, and click on the timing tab. Adjust the sequence timing to 8%.

You will also want the squares to fade in one at a time as they fall into place. To do this, click on the attributes tab, and slide the opacity slider to 0%.

Now, each of the squares should fade in one at a time with a certain amount of timing between them.

The next step is to matte all of the squares to a background video. Navigate to the Media Browser window and find a texture that you would like to use. In a strange sort of way, you will be using this texture to hide the REAL background layer that we will add later.

Find a texture that you want to use, and click the Apply to New Track button.

You should now have a textured background layer. In this example, I've chosen a blue Acrylic background. You should see a background dividing bar that tells LiveType that a particular track is a background. I’ve highlighted the area in red to illustrate the background divider.

Now, you need to move the texture up a layer so it becomes a standard track layer. To do this, click on the background layer and carefully move it up one track. It should now be above the background divider bar.

The video that is going to be playing inside the squares needs to be placed as your REAL background layer.

Navigate to the File menu and select Place Background Movie. Find a full resolution movie and place it as your background

Please make sure your timeline looks similar to this before moving onto the next step.

IMPORTANT: Do not adjust track size of your layers to match the distance of your other tracks. Doing slow will simply speed up or slow down your background animation. If you need additional background media, you should use the loop control slider located in the timing tab.

Next, select all of the squares. You can use the keyboard shortcut (Apple + A) to select them all. Navigate to the Inspector window and click on the Attributes tab. Set the Matte to: option to Background.

This will allow the white squares to cut through the textured layer into the new background layer. You should now see your background movie inside each of the squares.

For added effect, you may want to add a black edge to help separate the squares for a video wall effect. To do this, click on the yellow track labeled 01. Then navigate back to the Inspector Window and click on the style tab. Then click on the Outline tab. Go ahead and enable the outline parameter. Then give your squares a black outline.

This will help separate the squares which helps add to the overall effect. As an optional step, you might want to the square to fall into place randomly.

To randomize how each square falls into place, click on the purple effects track underneath track 01. Navigate back to the Inspector window and click on the Timing tab. Within the timing tab, you will see a random slider. Drag the random slider to a value of around 15. This should produce sufficient randomness.

If you are not happy with how the squares fall into place, you can type in a different seed. You can have up to 255 different seeds. Try different numbers until you get a randomized pattern that you like.