Environment designer Jihoon Kim showed some fundumental concepts, which will make your video game spaces better.
Environment designer Jihoon Kim showed some fundumental concepts, which will make your video game spaces better. This is one of the best features on environment art we’ve ever published.
Introduction
HI, I’m Jihoon from Korea. I studied Industrial design hoping to be a game artist, but the game industry did not exist in Korea when I graduated from Kookmin University. Instead, I started to work as a graphic designer creating advertisements and websites for various companies such as Samsung, Sony, Daewoo and so on. In 2004 the game industry in Korea grew enough to consider starting a career, however they weren’t necessarily genres that I was particularly interested in working on, such as MMORPGs. I was more a fan of First and Third Person Shooters like Half-Life, Tomb Raider and Medal of Honor. I decided to further my education in game development and moved to the US.
Learning game development was fun, and Photoshop was already my best friend since version 2.0. I managed to learn concept art and 3D at the same time. After working at Bandai Namco and Airtight Games I started at 343 Industries working on a very successful franchise of Halo. It is an honorable experience to work with such amazingly passionate and talented artists.
Simplicity is the Key to Stronger Visuals
Triangle, group of guiding line and hexagon
Parallel line on Enlarged circle, tall cylinders and squares
My goal is to help the audience understand the image (visuals) immediately, regardless of the viewer’s understanding of art or design. I think that art must be created in such a way that the viewer could memorize and recreate the image (art) even after they have stopped looking at it. To make an image stick in someone’s mind it must be simple in nature, as too much information overwhelms and confuses the viewer. Too much information in an image or design becomes hard to recall and leaves less of an impression. For example, anyone can illustrate (with varying skill levels) the famous, Eiffel Tower without trouble. It is basically a triangle shape that has an arch. Same goes for the X-Wing and Tie-Fighter in Star Wars. The X-Wing is the combination of an X and a stick. The Tie Fighter, a hexagon and a sphere. It wouldn’t be famous and memorable if it was an overly complicated design.
Another reason why we have to provide simplistic scenes is to help players call out where they are. It would be much easier for a player to say “Hey, I’m next to this cylinder thingy” or “Hey, I’m next to this triangle thingy”. Having a simple primitive like a circle, or triangle are relatable shapes to everyone and they should be able to recognize them instinctively. If the scene was overly-complex, the player would have a hard time conveying where he is on the map.
Geometry Contrast
The Beam structure on top makes a visual flow to guide the eye. The circular base (which is the focal point) stops the eye. Diagonal structures on each side of the circular base is used to make transition between beam structure and circular base.
A circular shape is useful for indicating the final destination.
I like to use shapes and lines for specific purposes. I use rectangle shapes to make a continuous flow as a guide on less important areas, then I use circular or any closed shapes on focal points to catch the eye.
Using a series of rectangles is effective because when they’re connected it creates a continuous flow that directs the eye where I want it to go. Circular shapes are useful as a focal point because it catches our attention. Circular shapes are rarely found in the natural world, it immediately stands out among more organic shape like trees, rocks or even animals. So, as soon as we put a circular shape in the scene it creates a shape contrast against the rectangles. I can organize my scene with a series of rectangles in the background and a circular shape on the focal point. That way I don’t get mixed shapes on different areas.
With a limited number of shapes the scene can easily be sorted out visually. People subconsciously understand the importance of the area by looking at the shape. For example, a corridor built with a series of the same repeating columns in a rectangle shape; people would not consider that place as important. Within that place everything looks the same without anything unique that stands out. Instead, people would rather follow columns expecting something important at the end. Then, the important area is determined by seeing a new unique and different shape such as circles or triangles. Using certain shapes as a pattern on less important areas and unique shapes on important areas is very critical and an easy way to help players identify the area.
For this reason, I like using a series of rectangles in the background and circular shapes on focal point. Not only does this make for a more organized scene, but it makes it much easier to identify the important elements.
It isn’t necessarily a design. I only change the scale and depth of the structure based on the importance of areas. Bigger shapes transition into smaller shapes and shallow depth transitions into deeper depth as the eye travels to the center. The intention of scale change is due to perspective. The eye tends to associate smaller details with the focal point.
You can also organize a scene with just one shape but change the scale and depth as the eye travels towards the focal point. This gives us a really unified, clean look. It is a more challenging and interesting approach because it really nothing but a transition with very limited design.
Broad Open Spaces
Due to the simple broad space the top pops out. The top wouldn’t be noticeable if the other area was divided with a lot of texture and detail.
I think the main purpose of the environment is to support the characters. Any overwhelming information would cause a distraction in identifying characters in the environment. It’d be very difficult to read the text in a movie poster or the cover page of a magazine if the background is too strong/busy. Having broad open spaces is the only way to make characters stand out.
Interestingly the lack of broad open space isn’t just an issue in 3D or the game industry particularly. It is widely happening on beginner levels of art. Lots of students in graphic design try to cram in as much information as they can. Amateur car designers divide the car surface in even segments. My guess is that our language is conditioned on focusing only meaningful information rather than a balance of empty and full. For example, you will always hear people say something along the lines of “wow! look at all of the detail!” or “I really like the details!” It is rare to hear someone mention the balance and proportions between rest areas and focused clusters of detail. With this reason, it’s natural to focus only on details when we try to learn something. As we learn further, we realize the importance of the harmony between empty and full.
Regarding environment art, it is fair to say we feel empty when we only look at empty/broad space with no details. Imagine that you’re making “boring” space intentionally to let eye rest and to create contrast with the “fun” space. Working on empty/broad space isn’t a meaningless thing. In fact, it’s necessary to have it in order to create harmony. Without the clean space, the eye would not be able to differentiate what is important from what is not.
Without the simple/clean surface on outside it can’t bring attention to inside.
Limited Resources
90% of this was made using tiling textures. I masked in a grunge layer to create weathering.
I prefer to use tiling textures to expedite the process when I create assets such as pillars, doors, terminals, walls, floors and so on instead of custom textures. You can certainly polish more with detailed worn edges, scratches and weathering in a custom texture but using tiling textures in general give us a lot of advantages.
Having less custom textures reduces the load time, not only because of hi-res textures but as well as mip maps. It could also solves the texture pop-in issues while we’re playing mostly due to calling out random texture files. Also, I’m more excited to have more freedom of iterating assets when I don’t use the custom textures. For example, I can stretch the door to make it wider or the pillars to make it taller as long as I go in and change the UVs accordingly. Lastly, instead of using normal and height map based shading, actual geometry reacts to lighting very well while producing real shadows and ambient occlusion.
Capturing Attention
Intro to the level; I use horizontal shapes in the beginning, then gradually started to use vertical shapes as the player walks towards the door. It’s important to get the shapes to slowly change and interlock with each other to make a natural transition.
After blockout pass is done, I want to discuss the pacing of the gameplay with designers. I plan to manage my shape language accordingly. Horizontal shapes are very helpful in terms of making seamless eye flow. I use walls, pipes and trims in a horizontal orientation where the player need to travel quickly. If I want to have the player’s attention on certain areas I can do the same but in a vertical orientation. With this planned direction, you can more aggressively cope with the pace of the game and it is efficient in terms of execution. The faster you pace, you will be using horizontal shapes with less detailed. If the pace is slow and important, working with more vertical shapes will create a waste-free work.
Shades of Light and Dark
I tried to keep the same visual intensity regardless of the texture. As you see value in gray mode is a similar visual intensity as in the textured version. Simple/broad space remains as a medium value and complex value in the base area,
Value should be determined in the modeling pass, not by the texture because no matter what your lighting setup, you will still have a design that reads well.
The reason we must keep the number of colors low is because the environment isn’t always what we need to focus on, instead characters need to be the focus.Too many colors and strong colors detract from the character’s intensity. By having neutral tones used primarily in an environment regarding value, hue, or saturation, will help characters to stand out.
Due to neutral tone in the texture, lighters can easily override the mood from warm to cool.
With this idea it’s easier to give a freedom to lighters about hue changes and setting the mood. If any primary color already is widely involved in the texture stage,it will be difficult to change the mood by the lighting. That’s why I hugely rely on kind of mid gray tone in most of area then add a few accent color to imply important areas.
I squint my eye to see roughly how much dark value was created in modeling stage. In above both images I kept the ratio of dark and bright area as in 30:70. It doesn’t matter if it’s a human scale prop or large scale architecture.
In addition I’d recommend to adjust the brightness value between major and minor by a ratio of 70:30. What I mean is that have your major space relatively brighter than minor space. I try to manage this bright and dark ratio during modeling stage. Imagine the modeling process is a pencil drawing, we should’ve have a variety of value from bright to dark to create sense of depth. The main tower In this image I was able to get 10~20% dark tone and 10 % of bright area out of 70% mid tone area. I’ve pushed faces inwards to create dark tone on the side. The base is needing to be to pulled out to create a form with pipes and additional detail to make bright and complex value. This kind of value plan is implied when the texture is applied. With that said modeling process is always related with texture plan, they should work together. Avoid random texture assignment without considering similar value in modeling process that could cause cluttered look with random values on surface. Assigning texture isn’t to create new look on top of the model, It supposed to be imply the original value on model.
Bring the Light
One of the campaign level was allowed to have dramatic contrast in lighting.
I understand some concern in player’s perspective about having not enough lit on certain area could trouble in a competitive gameplay. Because someone can be upset off if they can’t see other opponents in dark area and die. Besides that situation, in competitive game play, we can imply the sense of depth in other game modes such as a solo play or co-op. In fact with a contrast in lighting consisting of a dark and bright area, game experience can be more attractive and dramatic. This contrast also helps to tell the player what is important and what is not.
Getting 100% lit in the scene would make games not challenging. It is likely you are being spoiled the ending of the the story. I believe some uncertainness on some area creates mystery that triggers players to explore the world. For example an alley could be in dark with tiny lights on, or some dark characters being lit from backside rather than the front provoke the imagination and imbed a sense of mystery.
Revealing additional information progressly as the player approach to the destination, rather than revealing everything right away is a better way to intrigue players.
In addition, when it comes to the texturing stage, value in scene still needs to be in a certain range. Avoid total darkness or the total brightness in your values. This way you can preserve some room for post processing to adjusting bit toward dark or bright. Another reason we should avoid total darkness or brightness is simply it attracts the eye too strongly. Any extreme value such those in some random area could conflict with the focal point. Even if it’s only a few percent off of absolute black or white we can still get the same feeling without the negative side effects.
How does environment serve the game?
Environments should trigger players to explore the world and give a reward, visually or experientially, when they reach the goal. The game’s journey’s should satisfied me and continuously provide Points of Interest to guide me along. The Point of Interests are so momentous in this game because of most of the environment not as strong as POI that you cannot miss it. The characteristics in chapters are naturally transitioned from one to another and gradually change the mood from peaceful to all the way up a severe atmosphere with snow, storm or thunder. Seeing the end of journey after going through all these trials should be a memorable experience.
The Sci-fi style what I’m doing at current work and journey seem to be different but the simplicity what I’ve always been trying has a lot of connection with it. I wish I could have this kind of simplicity in my work in the future.