By the end of this article, we will have created a static text-based lower third that can be saved, shared between projects or across devices, and reused freely.

Note that this will be updated with video and images when possible.

This is part one of a two part series on making animated lower thirds. See part two below.

Animate a Lower Third in Alight Motion: https://support.alightcreative.com/hc/en-us/articles/360028806451

Downloads

If you’d like to follow along, you should have Alight Motion and all seminar assets on your device before starting.

Font: https://www.dafont.com/bebas-kai.font

If you’d rather follow along with a finished element, import the project into Alight Motion with the link below. Note that this element also contains graphics and animation from part two.

Completed Element Link: http://alight.link/Befx5uvPReKTyHGt7

Creating an Element

In Alight Motion, an element is a reusable piece of content, often called a symbol, preset, or template in other applications. To create an element in Alight Motion, swipe right to My Elements, then tap + at the bottom right side of the screen. We’re going to choose a 16:9 aspect ratio and leave the rest as is. Tap Create to see your new blank element.

Tap Settings at the top of the screen. We’re going to change the Embedded FPS to Host Project and leave everything else the same. By changing this setting, the element will change its frame rate to match that of any project where it is used.

Using Text and Text Layers

Alight Motion gives you the ability to create dynamic text that can be fully animated. Let’s add a text layer. Tap +, then tap Text. This will display the text interface. Use the keyboard to enter some placeholder text. We can change this text at any time. For now, let’s just call this Lower Third Placeholder.

Across the top we can see options for justification, font selection, font size selection, and font color. We’re going to leave the justification on left. We’ll leave the font as it is for now, but we will change the font size to 40pt, and we’ll change the color to black or dark grey. Next, we’ll move the text to the bottom left corner and press Confirm at the top right to leave the text menu. We now have some text on screen.

Importing Your Own Fonts
Although Alight Motion provides a variety of fonts to download from within the app, you may want to import your own fonts to create consistent branding or your own custom look.

To get started, let’s tap on the text layer, and then tap Edit Text from the Editing Panel. This will bring us back to the text editing interface. If we tap on the font name at the top of the screen, we will see a selection of recently used fonts. Let’s tap View All Fonts underneath. A list of fonts will appear. Tap the side menu, then tap Import Fonts to see a list of all fonts on your device. Note that to be visible to Alight Motion, fonts must be in a compatible format, stored directly on your device, and unzipped if downloaded in a zip file.

Tap the font you’d like to import and then tap Import. If there were no issues, the font will be accessible by Alight Motion through the View All Fonts list.

Please note that when searching for a font, the search is constrained by the font style selections made in the font options menu. If your font does not match your selections, it will not appear in the list.

Tap on the font you’ve imported to use it. You can see that our font has been applied to our text.

Creating Custom Graphics

In the previous article, we made a lower third without any graphics. That’s a little plain, so let’s make some simple custom graphics, which is pretty easy to do in Alight Motion. Tap +, then tap Shape. Choose the rectangle. Let’s tap Color & Fill and change the rectangle to white which will look nice against the dark text.

If your text has been covered by the box, tap and hold the hamburger icon on the right side of the screen on the title layer, and then drag the text layer on top of the rectangle layer. The text should now be visible on top of the rectangle.

Let’s skew the rectangle to make the background look more dynamic. Tap the rectangle, then tap Move & Transform. Tap skew, and adjust the x-skew until you get a pleasing parallelogram. Let’s add a dark thin rectangle the same color as the font underneath and x-skew it as well. We can do this by either creating a new rectangle or duplicating the white one and altering it. This will make the lower third more defined.

Using Elements

Of course, what good is having an animation if you can’t use it again and again? Let’s make a project and show how your element can be reused.

Exit your element, then swipe left to Projects, and tap +. Let’s create a new 16:9 project to house the 16:9 element we just made. Tap +, then Elements. Tap the element you just created to select it and place it into the project. The element can be manipulated as normal.

To edit the placeholder text, tap the element layer, then tap Element Properties. Any text placed in the textbox on this screen will override the placeholder text.

Sharing Elements

Like any project in Alight Motion, elements can also be shared easily with other users. Open your new element from the My Elements page, and tap Export. Several objects will be presented, but to export your graphics in an editable format, select Project Package. Note that this option is only available to paid users of the app. The element will upload, and you’ll be presented with an Alight Link, which, when tapped on a device with Alight Motion, will automatically open Alight Motion and provide an import prompt. Users with the link, upon successful import, will now have access to this element, ensuring consistency across users.