Lessons in Color Theory for Spyro the Dragon

In a relatively short period of time, videogame art has gone from the single white blocks found in Pong to thousands of colors wrapped around thousands of polygons. This in turn has allowed the worlds in games to evolve from a single black screen to immense 3D worlds. For those of us who find ourselves in the lucky position of being game artists, the trick is to find ways to leverage this cache of materials and palettes to create powerful, realistic worlds that draw in players. How does one do that? By educating yourself about the elements of color and production design and applying these lessons to your games, you can focus the player's emotion within a world, as we did at Insomniac Games in our Playstation title, Spyro the Dragon. In addition to color theory, Spyro's production design is explored by Insomniac Games artist John Fiorito .

The Difficulty of Color

Consider the example of the traditional painter. Subject matter, design, composition, and color must all be balanced together for the painting to come alive. Now take the example to the next level: A movie director or cinematographer has the same issues as the painter, plus the added complexities of motion, changing perspectives, and timing. In games, we face the challenge of making a movie in which the viewer can go anywhere and do anything whenever he or she wants. Our "viewers" can see our world from any distance or perspective anytime they want. How much harder does that make our jobs? We not only have to worry about what is in front of the "camera," or more precisely, in front of the player, but what is behind, below, above, and all around him or her, in real time - and it has to be fun to boot (see Figure 1).

Figure 1. An artist's job is complicated by the fact that in the 3D worlds, players can now see everything from everywhere.

One cornerstone of traditional art and great games is the careful use of color. What makes getting color "just right" so complicated is the fact that color has a powerful effect on our senses, and we're also very sensitive to subtle color changes. A little too much blue in a scene, and the mood of the whole world changes. Fortunately, there are a couple of techniques that can make the process of coloring a game world more manageable.

A Gallery of Worlds and Emotions

Once your basic game design has been completed, as an artist or level designer you ought to start thinking about specific ways that the world you are creating will draw the player in. Which emotions will your world or your level need in order to draw players in and entice them to stay? When selecting a level's color palette, you're also making a decision about the underlying emotion that the level will convey to the player.

I have found that it helps for me to think of the game as a gallery of paintings. In a gallery, each painting must stand by itself, yet it should also support and strengthen those paintings around it. This happens only if each painting in the gallery is balanced; each painting has been placed with complementary paintings which have been thoughtfully selected, and carefully arranged and lit. So it must be with the art and colors in a game. Each level's colors and textures should be chosen to support and strengthen not just the level itself, but the whole game.

Broad Strokes of Color

I like to work in broad strokes of color, picking two or three colors that will be the foundation for the color design for each individual level. It's important to ask yourself, what emotions do I want to evoke in players when they first step out onto the playing field? The color palette you choose will naturally depend on the nature of the terrain, the architecture of buildings, time of day, and the effects of weather. However, if you're trying to evoke a particular emotion as well, you'll have to take that into account. Do you want to fill the player with awe and wonder, or fear and turmoil? Do you want them to feel comfortable and at home, or unsettled and far from home? Once the core emotions are laid out for each level, decide which colors best elicit those emotions from the player and also work well with the other level elements (terrain, architecture, and so on).

Consider how each of the various characters within the game will fit into your color scheme. For Spyro the Dragon (a character-based platform game with a cast of dragons set in a medieval fantasy world), we made Spyro green in the earliest stages. But we quickly discovered that this didn't work with many of our primarily green environments - Spyro kept disappearing into the environment. We experimented with over a dozen different colors for Spyro before we finally found one that satisfied all our concerns: purple. As purple, Spyro didn't disappear into the grass on many levels, he was no longer the same color as several of our competitors' characters, the detail in his textures stood out, and he was a bright, fun character.

These same questions had to be asked for each and every object and creature in Spyro's world. It also was important for game objects. For example, a great amount of treasure has to be found and collected in Spyro, so it was important that players could easily identify treasure at great distances. We made this easier by applying motion and a little animated sparkle to the gems to make sure they were always the brightest thing around.

A level's core palette should contain only two or three base colors. Using these base colors, a level's detail is then defined using various shades and values along with small amounts of complimentary or contrasting colors. Be careful when extending this core palette because using too many colors can lessen the impact of any one color and you end up with emotional mud - just as if you mixed too many different colors of paint together. A variation to this rule is that some worlds may have multiple, distinct palettes, one for each area found within that world. For example, one palette for inside a building versus outside it. Even in these cases though, each of these distinct palettes should be limited to two or three colors, and there will still be one master palette, of two or three colors, which sets the tone for the entire world.

One way to check the overall state of your "gallery" - the color continuity between game levels - is to view screenshots or test swatches from each of the levels side by side, as if they were a color wheel or contiguous screenshots in a consumer game magazine. Decide if each individual level's look supports and strengthens the others. If not, rework the colors in one or more of the levels. More often than not, it doesn't take much of a change to find that balance if you catch the problem early. With Spyro, as soon as we had a rough design document with its specified worlds, we put up a white board in the art room with a brief description of the sky and the core palette for each of the levels. Further along in the development process, small color print outs of screenshots augmented the white board (see Figure 2).

Figure 2. During the development of Spyro, a white board was used to display all 30 levels and their respective colors. It went through many changes before the end of the project.