Jump to content

Map Editor Turorial - Texturing the Terrain


R4bitF00t

Recommended Posts

logo.png.f23f11b35761d703e4079f020e7b92b2.png

How you texture the terrain is probably the most important visual aspect of the map.
It may not seem like it, but
90% of the time, players look at the empty spaces of the map - the playable area.
Due to the nature of playable area, it should be sparse in visual clutter, but still look interesting - we can achieve that with texturing.

Since textures are such a big part of map feel - I've also included a chapter with some texturing tips.

 

This is where we diverge from the correct order in which you should do things when working on a proper map.
For a fully fledged map, you want to have an
idea and interesting map mechanics first.
Make that map as
bare as possible. Set up the players and enemies, block out the layout with cliffs, and then script the functionality.
Otherwise, you may find that you need to
delete hours of your work, because you made the map pretty, before you made it functional and fun to play.

Because we are gradually exploring the tools available to you, the tutorial continues with how to work with the map visuals.
If you want to get to the functional part of the tutorial, skip to the Scripting topics.

 

Just remember - function first, make it pretty later.

 

If you encounter any issues, don't hesitate to ask in Skylords Reborn Map Making Discord.

 

 Content
splitter.png.c6bb999c2670ba4c136ee150dced1030.png

  • Texture Tool
    • Working with Layers
    • Layer Setup
    • Texturing
  • Texturing Pointers
    • Base Layer
    • Gradients
    • Borders
  • Next Chapter

 

 Texture Tool
splitter.png.c6bb999c2670ba4c136ee150dced1030.png

Let's have a quick look at the Texture Tool window.

It is split into 3 areas.

  • Area 1 is the Layer Setup area
  • Area 2 is the Texture Atlas
  • Area 3 is the Brush Settings
  • If you don't see area 2 you need to press the Arrow Button (4) on the right of the window

image(11).thumb.jpg.2ec92f71186660228c08f90e9c77b5de.jpg

 

• Working with Layers

The game uses Layers made up of different textures that you can apply to the terrain. If you are familiar with photoshop, you will understand this from the get go.

The basic premise is that the layers at the top of the list are drawn over all the layers that are below them in the list, creating a hierarchy.
The
layers don't interact with one another, they are stacked on top of one another.

You set up these layers in the Layer Area (1) with the components (textures) found in the Texture Atlas (2).

We can create a new layer with the New button and copy it with the Duplicate button.

There are also buttons to Load and Save a layer setup as a Prefab.
When you create a layer setup you like, you can
save it and then load it into another map to save yourself some time.

The rest of the buttons are self-explanatory.

When you find that you need to rearrange the layers, you can click a layer and drag it above/below another layer to change the hierarchy.

image.png.826a1eec83bdd0e994b3a57d084403c4.png   image.png.b81d83e27a25e5fe817c177b24ceb3ee.png

 

To ease our work even more, at the top of the layer area there are some useful buttons.

  • Load Layer Set - will load a preset of layers
    there are default layer setups for the greenland, frostland and wasteland layer sets
  • Save Layer Set - will save your current layers into a layer set
    you can load the layer set into another map to get access to the same layers as they were set up

With these buttons, you can get quickly up to speed by loading a previously used layer set you liked.

 

The Export and Import buttons are used to export the textures as they are painted on the map itself - meaning you can save the painted map and paste the textures as they were onto another map.
You will probably never use this functionality.

 

• Layer Setup

Each layer is made up of several textures from the texture atlas.

One from each category:

  • Color - determines what the texture looks like
  • Blending - determines how the texture will blend when painted
    Essentially what border it will create, NOT how it will blend into other textures
  • Normal - determines the 3D effect of the texture, it's highlights and shadows, so it doesn't look so flat
  • Specular - determines shininess
    High specular means the texture will be very shiny - look metal-like, low specular textures will not shine and will look more dirt or grass-like

image.png.4887beb83695a1cc91603582bb0def14.png

The only required texture is the Color texture.

With a layer selected in the layer hierarchy, you can pick whichever combination of textures you like from the texture atlas to create your unique layer.

Color, Blending and Normal textures have the highest visual impact on the layer.

You can usually get away with the default Specular texture.

 

Buttons at the bottom of the texture atlas are not important for working with textures.

 

• Texturing

When you think you have set up a layer that you like, it's time to try it out and paint it on the map.

There are two modes in which you can paint your layers - Texturize and Texturize additively.
In either mode:

  • Paint the texture onto the terrain with Left Mouse Button
  • Erase the texture from the terrain with Right Mouse Button

 

In Texturize mode, you will paint and erase the texture INSTANTLY to the Opacity set in the brush settings.

In Texturize additively mode, you will paint and erase the texture GRADUALLY by the Opacity set in the brush settings.

image.png.0d5aa35f8b37607fa5b01ad463cb347f.png

Quote

Note: You may have noticed the Blend Factor slider at the top of brush settings.

This slider affects how much the textures on the map blend GLOBALLY - too low and too high values may result in a weird texture blending. So far, I haven't encountered a single instance where I would need to adjust this slider.

 

I have created a layer from these textures to demonstrate.

image.png.dbf91f5cf8ac56bb8663b9992ff12308.png   image.png.8e07a59ba92857d53a88b34be15b3b03.pngimage.png.2ef5380e767f235dc7c6a0dbbe60ce6b.png   image.png.02154795cbb2d069268f183c9b352abc.png

With the Texturize mode, I painted this beautiful piece of land.

image(12).thumb.jpg.1dfbb1add83b667187da7da90d9a5319.jpg

The Color texture I set means the texture is green.

The Blending texture I chose creates that interesting blend (border) at the edge of the painted texture.

 

image(25).jpg.f1e6a6ec6da6d919ee33f0163e7d8f3f.jpg

And the Normal texture is what creates the effect of 3D cracks in the texture.

 

image(24).jpg.f14bdcefbbb43df72ea9bcdcdff33c9a.jpg

 

If I were to paint the layer with a lower opacity - in this case, because of the Blending texture - the cracks in the grass would gradually disappear the lower I set the opacity.

 

image(23).jpg.531907934d827c2506d1de89187309d3.jpg

 

By now you might feel a bit confused by the Texture tool, it is one of the more complex tools in the editor after all.
Play around with different layer setups and with how the different painting modes work, and you will get the hang of it in no time.

 

 Texturing Pointers
splitter.png.c6bb999c2670ba4c136ee150dced1030.png

I also want to include some advice about texturing.
I'm not the definitive authority on this, I am still learning more tricks and what makes a nice looking map. So don't take these tips as etched in stone. Experiment on your own and find something that works for you.

You can learn a lot and gain a better feel for the original developers' work, simply by analysing the campaign map's visuals.
Just get in game, play the map and then pause in the replay. Explore and analyze what the original devs did and why.

As a general rule, though, simplicity seems to be the king when it comes to BattleForge map art.

Quote

Note: As you work with textures, there might come a point where you have no idea which layers are painted on a given terrain.
You can get a quick overview by enabling Debug -> Layers Under Cursor and then also ticking Enable Debug in the same list.

This will turn on an indicator in the top-left, that has an overview of all the layers used on the terrain your mouse cursor is over.

image.png   image (61).jpg

 

• Base Layer

The bottommost layer in the layer hierarchy is the base layer. This layer is automatically applied over the whole map.
Naturally, using it well can save you a lot of time when texturing, but there are some things you should do.

If you want it to cover most of the map - the base layer should have a Color texture that doesn't have any major details - look at the greenland grasses or dirts to see what I mean. They are almost singular color with only very minor details and contrast.

The Normal texture of the base layer should be something very decent - almost flat.

image.png.f357262da80117ee871499791711c7b1.png   image.png.69fb577d4f61ff3cbf116b40e6ec5f07.png

You might be wondering why would I make the base texture essentially as boring as possible.
Well, that's because you want the
playable area to be as clear as possible. Including large contrast or a lot of details in the texture that is all over your map, means the players' eyes are constantly bombarded by information about detail - leading to visual fatigue and generally unappealing maps.

Just look at the difference between these two images. You cannot really grasp the difference, until you see these textures over the entirety of your map.

This principle can be generally applied to any layer that you want to use on larger playable areas. Apply high-detail layers with care.

image(13).thumb.jpg.61ceb43586812a47958d811b6d88958c.jpgimage(14).thumb.jpg.30120ce55eb4fbbee0f27e61617e669c.jpg

Note: I know everything visual is highly subjective, but trust me - having large areas of detailed textures with strong normal textures will not feel appealing to a lot of players.

 

   

If you want your maps to feel truly BattleForge-like. There are two general principles that the original devs seemed to go by.

I will name these principles Gradients and Borders.

 

• Gradients

Gradients are used to break up the monotony of larger spaces, that use a single texture.

What you do, is create an underlying layer - let's say smooth grass.
Then you create a new layer above that underlying layer - with the Color texture of a slightly different color than the underlying layer.
Let's call the underlying layer the
Basic Layer (not to be confused with the Base Layer) and that second layer on top the Gradient Layer.

The Normal texture of the Gradient Layer is generally the same as the Basic Layer.

Blending texture of the Gradient Layer would be the greenland 000 blending texture.

image.png.b4da0ca55b89ff6b4a6c81b7669d12bc.png

An example of two textures with suitably different colors - greenland 004b and greenland 001.

image.png.82d59f37f81a39b0e4941dbd4e818339.png   image.png.44265dd2adc93e80bfa0c77218fd8684.png

You then Texturize the Gradient Layer on top of the Basic Layer with different Opacities, creating a linear blend from the Basic Layer to the Gradient Layer.
You don't have to go from 0% to 100% Opacity, I usually paint about 20% opacity area, and inside I paint a smaller area of about 30-50% opacity.

 

When you combine the gradient principle with the height tool to deform the terrain, you will get a result that is much more visually interesting than a flat plane of one color - while keeping the playable area clean.

Note: When you deform the terrain based on the color of the texture, it can create more pronounced ridges and valleys.

image(16).thumb.jpg.e1cb1b261c28281db7ce7a5c0075f2f0.jpg

Add some cliffs, smaller 3D details with rougher textures around them and within a couple of minutes, you can have an interesting little scene.

image(18).thumb.jpg.9f9526b441a5ae9781934347ec216603.jpg

 

• Borders

Borders is how the original devs eased a transition between two textures.

The easiest example can be seen, when we want to add a road to our little scene.

Pick a Color texture, choose a nice Blending texture (usually one that has smaller blend area) and paint the road. While there is not much wrong with this, and you can get away with it, the transition between the grass and the dirt feels kind of flat.

image(19).thumb.jpg.928f8376d56487d8faa845cc3f38ff34.jpg

Well, let's fix that.
We can
duplicate the dirt texture - that way we'll have it set up exactly the same.

Now we just choose a different Normal texture, that will have some more roughness to it, and we apply it at the edge of our dirt road.

Quote

Note: I have broken up some of the straight edges with Texturize Additively option.   

image(20).thumb.jpg.15a6e35b503a2ad2818efc7c23a1fa86.jpg

As you can see, the dirt road now looks more interesting, believable and BF-like.

Quote

Note: Notice how I've also texturized a rougher texture around the grass and stone models.
You can also use borders around your 3D objects, when the object is just put on the ground, it feels out of place. Texturing a little border around it will fit it much better into the surrounding environment. 


image(21).jpg.4e087eb1fdd8461f9a775b60a2df9f93.jpg   image(22).jpg.842ac8ab4862a0f68e8f0c564f102398.jpg

If we wanted to impove the scene, we could add some more 3D details. And definitely some textures along the cliff's upper and lower borders. But you can do that on your own.

Quote

Note: Original BF map art usually puts a lot of 3D detail at the edge of the playable area and leaves the center of it fairly empty. This is again to keep the playable area as clean as possible. But it is also what gives the maps that BF feel.

 

 Next Chapter
splitter.png.c6bb999c2670ba4c136ee150dced1030.png

This concludes the visual side of the tutorial. Now we will get to making our maps functional with scripts.
For that, we will first need to set up a script editor.

 

Script Editors •

 

Alternatively, there are some extra topics about working with the map that are not that important, but can be very useful. You can find them back on the Map Editor Tutorial homepage.

 

• Map Editor Tutorial •

 

Middle_splitter.png.14867f8f70731a56861e7cc2e99c738d.png

Edited by R4bitF00t
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. Terms of Use