Embedded Files
Cinematic Character Placements
Cinematic Character Placements
In cinematic, the full bodies of characters are on display. This is great for achieving a more interactive experience between characters, but how do we place them? The way we place characters on the screen is important for making our stories immersive and look realistic. There are two ways to place characters on the screen: screen placement and spot placement. Of the two, screen placement is simple and automatic, while spot placement is more detailed and precise.
Screen Placement
Screen Placement
When using screen placement for characters, we can place them on the left, center, or right side of the screen. This placement is automatic and is always the same place. For example, let's take this scene and its code from our last lesson:
In the highlighted line, we see the code:
@YOU enters from left to screen center AND YOU does it while walk_flashlight_scared_loop
Let's focus on the:
@YOU enters from left to screen center
This is indicating that our character will enter the screen from the left side of the screen and will walk and stop at the center of the screen. We can use "right", "center", and "left" placements interchangeably to get our character in our desired places.
If we wanted our character to just be standing somewhere automatically, we can use:
@YOU stands screen right
Using screen placement is a great way to start writing cinematic character placement code. It helps you become familiar and comfortable with organizing and placing character on the screen in the way that you want. Once you're ready to get a bit more detailed with your placements, or want certain placements for certain scenes (ex. you want your character sitting on a couch in the scene), you may use spot placement.
Spot Placement
Spot Placement
Spot placement is more advanced than screen placement and allows more control in where your characters are placed. Instead of using "right", "center", and "left" to indicate where you character will be, we use numbers to place exactly where our character will be. Take a look at this code:
In the highlighted line, we see the code:
@YOU spot 0.948 -111 191 in zone 1 THEN YOU walks to spot 0.948 98 202 in zone 1 in 1 AND YOU does it while walk_flashlight_scared_loop
First, let's focus on the:
@YOU spot 0.948 -111 191 in zone 1
This code is what places the character in her initial spot, off-screen to the left, before she walks in from that place into the screen. The code that gets her from that left, off-screen placement to the left side of our screen is:
THEN YOU walks to spot 0.948 98 202 in zone 1 in 1
Note: the "in 1" at the end of this code indicates that it will take one second for our character to walk to this spot
Let's break this down even further. Remember when we said that spot placement uses numbers to place a character instead of "left", "right", or "center"? Those are the numbers we are seeing in that code after the word "spot". Now, what do these numbers mean and how do we find them?
Spot Placement Breakdown
Spot Placement Breakdown
The first part of our spot placement code is the size of the character. The greater the number, the larger the character!
The second part and third part are the x and y-placements of our character. Think back to a graph's x and y-axis. The x-axis moves horizontally left to right, while the y-axis moves vertically bottom to top. These placements tell us how much to the left, right, top, or bottom, our character is.
The last part which is not always needed is the zone. Being specific to the zone is important mainly when you are having characters moving across different zones.
Now, is there an easy way to spot place our characters? Yep! Using the web previewer or our mobile previewer allows us to use built in helpers to find our spot placement code.
Click Show Helpers > Spot Directing to display all of the spot placement helpers. Here, we can change things such as the scaling, positioning, and layering of our characters.
After entering the Spot Directing helpers, if you're on web previewer, the box under the previewer and sound volume will tell you what spot the selected character is in. If you're using your mobile previewer, the spot placements will be on the bottom left side of the screen.
Watch the gif to the left and watch the spot placement numbers change as we move the character around!
Have feedback about this lesson? Let us know here!
Page updated
Report abuse