SignAgent Working with TemplatesUsing Sliding in Templates

Using Sliding in Templates

Sliiiide to the left!
Sliiiide to the right!

This tutorial will teach you how to have contents of your sign artwork change position based on other items in your template.

So, this could be used to have a symbol always appear just to the right of a line of text, with its position sliding based on the length of the text.
Or, it could be used to have braille slide up or down depending on whether the above text is one or two lines.

Note that this is an advanced templating technique within SignAgent.

Example 1: Sliding Symbol

For the first example, we will have a symbol that always appears just to the right of a line of text, with its position sliding based on the length of the text.

Note that this example uses repeating messages, so if you're not familiar with how those work, check out this article first: Create Simple Wall Directional (Repeating Messages)

1. Create Template (in Illustrator)

There are 2 aspects to add for a successful slide:

  1. Add "slide_left", "slide_right", or "slide_up" (In this example, we're using "slide_left", so that the symbol will slide left)
  2. Add a spacer. The spacer should be a rectangle that represents the desired space between the edge of the first object and the edge of the sliding object.

IMPORTANT NOTE! SignAgent templates will render elements from top to bottom, and left to right.

So, when you're ordering your layers in your template, they should be ordered from top to bottom, and left to right. This is mainly important when sliding elements will interact with each other.

In other words, So "slide_left" and "slide_up" will slide to the element directly above it in the order, and "slide_right" will slide to the element directly below it in the order

ANOTHER IMPORTANT NOTE! If, when everything is rendered, two elements are overlapping, the slide will not function as expected. So, make sure that the starting position of your sliding element does not overlap with the largest or longest instance of the element it is sliding to.

2. Result

As you can see, the symbol's position now adjusts according to the length of each row of text.

Example 2: Sliding Occupant Title

In this example, an occupant title will slide up or down depending on whether the above text is one or two lines.

1. Create Template (in Illustrator)

Note that in this example, there is no spacer. If you opt not to include a spacer when sliding, then your sliding object will go right to the edge of your first object.

Sliding with no spacer can work with text, but doesn't usually work as well with visuals

2. Result

You can see in the above example, that "President" has slid up to the appropriate space below "David Jorritsma"

However, with a longer message, the occupant title remains in place, to leave room for the extra content.

0 Comments

Add your comment

E-Mail me when someone replies to this comment