1. Game Development
  2. Game Design
Gamedevelopment

Level Design: Views and Vistas

by
Length:LongLanguages:

As level designers, it is often our job to convey a wealth of information to players for a lot of reasons. Sometimes we want to show off the cool art in our level. Sometimes we want to direct players to their goals, explore the game's story or theme, or build and release tension. Before we can do any of this, though, we must first know how to direct players' attention towards where we want it to go.

The planet Gaspar from Ratchet  Clank
The planet Gaspar, from Ratchet & Clank.

There are many methods designers use to get players' attention. Some games don't mind taking control away from the player, and so use cut-scenes (or camera fly-throughs) to direct players' attention to all the cool things the designer wants them to see. Other games, to give the players more control, implement a "look at the cool stuff" button to show important things to players.

This article, though, is about my favorite way to direct the players' attention: by deliberately designing your level to take advantage of what I call Views, and their close cousins, Vistas

I like to use all the other methods too (usually layered together), but any design goal I can accomplish during the level design phase is a problem I won't have to solve later in development, when it's more likely to be solved with something more complex and requiring more work (like a cut-scene). 

What Are Views and Vistas?

View: An arrangement of the camera and level geometry to create a well-constructed view of something important in a level.

I'm referring to any place in a level that is set up to ensure players are looking at something important. More often than not, this takes the form of a more specific kind of View, a Vista.

Vista: A view, especially one through a long narrow avenue of trees or buildings. (via Dictionary.com)

Views and Vistas require thoughtful placement of landmarks and focal points and skilful framing of the game's camera, so games most often use these whenever they have an opportunity to control those variables. For example, at the beginning of a level (or any other time after a load) the designer has the opportunity to set these things up on frame 1, before the player takes control.

That's not the only way they're useful, however. Many games take advantage of pinch points, corridors, or other parts of a level that encourage the player to point the camera in a certain direction. For example, if the player is forced to walk through a door, the camera will likely be pointing through the door, so a Vista could be constructed on the other side of the door (since you'd know the most likely direction the camera would be pointed in).

Views and Vistas are really powerful tools, and especially so when used in conjunction with the other methods I mentioned earlier for getting players' attention (like cut-scenes).

Picture of one of the Taj Mahals many Vistas as seen through the long narrow corridor that approaches it
Picture of one of the Taj Mahal's many Vistas, as seen through the long narrow corridor that approaches it. (Diego Delso, Wikimedia Commons, License CC-BY-SA 3.0)

Why Would You Want to User a View?

1. To Show Off Your Game's Art

The most obvious benefit to a View or Vista is to show players the awesome art in your game, like in this screenshot from Middle Earth: Shadows of Mordor.

A checkpoint from Middle Earth Shadows of Mordor
A checkpoint from Middle Earth: Shadows of Mordor.

The above shot is taken at one of the game's checkpoints. The checkpoints are tall square towers with columns at each of the four corners. Through each pair of columns, the player can get good views of the game's very nice environments.

2. To Demonstrate Your Game's Hook

If your game has an interesting hook, either in your technology, art, or gameplay, Views and Vistas offer an opportunity to set those features up as a focal point.

The opening view of the first planet in Super Mario Galaxy
The opening view of the first planet in Super Mario Galaxy.

In Super Mario Galaxythis opening view of the first planet helps demonstrate non-flat gravity, which serves as the game's main hook. The camera is set up such that the planet's spherical horizon, and the objects that appear as the horizon changes, is a focal point.

3. To Direct Players to Content

This screenshot from Elder Scrolls: Oblivion is taken right outside the tutorial dungeon. This View is given to you; the camera is placed specifically at this angle. This kind of View is very common in Elder Scrolls games, since designers always know where the camera will be when you walk out a door.

The View from outside the tutorial dungeon in Elder Scrolls Oblivion
The View from outside the tutorial dungeon in Elder Scrolls: Oblivion.

Note how the dock in the water draws the eye to the ruins, which are not a mandatory part of the game—this is because Oblivion is trying to teach the player about their open world. They want to encourage exploration without forcing the player to do anything, and this kind of View is one tool they use to do this.

4. To Explore the Game's Theme or Story

This shot from Super Mario Galaxy has two purposes:

The introductory stage from Super Mario Galaxy
Notice how the pathway ahead creates a line that leads your eye towards the shooting stars. Remember this when we talk about using lines to direct attention later. 
  1. The Vista created by the two hills draws the player along the pathway, which goes to the next story point.
  2. The player sees that the sky is falling through the Vista—these falling stars are the main point of the game's story.
Half-Life 2 needs to tell you what's happened since the last game. The shot below is from very early in the game, when the player knows almost nothing.
An early point in Half-Life 2

The first level frequently gives you Vistas like this that frame video screens and NPC conversations. This gives the game an opportunity to tell you what's going on while they're pretty sure you're watching, while not taking control away from the player.

Note on Player-Controlled Cameras

The designer doesn't need complete control over the camera to present the player with good views. The View in the above Half-Life 2 screenshot is not forced—the player comes out of the train on the left and then turns 90 degrees to face this way—but since the player will have to walk down this narrow corridor between trains, the View is all but assured.

5. To Manage Tension and Intensity

As I mentioned before, the first level of Half-Life 2 is set up to convey a lot of information to players by using Views or Vistas to show video screens or NPC interactions. The video screens serve mainly to give the player an idea of what's going on; the NPC interactions, though, are mainly there to creep players out.

Take this switchpoint before a security checkpoint, as an example:

Security checkpoint in Half-Life 2
The arrangement of the fences into a switchback creates three Vistas, two of which the game uses to establish a pattern to make you comfortable. When it breaks the pattern on the third, it's jarring and a bit creepy.

As players walk down the first "corridor" made by the fences, the game can be reasonably sure they are looking straight ahead. When they get about halfway, a sequence begins where the player can watch one of the two civilians on the right proceed through the checkpoint with no fuss.

When players come back down the third corridor, the second civilian goes through the checkpoint, likewise with no fuss. The player sees both civilians exit through the door at the far end of this corridor.

When the player enters the checkpoint, the game breaks the pattern. The soldiers don't attack, but one instead steps in front of the doorway you saw the civilians enter. The soldiers motion you through another door to the left—one you couldn't see from the switchback. Breaking the pattern jars the players, and makes them wonder why they were shunted to the other door. Will there be a threat?

A Good Opening View is Crucial

The opening view in your level gives players their first impression of the level. As you can see from the advantages I listed above, this gives designers an amazing opportunity to make a good first impression.

The games I can most speak to on this count are the PlayStation 2 Ratchet & Clank games, which I worked on as a designer.

In the video below, you'll see the opening view of Metropolis, from the first Ratchet & Clank. This view is what you see after walking from your ship through a long tunnel that creates a Vista through which you can see bits of the View. Upon emerging into the area depicted in the video, the player gets access to the whole enchilada. 

One of our Level Design mandates in these games was the creation of a good opening view. Over time, we broke that down into three really big requirements for the opening view:

1. Include Motion to Create Interest

The layers and layers of flying cars serve as the movement in the view above. We found that motion makes a view much more arresting than just a static screen. 

Note: For a game that wants a slower pace or a heavier tone, reducing motion may help those goals, but for Ratchet & Clank we wanted a fast pace and a light tone.

2. Show the Player a Goal

The building centered in the video above is the train station, which is your ultimate goal destination in this level. Getting there starts a train-ride sequence through the city which ends the path back at the start point.

3. Show Off Art and Tech

This game was first made on the PS2 (the version above is the HD edition), so one of our big technical selling points was how far into the distance we could see, compared to other PS2 games at the time. Our artists used the technology to create beautiful views like the one in the video above.

Focal Points

To acchieve these goals, we used a number of tricks to position the camera for maximum effect. The first thing we had to do, though, was pick out the focal points in the level that we want to show. Focal points are whatever you decide are the most important parts of your view, and how you pick them depends on your goals. 

  • Are you showing off your art? 
  • Are you trying to indicate the way forward? 
  • Are you trying to tell a story or explore a theme? 

Whatever your goals are, find the things in your View that you want the player to see and then design the level so that it meets those goals.

Planet Gaspar from Ratchet  Clank

In the above image, there are three major things to focus on:

  • A. A goal: The player will go through here in a few minutes.
  • B. Art: The giant towers in this level are the major feature.
  • C. The path forward: The little "diving board" area indicated draws the player forward (since the lines point towards A).

Once you know your focal points, you're going to want to draw attention to them somehow. There are many ways to do this; here are a couple: 

Draw Attention

Draw the player's attention to the focal points of your composition, and put the most emphasis on those points you rank high in importance.

Vistas and Motion

Half-Life 2 uses a combination of a Vista and some motion to teach the barnacle enemy's behavior to the player. 

  1. The player walks up to the gap in the train. 
  2. The slope makes sure the player sees the pigeon and the gap makes sure the player is looking in the right direction. 
  3. The motion of the pigeon ideally makes the player follow it with the camera. 
  4. Once the pigeon gets eaten, the player is trained on how the Barnacle attacks (the tongue dangles, if you touch it the thing tries to eat you—just like it ate the pigeon).

Lines

We talked about this earlier, but it's worth mentioning again. In the screenshot below, note how there are several lines formed by the environment that point towards the ruins:

Elder Scrolls Oblivion with environmental lines highlighted

This draws the player's attention to the ruins, without using a big neon arrow and a sign saying "Check out these ruins!".

Align the Camera

One great way to direct players' attention is by lining up the camera so that important parts of the View fall into 1/3rd "slices" of the screen. This is an old concept, dating back at least to the Renaissance.

A full explanation of this is outside the scope of this tutorial, but for more information on the Rule of Thirds, see this photography tutorial.

I'll explain it with this image you saw earlier from Super Mario Galaxy:

Super Mario Galaxy with Rule of Thirds gridlines

The Tic-Tac-Toe symbol drawn over the screen above divides it into thirds. Notice how the important parts of the view are all more or less either fully contained inside one of the boxes, or intersected by one or more of the lines. This helps bring the players' attention where you want it.

Depending on your goals, you can do a lot with this little tic-tac-toe diagram.

For example, let's say you want to focus the player on a single goal or destination. One way is to put the thing you're going for in the center box:

Elder Scrolls Oblivion with Rule of Thirds gridlines

The above picture not only centers the view on the ruins, but also has the player looking down a Vista made by the vertical posts on the dock.

In Oblivion, the designers likely wanted you to think about exploring the ruins, but also don't want you to think it's mandatory. Centering it like I did in the image above makes it hard for the eye to see anything besides the ruins, and makes it seem more important than it is in the overall scheme of things. It's pushy, basically.

Elder Scrolls Oblivion with Rule of Thirds gridlines

The above shot is the one actually used in Oblivion (the same one I used in the previous section to talk about lines). The focus is still on the ruins, but the view around the ruins is much more accentuated. It's not all about where you're going, in this shot; it's also about how big the world is.

The bridge is located where the bottom and right lines cross, and it spans between the lower right and the center rectangles. As I mentioned before, this helps lead your eye to the ruins.

But what if you want the players to notice more than one thing?

Elder Scrolls Oblivion with Rule of Thirds gridlines

The ruins in the picture above fall more or less on the crossing point between two lines, which sets it apart in the composition. The bridge is centered, which also gives attention to the ruins, since it's pointing at them.

But what the above screen has that the others don't is the trail leading off-screen to the lower-right which is aligned with the bottom third line of the screen, and which is pointed to by the lines of the bridge. That trail leads towards the Critical Path and quests, so if my goal was to split the player's focus, that's how I'd do it.

Views in Non-Linear Games

Speaking of Oblivion, I want to talk briefly about how these principles are applied in non-linear games. We've talked about how Views and Vistas are used in Oblivion when the designer controls the camera at certain points (like after a load), but they are also frequently used in many character-controlled areas by funneling the player towards the View.

Middle Earth Shadows of Mordor level design

The screenshot above, from Middle Earth: Shadows of Mordor, shows how this is done. The game is vastly open, but frequently funnels the player through narrow areas that serve as Vistas. The Views on the other side of the tunnels are carefully composed to show you interesting places to go.

Conclusion

Views are important. Opening views are super important. Using the tricks above, you can construct these into your level designs so that later you can add onto them with other methods, if needed.

References

Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.