Update variables in graphics

Designs in Titler Pro's library and custom designs you may create include variables for common elements which allow you to create unique graphics based on the same design. Variables include text such as names and subtitles, as well as styles that affect a design's look and feel such as colors, gradients, images, and videos.

  1. Open a graphic in Titler Pro.

    Tip: For details about using Titler Pro with a video editor, see one of the articles in the Add graphics to projects in your video editor section of our help center.

    The Attributes panel > Scene > Variables tab opens and includes all variables that are available for the graphic. For example, the following illustration includes variables for an image, two paragraphs of text, and a color.

    variable-attributes.png

  2. If you want to manually update the default values in variables or connect a camera to a live video variable, see the following sections in this article. When you change a variable's default setting, the graphic starts rendering and displays the change when it is fully rendered.

    Note: You can change the names of variables when you create variables; therefore, the names of variables in your designs may be different from the names shown in this article's illustrations.

Text such as names and subtitles

Enter new text in a text field, such as Name or Subtitle, then press TAB or ENTER to update the graphic.

Back to list of variables

Colors

Click a color swatch and complete any of the following steps to select a color in the Pick Color dialog.

  • Click a color on the wheel.
  • Click Hex or Dec, then enter the desired Hex or Dec values.
  • Click the color picker btn-color-picker.png, then click a color on your screen. (Press ESC to cancel the color picker.)
  • Click and drag the horizontal sliders to adjust the selected color's hue and opacity.

Back to list of variables

Gradients

Use the Gradient style to customize text or objects with gradients based on multiple colors.

  1. Click the color swatch.
  2. In the Color section of the Pick Color dialog, complete any of the following steps to select a color.
    • Click a color on the wheel.
    • Click Hex or Dec, then enter the desired Hex or Dec values.
    • Click the color picker btn-color-picker-gradient.png, then click a color on your screen. (Press ESC to cancel the color picker.)
    • Click and drag the horizontal sliders to adjust the selected color's hue and opacity.
  3. In the Gradient section, select the number of colors to include in the gradient and the type of gradient from the two drop-down lists.

    style-pick-color.png

  4. In the gradient color wheel, click and drag each large circle to adjust the gradient's color range, then click and drag the small circles to adjust the transition point between colors.

Back to list of variables

Images and pre-recorded videos

To replace a default image or video, click an image or video thumbnail, then locate and select a new image or video.

variable-image.png

To customize how an image or video fits within the available space for that object, select one of the following fit modes from the Set To... drop-down list next to an image or video variable.

  • Set To Fill: The image or video fills all of the available space in the bounding box's dimensions while maintaining its proportions.
  • Set To Fit: The image or video fits inside the object's bounding box without cropping and retains its aspect ratio, which means the image may not fill the entire variable area.
  • Set To Conform: The entire image or video resizes to fit in the entire variable area, but may not maintain its aspect ratio.

Back to list of variables

Live videos

You can stream video from a webcam or NDI-enabled camera.

  1. Connect a webcam or NDI-enabled camera to your computer.

    If only one video source is connected to your computer, the source appears in the field.

  2. If more than one video source is connected to your computer, select a video source from the video drop-down list.

    variable-live-video.png

Note: If the object's dimensions don't match the aspect ratio of the video source, the live video will be resized to fit within the object, which may distort the video. If necessary, resize the object in the workspace.

Back to list of variables

Data graphs

Use data graph variables with text or shape objects to show a percentage or change the size of a shape based on data you enter.

To update the value of a data graph variable, enter a number between 1 and 100, which will be represented as a percentage.

variable-data-graph.png

Back to list of variables

Was this article helpful?
0 out of 0 found this helpful
Have more questions? Submit a request