Creating Immersive Environments

ebur1n
Developer Baseplate
7 min readMay 17, 2021

--

Immersion is key to keeping players invested in an experience. When a game’s environment is lacking immersion, it misses the opportunity to involve players more deeply with the creator’s vision and story.

Good environment design always has a story behind it. For example, an overgrown city tells a tale of neglect, of abandonment. Crumbling structures can convey the story of a battle, or maybe of a disaster. Depending on how an environment is designed, the story can greatly vary and that’s the beauty of having an immersive environment. It is your story to tell through your own creation.

Creating environments can be challenging at first. It can be overwhelming when you don’t know where to start or how to start. However, there are steps that can be taken to both help simplify and quicken the process.

Map Design

FPS map for Bad Business. The image shows a transition between a block out to a final detailed environment.

One such step is creating a block out. Now it may seem tedious at first, after all, why would anyone want to make a map twice? Here is why, a block out is a non-permanent way to visualize your planning. Just like how you might write down a grocery list, creating a block out allows you to form your thoughts and to have a physical representation of the mental image inside your head. You can then adjust and tweak the physical representation without having to worry about any permanent changes.

Linear FPS map used for Ready Player Two. The use of atmosphere and trees to block the players point-of-view is an example of forced perspective.

Another step to better creating environments uses the fundamental technique, forced perspective. Forced perspective is a photography technique that uses optical illusions to change visual perspective. Many 3D environments use this technique to save on time and resources. For example, forced perspective can be simulated in a 3D environment by scaling objects to make them seem larger or smaller than they really are or it could be applied by strategically placing assets and tweaking the lighting around them — which we’ll get to later.

Screenshot of “Brushtool” by XAXA and some of its features applied in a FPS map for Bad Business.

Finally variation is key to an immersive environment. Here’s where a community plugin called “Brushtool” by XAXA will come in handy. Brushtool allows you to add your own assets to the plugin and then uses RNG to vary those assets when placed into your environment. It’s great to use for placing foliage, for example, because it allows me to place a large number of assets automatically rather than manually.

Variation creates immersion because real life objects are almost never perfect: rocks are chipped, objects have dents, and trees are tilted. An easy way to create variation is by applying subtle changes in color. One great example of this is with wooden floors; if you place individual planks and alter a few to a lighter or darker tint you can easily create contrast, which creates variation. The bottom line is that things aren’t perfect in real life, and so they shouldn’t have to be in virtual 3D environments.

Lighting and Studio

Lighting is truly one of the simplest ways to create immersion in your 3D environments. Simply tweaking things like the ambient lights, hue, saturation, etc. can make a world of difference. That is why it is important to familiarize yourself with a tool’s, such as Roblox Studio, own lighting properties, as well as any filters that can be added. There are numerous settings that can impact lighting effects, but I’ll only cover the properties that I feel contribute the most to the look and feel of an environment.

Lighting Demo that shows how different lighting can affect how an environment is perceived.
Cartoon environment that shows how the mixture of lighting and colors can create a more friendly environment.

Brightness is one of those properties that, when applied correctly, can allow you to create truly immersive environments. The higher the value of brightness, the more highlights your game will have. Highlights are the opposite of shadows in color; brighter highlights means a higher bloom with lighter hues.

In Roblox Studio, Ambient and OutdoorAmbient are important for playing around with shadows. Ambient is normally referred to as the color of “shadows”, although more technically it is the color of an object when there is a shadow. Altering these two properties can allow you to shift the mood and can greatly aid in creating more fantastical environments.

For more realistic environments, it may be better to play with the EnvironmentDiffuseScale and EnvironmentSpecularScale properties. EnvironmentDiffuseScale deals with how light is reflected on an object based on the object color, in some places it can be used in place of Ambient and OutdoorAmbient. EnvironmentSpecularScale deals with light reflected on objects depending on the environment. Adjusting this can give materials like metal and more realistic reflection, allowing for more realistic environments.

Filters used for the lighting demo image.

Finally, some filters in Studio to keep note of are: BloomEffect, ColorCorrection, and SunraysEffect.

Bloom affects how much brighter colors “glow”.

ColorCorrection allows for fun changes to colors such as TintColor, Saturation, and Contrast. The brightness property of ColorCorrection works similar to changing the shade or tint of a color, but applied on a larger scale.

SunraysEffect simulates sun rays in an environment depending on the GeographicLatitude of the sun in the environment.

Understanding all the elements of lighting and combining them together allow for you to create more immersive environments! Keep in mind that you can manipulate these properties however you wish and that it is through trial and error that you will find the best lighting settings.

Colors and Material

Showcase map that shows how the proper usage of color and materials can completely alter the feel of an environment. On the right side there is an example of the use of triadic colors to create a pleasing contrast.

It’s important to understand color theory and how to apply it in your environment. The most important aspect is understanding the basic color wheel.

The color wheel has primary colors (which consist of red, blue, and green), secondary colors (which consists of colors created by mixing primary colors), and tertiary colors (which are created by mixing both primary and secondary colors). And within all of these potential colors, you can group them into warm and cool colors. Understanding the different types and groupings of colors will aid you when designing and setting the moods for different environments.

Now that you have a basic grasp on the color wheel, it is time for color schemes! The tree color schemes are complementary, analogous, and triadic.

Complementary colors are colors directly across from each other on the color wheel. Some real life examples of the use of complementary colors involve everyone’s favorite holiday, Christmas! The popular use of red and green is not without reason as they are complementary colors. Analogous colors are colors directly next to each other on the color wheel. These colors directly compliment each other by having one color as the major color, one as support, and the last as an accent color. Lastly, triadic colors are colors that form a triangle inside the color wheel. The colors are both contrasting and harmonious at the same time. They create a visually pleasing contrast without overpowering the eyes.

Using color theory in 3D design is quite simple! Take the knowledge of which colors work best with each other and apply that to your environments. For example a snowy mountain can use analogous colors (such as blues and purples) while also throwing in tertiary colors (such as a blue-green or yellow-orange) to represent contrast and a change in the environment.

When it comes to materials, understanding the basic materials provided in Roblox Studio and how to use them in clever ways can aid you in better creating immersive environments. I personally use Sand as a substitute for many materials because it is more versatile in what it can be applied to. Sometimes certain materials will not look as intended even if it is technically labeled as such, a great example is Fabric. I normally substitute Fabric with Sand because it’s a more versatile material. For more cartoonish environments I suggest using SmoothPlastic and allowing the color to better convey what an object is supposed to be through subtle contrast.

With the limited materials provided, it is important to use your imagination and creativity to determine which materials may look better even if it is unconventional!

Combining Everything

Environment mockup that showcases a combination of forced perspective, lighting, colors, and creative use of materials to create a pleasing 3D environment.

Now that you’ve learned some of the basic tips and tools for creating immersive environments in Roblox Studio, it is your turn to combine all of them to create your own environment!

Remember that there are many different ways to go about the same thing. It is important to use your own imagination and creativity to cleverly use what you have available at your disposal.

Follow me on: Roblox & Twitter

Join the millions of creators on Roblox and make your first experience with help from this page on getting started.

--

--

ebur1n
Developer Baseplate

3D environment artist who has contributed to: Bad Business, Big Paintball, Roblox’s Ready Player Two event, and much more!