If I show any screenshot from this game, you will know where it is from.
The game has a distinct visual style. It features off-white environments with accentuated use of primary colors.
Of course, it's "Mirror's Edge".
"Mirror's Edge" was released in 2008 and it holds up visually a decade later. I believe it will continue to do so for years to come.
Yeah, it is fun to free run through levels - jumping between buildings, running across walls and pulling myself up on ledges.
But it is the art style that got me into the game.
Many of the game's locations still inspire and are re-created by game artists as a way to learn and improve their skills in current game engines.
How to better understand color use so you can mimic the art style of "Mirror's Edge" in your own work?
Let's go deep into the anatomy of color used in Mirror's Edge.
Important Note: Following tutorial (like all tutorials on WoLD) is based on my own experience, opinions and conclusions as I was playing the game. Nothing here reflects what the developer or the publisher might have intended or did not intend as they were creating the game. These are WoLD opinions only.
"Mirror's Edge" decided to use just a handful of colors throughout the entire game. These same colors are then re-used throughout various levels.
Re-using colors creates unity.
Following colors were used in the game:
So decide on the color palette you are going to use and then use those colors throughout the entire game.
The beauty of "Mirror's Edge" reminds me when using developer textures during block-in phase.
Clean, pristine and untextured.
Often I like the block-in look more than the final textured piece.
"Mirror's Edge" uses this approach and starts everything with a neutral, off-white color (lighter gray):
You still have a normal, reflectivity and detail map but surfaces lack albedo (diffuse):
Off-white gives you neutral shading of the environment which you can begin to highlight with various colors.
Red color has many meanings - aggression, violence, fire.
In "Mirror's Edge" it means importance.
Red is used to guide the player towards their next location. In the game, this is called "runner's vision".
Certain objects become highlighted in red which direct where you need to go. This includes red doors, railings, ledges, pipes, valves, boxes, ropes and buttons.
In addition to highlighted props that tell you the next immediate step, red is also used for level's landmarks and landing pads.
Red crane landmark:
Warm colors consist of reds, yellows, oranges and beige/creamy colors.
Warm color palettes produce an emotional response within the player that is positive, optimistic, happy, invviting, enthusiastic and passionate.
Exterior daytime locations feature warm color palettes:
Interior locations that are lit with an external light (sunlight) also have a warm color palette.
Such as the Offices:
Cool colors consist of blues, greens and grays.
Cool color palettes produce an emotional response within the player that can be calming, relaxing, soothing or cold, distant, sad, sick and depressing.
Underground environments that are not exposed to external light (sunlight) have a cool color palette.
Down into the Maintenance Chambers:
Underground Maintenance Access:
Many connecting hallways within the game contain cool color palettes:
External nighttime locations use cool color palettes. The Boat level contains exterior and interior locations; both feature cool color palettes of blues and greens:
Last level "The Shard" uses primarily a cool color palette consisting of blues.
"The Shard" level exterior as you start:
Interior pipe room:
But "The Shard" also introduces complimentary orange color into the mix, creating cool vs warm contrast.
Once you've used warm or cool palettes, you can start to play with warm vs cool contrast.
Cool vs warm is a complimentary color scheme. Take 2 colors that are opposite on the color wheel and use them to light and/or texture the environment.
Compliment color examples:
The key is to NOT use cool and warm equally.
Determine if the environment will be primarily cool or warm. Then use the compliment color sporadically as a way to establish visual harmony and interest.
Keep the ratios of cool vs warm between 90/10, 80/20 or 70/30.
At this point you can play with warm vs cool using color and lighting. This is done throughout the entire game.
Warm vs cool can be done with lighting or textures.
Examples of warm vs cool with lighting.
Examples of warm vs cool with textures.
All exterior, daytime environments use blue and orange texture combinations.
Interior subway station:
New Eden mall interior using combination of light and texture complimentary colors:
The last level "The Shard" plays with cool vs warm color palette. It combines the use of orange and blue throughout the chapter and entire sections are blue, orange or both.
Most of the locations use cool (blue) color palette:
You then go through sections of the map that are warm:
You then reach the rooftop that uses predominantly cool blue color with warm orange where you start and where you need to go:
And the finale is combination of both; cool vs warm:
While most external daytime locations including interior locations lit with an external light (sunlight) use warm color palette and complimentary color scheme of orange and blue.
Most interior locations that are lit with artificial lighting use a single dominant color. This creates almost monochromatic color palette and helps to accentuate that location. This is NOT counting the important red color used as a gameplay element and shows up consistently throughout every part of the game.
These single dominant colors include orange, green, blue, red, yellow and teal:
This creates a strong exterior vs interior contrast. Remember, you can do this with textures, lighting or both.
Black is only used within interior locations and very seldom. It appears in just few locations and mostly towards the end of the game.
Black and green hallways/rooms:
Color theory and color use is very important part of the process. Make sure you plan your level designs and game environments properly following these 11 steps.
All content on this website is copyrighted ©2008-2020 World of Level Design LLC by Alex Galuzin. All rights reserved.
Duplication and distribution is illegal and strictly prohibited.
World of Level Design LLC is an independent company. World of Level Design website, its tutorials and products are not endorsed, sponsored or approved by any mentioned companies on this website in any way. All content is based on my own personal experimentation, experience and opinion. World of Level Design™ and 11 Day Level Design™ are trademarks of Alex Galuzin.
Template powered by w3.css