The Dark Ages - from Concept TO cREATION

Experience the moody vibes created by Alex Mannion in his latest environment. In this article he talks about composition, modular building, and creating materials within UE4, followed by a step-by-step breakdown of his process.

Introduction

I’m Alex Mannion, a third-year Game Art & Animation major at Champlain College. I grew up in Oneonta, NY, a small town with not a lot going on. As a result, I spent a lot of time playing video games and messing around with computers growing up. Some of my favourite games as a kid were Roblox, Team Fortress 2, Minecraft and Chivalry: Medieval Warfare. In the midst of my college search, out of sheer desperation to find a major that seemed like something I could possibly do for 4 years, I decided that 3D modelling sounded cool and was basically the only option for me. Although it wasn’t something I had a ton of experience in, it appeared to be a growing field with a lot of new and interesting applications. While the prospect of modelling architecture and 3D printing things that I create sounded pretty great, what I was really interested in was game development.

Now a little more than 2 years after starting school at Champlain, I’ve become intimately familiar with 3D art, and recently created the piece The Dark Ages, which was based heavily on a concept entitled Dark Ages by Vladimir Manyukhin. This was created for the class Advanced Seminar in Game Environments, taught by the amazing Vince Joyal. I’ll be going in-depth on my workflow for the project; more specifically I’ll talk about finding modularity within medieval architecture, working from a concept, making master materials and using instancing within UE4, creating materials using Substance Designer, and entering the world of 3D art with no artistic experience.

Composition

I will start by talking about how I composed this image. On the surface, it’s pretty simple. I saw a concept I thought looked awesome, could be expanded upon, and looked fun to reproduce. Dark Ages by Vladimir Manyukhin was perfect for me. As someone who is new to art in general, it felt satisfying having such a strong base to work off of, but also intimidating working from a concept as well received as his, with such a large reputation to live up to.

For fellow beginners, I highly recommend finding one *pre-existing* concept art to follow heavily. There’s a lot of great stuff out there, but the best stuff to move into the third-dimension (in my opinion) are the images that can be broken up into sections, divided into modules, then pieced together to form something that would, at first glance, seem jaw-droppingly intricate and eye-catching. This not only demonstrates a strong understanding of modularity, but it cuts time in a major way, and will help you make more from less.

As for what I added to the scene and why; I’ve included the draw-over below. Things that are highlighted are some of my favourite additions/changes I made from the original concept.

Crates and Barrels

I made 1 type of crate, and 1 type of barrel, both using my wood material I created for the actual buildings. For more intricate props, you’d want to bring them into Substance Painter, but I was able to not only reuse 1 material and avoid Painter altogether, but I was able to reuse these 2 props all over my scene. Slightly adjusting scale and rotation of these objects was enough to keep the same exact objects from feeling overly repetitive.

Overhang

Suggested by my instructor, the overhang was accomplished by taking an 8 meter tall post, moving a single edge out so that the overhanging side was angled by about 5 degrees. I assigned my stucco material, and moved the angled post beside my brick wall. I then put a cap segment (the thicker wooden plank) next to the angled post, and copied the front facing wall, rotated it, tilted it, and bam! Overhang. I also added a floor of course, which is the same mesh as the cap, just rotated 90 degrees. I also made supports for the overhang, but ended up using them all over the scene. The rock corners that are highlighted in blue were used to obscure the angled piece, but more importantly to break up silhouette, and repetivity.

Scaffolds

While a massive scaffold was included in the original concept, I thought it’d be cool to put those pieces all over the place. Vince inspired me to copy the structure and move it around, which I did, but I then made some additional changes to give the individual scaffolds their own individuality (while still using the same pieces of course).

Well

While the stone wall edges helped to break up the silhouette of the mid-ground, I felt it needed something more. This was really the first big step I took outside of Manyukhin’s concept, and the one that got me to feel comfortable making changes. I slapped a noise filter on a hollowed out cylinder in 3DS Max, then applied my stone texture. The roof of the well is the same roof that’s on the building to the right of it, just scaled and with some added individual shingles to give it a more man-made feeling.

Flags

At the start of the project, I used the cinematic camera in UE4 to divide the scene into a 3x3 grid. When I added the flags, I looked at the grid and felt that there was really nothing breaking up the middle ⅓ of the image. I’d learned that when in doubt, add rope/wires to break up space/lead eyes, so that’s exactly what I did. They ended up doing a really good job separating the front, middle and background. They also lead your eye from building to building, which was an added bonus! If you saw my progress screenshot, you’ll realise that for a while, the ropes didn’t have flags. That’s because I was of the impression that flags were kind of overused in medieval scenes, but when I tried them out, they just felt so right!

Background Buildings

These buildings were added on a whim at around the same time I added the well, and it was made out of entirely pre-made pieces. I just stuck them together, applied different material instances (only in a few cases), and then made subtle adjustments over time. They were made more-so to demonstrate the modularity of my scene than anything else, but they ended up being a crucial part of the composition, and framed the background rather well. Another added bonus!

Weather-vanes

Weather-vanes were some of the last things that I added. They’re a minor detail, but they helped breakup the sky.

Modularity

A pillar of game environments is modularity. You have to plan ahead, so that your assets can be reused in order to make big scenes with reusable pieces. I created assets so that they fit within the dimensions of the planes shown below.

This allowed me to create new buildings without having to make more assets. Not only does this save on production time, but it saves on performance. Instancing meshes is cheaper on performance than having to render new ones. If the mesh is already in the engine’s memory, rendering a copy of it would be quicker and less intensive on the player’s PC. This is an image from my Artstation post which shows a vast majority of the modular assets I used in my scene. In the background you can see entirely new buildings created quickly within engine, using only assets I created for my original scene.

Procedural Materials & VFX

Thankfully, at the same time as I was taking Advanced Seminar in Game Environments, I was taking a class involving the development of procedural materials in Substance Designer, with instructor Scott Johnston. I’d had about 3 hours of instruction in Substance Designer before-hand, and had a really loose grasp of it, but I knew I’d love it in time.

During our first assignment in that class, I decided that for our final environment, I’d try to texture my scene entirely in Substance Designer, and with the exception of the red banner in the background, I accomplished this. I made an exception for the banner because I thought it needed some sort of symbol, which would have been a waste of time to make in Designer, and Substance Painter had some good grunge generators. I just used a red base colour, a leaf brush, and some dirt generators/masks.

I ended up using a total of 7 materials, all with some variants for vertex painting. These materials were; Mud/Grass (same graph), Stucco, Slate Roofing, Brick/Stone (same graph), Metal, Glass, and Wood. These materials were all set up as master materials, vertex painting was also kept in mind, and used pretty frequently. I used instancing on objects that were further in the background, or ones that just didn’t require vertex painting. A specific example of instancing was reusing my main wood material for the shutters. I used the Flatten Normal node to lower the normal intensity, and attached an overlay_blend node, with a ConstantVector4 exposed to the Base Colour, coupled with an Add node. It was pretty fun just being able to change so much about the material in-engine, and it was also a major time saver.

A crucial part of my scene is the smoke VFX, which was an element suggested by my instructor Vince Joyal. Having less than 2 weeks remaining until submission at the time of the suggestion, I didn’t have time to learn how to create new VFX inside of UE4’s editor without guidance. So, I instead used the smoke VFX in UE4’s Starter Content as a base, and configured all of the emitter properties to create something more unique and interesting for my scene. This process took me an hour or 2, and involved loads of trial and error until I got the smoke looking decent. The most important things I needed to adjust were the Constant Acceleration and the Initial Velocity. This allowed me to get the smoke blowing really aggressively.

A Quick Step-by-Step

The making of this scene took about 8 weeks, and around 200ish hours. Keep in mind, I was learning 3DS Max and Substance Designer throughout the project. I’ll briefly describe some of the larger strides I took throughout this project.

Week 1 - Blockout

Seeing as no one in my class had blocked out a UE4 scene before, and we started the assignment over a break, we were all really confused. I’m not sure if it was genuine confusion, or if we were really just intimidated by the scope of the project, but either way we didn’t want to start off on the wrong foot. I’m the type of person to do some research, but when I can’t find what I’m looking for, I just say screw it, we’ll just try stuff and hope it works.

I made some really basic assets. I created panels that follow my modularity scale, which means that I had 1x1, 2x2, 4x4 planes and triangles at the start. I broke my reference image into a 3x3 grid, and then used a cinematic camera positioned at the same angle as my reference, so that I could compare the two as I work on my blockout. As you can see above, I started out with really simple shapes, and didn’t try to define any of the more complex shapes. This was so that I could replace my simple meshes with the new, more detailed ones I create. 

*Important* In order to avoid wonky perspective within my scene, I made some minor adjustments to the concept to keep my buildings together, and not floating off in the distance. I highly recommend this, as it gave my scene more individuality, helped me break free of the concept, and now I can walk around my scene, which is a pretty cool experience.

Week 4 - “Finishing” Modelling

The task I was given for the end of week 4 was to finish modelling, but accept that I might want to remodel/model more during the finishing stages of the assignment. While I did eventually go back and model some more smaller modular props, and I remade the stone wall on the bottom left of the image, at the time, I had achieved my goal.

The largest change going forward was how the mood is achieved. In the original concept everything was gloomy and dark, and I wasn’t sure how to replicate that feeling in the same way within UE4. Many areas were obscured in shadow, and while there was suggestion, the viewer was still left to wonder what’s going on in the shadows. I decided to take the liberty to expose it, and make the scene feel lived in, even without characters.

As you can likely tell, in week 4 I had a post-processing volume, fog and not much in the way of lighting. I’d overcompensated, and this was the point when I realised I pushed the dark, blue and moody thing too far, and needed to completely reassess. I wanted to get the general vibe of the main concept, but in a different way, so I decided to take out the rain from the original concept, and imagine the scene after the rain. This gave me freedom to light the areas in the foreground, use creative freedom to fill them, and it gave me the willingness to experiment more. At this point I’d already deviated a fair bit from the concept, but there was more to come.

I decided the foreground needed some more interesting elements, so I added some crates and planks just lying around. I’d already made barrels, so I just spread them around some more. In the coming weeks, the scene was finally starting to get broken in.

Week 6 - “Finishing” Texturing

By the end of week 6 I was supposed to have all of my textures created and assigned. While of course improvements were bound to happen, I decided I should have material IDs and materials sorted at this point. At this point I had all of my materials created except for my metal. Everything had UV’s, light-maps and material ID’s, with the exception of the castle.

I still hadn’t completely figured out lighting, although I had begun placing spotlights and point-lights around to light the scene with more control. Previously I’d only had a single directional light, so the addition of the row of spotlights down the main path, and point-lights from inside the houses are showing off a lot more detail than before, but it’s still not enough. In the coming weeks I got rid of the emissive window material (as seen on the right), and replaced it with small, not very detailed interiors that could be lit and display more light and detail than the emissive could.

By the end of the week, I’d leaned away from the blue lighting, and wanted everything to be desaturated, but still feel alive. I decided I needed some foliage to break up all of the yellow, blues and browns, but I also sensed that the lighting was still missing something. So that’s when I decided to up the gamma and exposure, and play around with fog.

Week 8 - Wrapping it up

So in the final weeks, I really didn’t do that much that stuck. It was a lot of trial and error, looking at references, and revisiting old meshes and materials. A lot of this was due to the realisation of things I mentioned prior, about capturing a dreary, gloomy feeling from an environment that still feels alive and lived in. It took a while to realise what feeling I was searching for from this image, but once I found it, everything else clicked.

I did 2 things of note in the final week that I believe are worth talking about in-depth. The first, is adding fake volumetric fog planes. Click here for a link to the guide I followed to create this effect. I used the guide as a base, but went a step further and used masks so that I could blend fog more seamlessly. The graph for creating my masked version is below. The texture sample you see could be exposed to use different masks with instances, but I only relied on a very simple bell-shaped mask I exported as an alpha from Substance Designer. This helped me get a really nice depth fog effect that I wouldn’t have been able to achieve otherwise. I was also able to share this with some of my other classmates which was definitely an added bonus.

The second, is making decal generators. I used Substance Designer to create procedural puddles, cracks and grime, which helped me greatly in breaking up the repetition of using the same decals over and over again. I saved out 2 to 3 variations of each of these, and used them all over the place. Shown below is my puddle graph.

The result normally looks something like this:

All I had to do was adjust the random seed and it changed the disorder of the 2 noises I used, creating unique puddle variants. I also altered the starting shape for increased variation at times. I put these puddles all over, and paired with reflection captures, they helped tremendously with bringing new light and colour into areas that were previously uninteresting.

Conclusion

My final piece of advice might seem basic, but it’s important to address. When publishing art, or putting it in your portfolio, make 100% certain that it looks good to you. While I’ll look back at The Dark Ages for ages, always being able to find flaws in it, I posted it without any major aches and pains. If the piece doesn’t feel right to you, ask for critique, gain new perspective, try it out and see what sticks. The more you practice and the more perspectives you take into account, the more your artist mind will develop and grow with inspiration, creativity and self-assurance. It’s because of the people I sought out for help along the way, and the leaps of faith I took, that I was able to make something I’m satisfied to call finished.

Thanks to all the people who helped me along the way, and contributed to my getting to this point, and a big thanks to Experience Points for giving me the honour of writing an article for them!