Book cover "Dream Worlds: Production Design for Animation" by Hans Bacher
What can you learn from production design for animation? Most importantly, how do you apply these principles from production design for animation to game environment art?
As environment artist and level designer, you must absorb knowledge from many different art disciplines. It should include architecture, interior design, photography, film and animation.
The hardest part is to find connections and correlations from these disciplines and apply it to your own work. For example, you could read an instructional manual on composition and lighting for photography but if you can't translate it to game environments and how it improves your work, then you just got better at taking photos.
The key is to find a way to use practical knowledge in one discipline and transfer it to another.
When I was in college, studying computer animation I found a great book that offered insight into preproduction and world creation for animation.
The book is Dream Worlds: Production Design for Animation by Hans Bacher.
Although the book is mainly focused on feature animation from Disney, there is a lot of correlation to game environment artists. The author offers practical advice, insights, tips and uses a lot of image examples from Disney films.
You will also notice that I don't use a lot of image examples from the book, because we need to relate everything back to game environment art and level design.
Here are 11 things I learned from Dream Worlds and how I applied it to game environment art and level design.
1. ON PREPRODUCTION...
"Visual Development is the early stage in production where all the different ways to translate a story idea into visuals are being explored. That includes the search for a style to fit the story, in all areas: background, characters, color, composition and editing. It also includes the research and concept-design based on possible stylistic directions. Research into areas such as architecture, historical environment, landscape, costume and props starts simultaneously. Concept-design covers all different genres and styles, naturalistic or stylized, drama or romance, time-period movie, children or adult concepts, musical or action film."
Visual development for a map or a game environment is no different. Beginning stages are all about exploration. You should spend a lot of time in preproduction phase - researching and collecting reference.
Research architecture, location, theme, story, history and style of the place you want to create.
You are exploring as many ways as possible where you want to take your environment to. Only then should you have enough information to narrow down to a single idea, theme and style that you will execute.
Here is a sketch and a quick paint over of an idea I had for a map:
Sketch and quick speed painting for a custom UT3 map
From the sketch and concept I created custom map in Unreal Tournament 3:
Custom community map for UT3 I created from sketches and painting above
Outcome of preproduction is to know exactly what you are going to create. You should see the environment already done in your mind's eye. Because you spent time in visual development, production process will be a lot smoother.
I cover this planning/preproduction process in great detail in Preproduction Blueprint.
2. ON STYLE...
"Will the style of the film be realistic or abstract stylized, cartoony or surreal? How much detail can we afford to show without overloading the images? Do we lose the audience in an abstract visualization because it might be harder to establish an emotional connection to an abstract character? The choice of color depends on the style and genre: fresh and friendly daylight colors for a comedy versus a dark mood and sharp contrasts in a thriller."
Style is the art direction and visual quality of your environment.
What is the visual style of your environment, your level?
Stylized such as Okami?
Okami style example.
Realistic like BattleField 4?
Battlefield 4 style example.
Cartoony like Mario?
Super Mario 3D World style example.
Artistic like Ori and the Blind Forest or Dishonored?
And by artistic style, I mean that the game's color palette and style mimics a painting or painterly style.
Ori and the Blind Forest style example.
Dishonored style example.
Style will dictate your design of props, your textures, your lighting, the amount of detail you include. It will help to guide your visual decisions, story and theme.
3. ON RESEARCH AND REFERENCE...
"The research part can be very time consuming as it depends on how complicated the project is. Sometimes it is very easy to get the right reference within a short time; once in a while it is impossible. That's why Disney arranged for research trips for many years for some of the leading designers of a project. They went to Africa for The Lion King; to Peru for the Emperor's New Groove; to the Greek Islands for Hercules; and to France for Beauty and the Beast, where I was fortunate enough to be able to join them. Unfortunately, I was not part of the group of artists that went to China for Mulan.
In that case you would depend on books, television documentaries, movies and the Internet. It is the time when you go back to school and learn how things look, and learn how to draw them. During this time, you create the foundation for your style of the movie. The more thorough your research is, the fewer problems you will face during production. During the last stage, there will be no time left for studying."
There is no better inspiration and reference collection than actually visiting places similar to the one you are to create.
When I created custom map Hotel Swiss for L4D1 and 2, the idea was directly inspired by a trip to a hotel up in the mountains in Switzerland during a very heavy fog.
Photo references for Hotel Swiss map
L4D2 map environment
I understand that it isn't always an option to visit locations around the world just for environment reference. But, next best thing is to research and collect reference from images.google.com, books, movies, documentaries and magazines (such as National Geographic).
You want to collect as much reference as you can. Focus on variety of reference that will help your environment creation.
Various reference should include:
- Environment (foliage, landscapes)
- Inspiration (style and visual artistic theme)
Author mentions that "The more thorough your research is, the fewer problems you will face during production." Spend sufficient amount of time understanding what you want to create by collecting a lot of reference. Immerse yourself into the environment you are creating.
4. ON CREATIVE PROCESS...
"To describe how the creative process works is nearly impossible. I can only show some of the steps leading to the final product. When I need to develop a new style for a film, I want to come up with a look that nobody else has done before and that means that I should at least know what has been done. So far I have seen a lot of the animated movies from all over the world, and I have a big library of movies and books about animation from the past 70 years. If time allows, I go through my archives and watch many movies done in different styles. I go through documentaries as well as selected comic books and art books. It may look like I just want to have fun looking at all that stuff. Yes, in a way it is fun, but more importantly, it refreshes the batteries! It's the best time, like going to school again. And it generates an energy that makes you want to create something."
When coming up with a style and theme for your level or game environment look at what has already been done. Play games variety of games with different art styles, gameplay mechanics and genres. Look at old and new films. Art books from different time periods in history. I know your time is limited so make sure that everything you watch, read and play can be redirected and used on your current project.
I found that if I just look at an art books for the sake of looking, I don't walk away from it learning anything new. But if I am in the preproduction stages for a project and I am looking at different art styles, watching and playing for the purpose of discovering a theme and style of an environment that I would want to create, it sticks with me; even if I decide not to use that reference.
5. ON FLOOR PLANS...
"It is very helpful to work out the whole sequence in floor plans. The position of the camera and the movement from scene to scene is very easy to plan that way. The floor plan shows where the light comes from and what is important for the continuity during the sequence. You can even choreograph the movements of the characters that way before you translate everything into single cuts."
Floor plans are also known as top down layout or top down views. In level design and game environment creation they help to figure out how the environment will look from top down, how the space will be played and relationship between architecture and props.
Top down views for custom CS:GO map
There are two ways to focus on floor plans:
For stand-alone game environment (non-playable map) you can use top down layouts to help define a fly-through camera to show off the environment; space and location of objects, focal points and where you will spend time detailing based on what you are going to show.
For a level design (playable map) top down layouts helps to visualize playable space. You can define spawn points, power-up locations, mission points, AI zones, multiple and alternative pathways and how the player would navigate around your environment. See this in-depth guide on how to create top-down layouts.
I spend a considerable amount of time designing my top down layouts; during this process I can't help but visualize the actual place I am creating. My goal is to always see as much of the environment in detail as I can in my mind before I jump into the editor and start blocking in the map.
6. ON COMPOSITION...
"Composition in film is the harmonious combination of shapes and movement within a field that creates an interesting imaginative world for the audience. We want the viewers to forget that it is a movie, an artificial world they are watching. A good story is the most important thing, but it has to be set in a believable world. And it has to fulfill visual dreams that are the same around the globe. The human brain has some basic understanding of the picture it sees, about the arrangement, the size and the balance in it.
In film time it is limited. When you look at a painting you can take your time, get lost in the mood and the tiniest details. Our images are visible only for a few seconds, they have to be very precise in their arrangement. Nothing is accidental. We lead the eyes of the audience. A good composition should have the right selection of order, rhythm and intelligent balance. That balance is between space, the negative area that is all around your objects and defines their shape, and the objects or the positive form that defines the readability of your design."
Composition examples by Hans Bacher from "Dream Worlds", ©Disney Enterprises, Inc.
Composition and scene arrangement of your environment has to be carefully planned from various points of view. Unlike film, where the screen time is limited, in game art the player can explore your environment. There are two elements to consider before you start.
Are you creating a stand-alone game environment (non-playable map) or are you creating a level (playable map)?
The composition and arrangement for each one will be different.
In a stand-alone game environment, you are creating a scene that will not be played. It is not interactable. Like a painting or film. Composition will be important from certain points of view. You will only detail areas which you will show to others.
In a playable map you will have objectives, AI zones and paths that lead to mission points. You will want to guide the player to the next location or to a mission objective. The composition and scene arrangement has to be used to accomplish that goal. You will need to set up your map in a way that the player knows where to go subconsciously, without being lost. This is done through framing of architecture, lighting, environment cues, prop placement, on screen direction or AI character direction.
Composition and arrangement of your environment should be dictated by your purpose that you want the viewer or the player to experience.
Just as author points out, "nothing is accidental; we lead the eye of the audience. Good composition should have the right selection of order, rhythm and balance."
You want to lead the direction for the player where to go in your environment. The arrangement and composition of the scene should guide the player or viewer to the next element within the scene.
7. ON CENTER OF INTEREST AND OBJECT PLACEMENT...
"Find the harmonious center of your planned picture. Use it as the starting point for the placement of the action and all the necessary information around it."
"There are different ways to lead the eye to the center of interest. It depends on what the story requires. You may have to show important detail surrounding the character; it can be some secondary action or a few elements in the background that have to be arranged."
What is your focal point of your environment? What is the primary dominating element of your map?
Harmonious center is the focal point of the environment or each location.
Focal point is the environment's landmark, a visual reference. It is the focus of your location, a center of interest. It could be a dominating piece of architecture, landscape or pathway. Something that lets the player orient themselves in the environment.
Bridge focal point in Half-Life 2
For example: in a playable map, a focal point can be either a physical element such as an architectural element or a landscape element or it can be an element within a section of a map that directs the player where to go. Such as a well lit doorway or headlights on a car in a dark alley.
Each environment and each section of your level design should have a focal point.
"Uninteresting placement of objects concentrated in one area should be avoided, as should placement on one straight line or precisely in the center of your field. You don't need to show each object at full length; you create more depth by cutting closer, moving them sideways and into the depth of your composition. More importantly, lead the eye to the center of your "stage" where the action takes place."
Object placement in a game environment or a level has multiple objectives depending on what kind of environment you are creating. Playable level and stand-alone game environment.
Object placement in a playable level has to fulfill a purpose of possible cover, gameplay mechanics and make the map believable with props that support the story and the location of the map while keeping it optimized for gameplay.
Object placement cover example in level design from Call of Duty: Black Ops
Object placement in a stand-alone game environment (non-playble map) has to fulfill the story and believability of the environment. You wouldn't need to think of possible cover scenarios or how the player may use your props and objects in the scene. For stand-alone game environments think like a film-maker. You will have a specific composition and certain camera movement. The props have to be arranged in a way that help and tell a story and sell the believability of your world within a single frame.
8. ON SIMPLICITY...
Simplicity of design examples from "Dream Worlds", ©Disney Enterprises, Inc.
"Go for simplicity! I try to avoid detail wherever possible. In our design-planning stage, detail should only be added where it is needed to explain the story. It is interesting to note that if your sketch works without the detailed stuff, the final background should do it as well. I am not talking about texture. When used correctly, texture creates a tone. Flat color areas without a certain amount of texture can be part of a style, but usually the information that texture gives us is necessary to describe materials and creates depth."
During block in stages of a game environment or level design, focus on simplicity. Use BSP brushes and simple geometric shapes to define boundaries of buildings, walls and environment sections. Foremost, focus on playable area and on space relationships between architecture.
Avoid adding detail too early. Go from large to small. From primary shapes and large props down to smaller props and detailing later.
Keeping it simple with BSP block-in for custom CS:GO map
During block in or white-boxing, make the environment work without detail and only using simple geometric shapes. If your environment works without any detail, then it will work with detail. But if your environment doesn't work with simple shapes, then no amount of detail will make it better.
For textures start with simple flat colors and values to define your materials. For 3d models, use simple geometric shapes and boundaries of the model. For lighting, use simple area or point lights, just enough light so the player can see. For playable map, work on the flow, pacing and balance of the map. For game design, make the game mechanics work first.
In the beginning do not spend time on creating final props, textures, materials. Work your environment in passes. From rough initial block in to additional detail and refinement with each working pass.
Focus on the initial layout for your environment and block in playable areas, gameplay and core mechanics of your map.
9. ON LIGHTS AND DARKS (VALUES)...
Example of light/dark values from White Night game
"The lights and darks of any color are called values. Normally these values are the result of light in nature. Where there is a lot of light, you get the lightest value – white; in the darkest shadow areas you get black. There is of course a scale of mid-values in different shades of gray. We reduce these middle tones to only three. It makes them easier to work with.
There are different ways to arrange scaled value steps in your sketch. Define the foreground, one or two middle ground areas, and then the background. In case you want to arrange the values realistically, your foreground might be the darkest, and your background the lightest tone. But even in nature you will find a situation where the sky is the darkest value and a middle-ground the lightest. You should know what you want to design without following the rules of nature. To achieve the desired result, a scary moment or a romantic scene, you choose the best arrangement of values."
Full range of values in your game environment or level design are just as important as they are in traditional medium (painting, drawing, film, animation).
Complete range of values from light to dark allows you to have depth and contrast. You may light your scene using lighter values (exterior, daytime, brightly lit interiors) or you may light your scene using darker values (night scene, interiors, underground).
Full range of values from Halo 4's interior environment.
Full range of values from Halo 4's exterior environment.
The way to achieve the full range of values is to have light and dark areas in your scene.
Use light and shadow to create depth and contrast.
If a scene takes place at night, it will have primarily dark values, but within those dark values you could have a lamp post, car headlights or a camp fire to create a full range of values within the scene by introducing lighter values. It also creates contrast and brings attention to that area.
Example of night time, full range of values from Alan Wake.
If a scene takes place in at daytime, it will have primarily light values but within those light values you could have cast shadows form landscape or architecture creating a full range of values.
Example of daytime, full range of values from Alan Wake.
Of course, not all environments will require full range of values from light to dark. It depends on a theme and style of your project. But knowing when your environment needs more range from light to dark and more contrast will allow you to create more interesting locations and improve your work.
10. ON CHOOSING COLORS...
"Henri Matisse said, "When I choose a color it is not because of any scientific theory. It comes from observation, from feeling, from the innermost nature of the experience in question." That worked well for Matisse. However, it doesn't hurt to know a little bit about the scientific background of why to use them, especially when color is such an important part of our business.
Color should be used to create specific moods. Of course our cultural background plays a significant role in that. Countries closer to the equator are more colorful in all ways than countries in the northern parts. Yet nearly everywhere around the world the same rules can be applied. Certain cool colors calm down the emotions, while hot colors create aggression in emotions. These colors can be used in different combinations to create different atmospheres. Psychologists and interior designers know how to use them together to achieve specific results. History will show you that dictators knew (and know) about the manipulative powers of color."
The author says this important line, "Color should be used to create specific moods." Use color in your environment to define how you want the player to feel. What mood and emotion do you want to communicate in your scene. Serenity, calmness, distress, fear etc.
Examples of color symbolism (note that this may vary according to different cultures and how it is used within combination of other colors and within the environment):
- White symbolizes innocence and purity; also sterility, coldness
- Black symbolizes authority and power; also oppression, risk, danger
- Red symbolizes energy, warmth, passion, action; also aggression, strain
- Blue symbolizes calm, trust, physical and mental relaxation, serenity; also coldness, distance and lack of emotion
- Green symbolizes balance, growth, harmony; also boredom and stagnation
- Purple symbolizes spirituality, luxury, wealth, and sophistication; also suppression and inferiority
- Yellow symbolizes optimism, confidence; also depression, anxiety, irrationality
If you are creating a horror scene, you won't be using a bright color palette. Dark and washed out color palette of browns, reds, greens and high contrast lighting would help to sell the scene better.
Example of color in horror setting from Alan Wake
For calm and serene scene you will use a bright color palette. Lots of yellow, green, blue, red and orange. Not much contrast, light to dark value variation.
Example of color in a tranquil setting from Far Cry 3
It will help if you learn the basics of color theory. Learn about different color combinations such as monochromatic, complementary, split-complementary, analogous, triad.
Pay attention to games you play. What color combination and color palette do they use and what is the feeling of the scene?
11. ON COLOR...
"In the film business, especially in our area of animated films, it is not necessarily a good idea to use color because "it looks so nice!" Of course we could start a discussion about taste, but putting that aside, there are rules that have been created over the past eighty years. And it is best to study these rules so as not to repeat past mistakes. The color in our films corresponds with specific events in the story, and just as there is an "emotion/action curve," there should be a "color mood curve." The dictates of the color palette will begin with the different seasons that the film takes place during, as well as the times of the day, weather situations, and interior/exterior locations within the story. For example, a love scene will need different colors than a suspense scene. At the end of the film, the color is especially important to build up the climax."
Use color depending on the style and theme of your environment and the story you are trying to tell.
Use of color and lighting has a very powerful emotional component in your map.
Disney uses an "emotion/action curve" and the color in those scenes correspond to what is happening.
You could use a similar method in your game or your level. As the level becomes harder or darker and you want to induce more fear then use a cool color palette that correspond to the emotional/action curve of your map.
Left 4 Dead 2 - Hard Rain campaign is a great example of emotion/action color curve. The campaign starts as the sun begins to set with a very light summer rain. It has a very calming and serene effect. As the map progresses, the evening turns into night and the rain picks up to a downpour and eventually to a hurricane. Colors of the campaign start with warm color palette and turn to cold, washed out greens, blues and browns.
L4D2 emotional color curve from Hard Rain campaign. Calm, peaceful.
L4D2 emotional color curve from Hard Rain campaign. Coldness, risk, danger.
Another example of emotion/action color curve is original Far Cry. Player starts the game on a mid-day sunny beach and within a few levels the day turns to evening and to night. The feel of the place changes from paradise to terror induced jungle. Hiding in the grass and foliage was a way to surprise your enemies, now it is the enemies who may be hiding in the dark and in the jungle to surprise you. The colors changed from bright warm palette to dark and cool palette.
Far Cry example of warm color palette and emotional color curve.
Far Cry example of cool color palette and emotional color curve.
The use of warm vs cool color palette works quiet well. Start with that. Underground environment or night time will use cool color palette (blue, brown, dark greens, dark purples). Sunny bright day will use a warm color palette (red, orange, yellow).
Become aware as you play games and watch movies of how you feel during certain moments. Look at the color palette of each scene and location.
Dream Worlds was a very insightful book that had a lot of parallels to game art. It is a worthy addition to your library.
Games and Screenshot References:
Alan Wake, ©Microsoft Studios. Developer: Remedy Entertainment
Battlefield 4 ©Electronic Arts. Developer: EA Dice
Call of Duty: Black Ops, ©Activision. Developer: Treyarch
Dishonored, ©Bethesda Softworks. Developer: Arkane Studios
Halo 4, ©Microsoft Studios. Developer 343 Industries
Half Life 2 ©Valve Corporation
Far Cry, ©Ubisoft. Developer: Crytek
Far Cry 3, ©Ubisoft. Developer: Ubisoft Montreal
Left 4 Dead 2, ©Valve Software
Ori and the Blind Forest, ©Microsoft Studios Developer: Moon Studios
Okami, ©Capcom. Developer: Clover Studios
White Night, ©OSome Studio
Super Mario 3D World, ©Nintendo. Developer: Nintendo EAD Tokyo