WoLD Store Search About Contact

World of Level Design

Tutorials to Becoming the Best Level Designer and Game Environment Aritst

How to Use Color to Create Environments Like "Mirror's Edge"

Category: Game Environment Art, Level Design
September 25, 2018

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.

19 Takeaways from Mirror's Edge Color Use

  • Start with a neutral off-white color (lighter gray)
  • Pick just a handful of colors and re-use them throughout your game
  • Decide which colors will be used for exteriors and which for interiors (define a ruleset)
  • Red color means aggression, anger, violence, fire, importance
  • 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, inviting, enthusiastic and passionate
  • Exterior daytime locations feature warm color palettes
  • 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
  • External nighttime locations use cool color palettes
  • Cool vs warm is a complimentary color scheme; 2 colors that are opposite on the color wheel
  • Do not use complimentary colors equally but keep the ratios of cool vs warm between 90/10, 80/20 or 70/30
  • Warm vs cool can be done with lighting or textures
  • All exterior, daytime environments use blue and orange texture combination
  • The last level "The Shard" plays a lot with cool vs warm color palette
  • Most interior locations that are lit with artificial lighting use a single dominant color
  • Black is only used within interior locations and very seldom

Video Tutorial

Colors That Were Used

"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:

  • White
  • Red
  • Orange
  • Blue
  • Lime Green
  • Teal
  • Yellow
  • Black

White:

Red:

Orange:

Blue:

Lime Green:

Teal:

Yellow:

Black:

So decide on the color palette you are going to use and then use those colors throughout the entire game.

Start with White

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.

The Importance of Red

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.

Doors:

Railings:

Pipes:

Valves:

Ropes:

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:

Landing pad:

Warm Color Palette

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:

The Mall:

Atrium:

Packaging area:

Cool Color Palette

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:

Subway Tunnels:

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:

Boat exterior:

Boat interior:

Last level "The Shard" uses primarily a cool color palette consisting of blues.

"The Shard" level exterior as you start:

Interior pipe room:

Mainframe room:

But "The Shard" also introduces complimentary orange color into the mix, creating cool vs warm contrast.

Warm vs Cool

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:

  • Green and Red
  • Blue and Orange
  • Yellow and Violet

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.

Underground vents:

Subway tunnel:

Building construction:

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:

Use Single Dominant Color for Interiors

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

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 pipes:

Black and green hallways/rooms:

Black floor:

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.

Get the Book »

SUBSCRIBE & GET 2 FREE PDF GUIDES

Subscribe to WoLD and receive 2 FREE PDF Level Design Guides (200+ pages).

Subscribe and Get 2 Free Level Design PDF Guides

Want to know more what you are getting by subscribing?


Follow WoLD




BEST SELLING UE4 SERIES


EVERYTHING I KNOW ABOUT PLANNING


Home Terms of Use/Trademarks/Disclaimers Privacy Policy Donate About Contact

All content on this website is copyrighted ©2008-2018 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