Skip to main content
Version: 4.0.0

Countdown

Count down to your special moment with the Countdown template! Use visual scripting and Text objects to customize your own countdown banner.

countdown demo

Open the Template

To use this template in your Effect House project:

  1. Go to Templates
  2. Click the Interactive tab
  3. Select the Countdown template
open template

Hierarchy

In the Hierarchy panel, there are three main render groups:

  • Tip contains helpful hints to personalize the countdown banner
  • 2D Foreground Effects renders the countdown designs
  • General renders the text in the countdown banner
hierarchy

Customize the Countdown Design

There are two banners used in this countdown effect: Countdown Counting for when the countdown is happening and Countdown Finished for when the countdown is complete.

tip

You can import your own design, or use Asset Library to generate your desired look.

To swap out the countdown banner design:

  1. Go to the Hierarchy panel
  2. Select a countdown image: Countdown Counting or Countdown Finished
countdown image
  1. Go to the Inspector panel and locate the Image component
  2. Click the Texture field
image component
  1. Select a texture (you can import one or use a provided one, like StyleBCountingBackground_Tex)
texture style b
  1. Click OK. The countdown design changes!
countdown design

To change the countdown prompt:

  1. Go to the Inspector panel
  2. Click the Countdown Prompt text object
countdown prompt
  1. Go to the Inspector panel and locate the Text component
  2. Select the Text field and enter your prompt!
text property

Visual Scripting

In the Visual Scripting panel, you can define the target date and time with the Countdown Controller subgraph. It then computes the time left and displays it in the countdown banner.

visual scripting
  • Target Year is the desired year
  • Target Month is the desired month, with 1 being January, 2 being February, 3 being March, and so on
  • Target Day is the desired date of the specified month
  • Target Hour is the desired hour in military time, with 0 being 12 am, 1 being 1 am, and so on
  • Target Minute is the desired minute of the specified hour
  • Target Second is the desired second in the specified minute and hour

For example, if you want to define a countdown for New Year's Day 2025, your properties should be as follows:

  • Target Year: 2025.00
  • Target Month: 1.00
  • Target Day: 1.00
  • Target Hour: 0.00
  • Target Minute: 0.00
  • Target Second: 0.00