使用Total Textures创建次时代环境贴图

‘Creating Next-Gen Environment Textures using Total Textures’

使用Total Textures创建次时代环境贴图

by Daniel Vijoi, Lead Texture Artist – AMC Studio

作者: Daniel Vijoi
翻译: AboutCG 会员


Programs Used: 使用软件:

Maya & Photoshop

Introduction: 介绍:

Hello, my name is Daniel Vijoi and I have been working in the gaming industry for 7 years. My current job is Lead Texture Artist at AMC Studio, a Romanian game development company based in Bucharest. During this time I have worked on many projects, like Test Drive Unlimited (Atari), Mercenaries 2, Saboteur (Pandemic Studios/EA), Pure (Blackrock Studios/DISNEY), Rise of Nations & Rise of Legends (Big Huge Games/THQ), and other exciting titles yet to be announced.
大家好,我叫Daniel Vijoi,我在游戏业已经工作7年了。现在我在AMC Studio担任首席纹理贴图艺术家。是一家在罗马利亚首都布加勒斯特的游戏公司,在此期间,我参与过很多的项目。如Test Drive Unlimited (Atari), Mercenaries 2, Saboteur (Pandemic Studios/EA), Pure (Blackrock Studios/DISNEY), Rise of Nations & Rise of Legends (Big Huge Games/THQ),以及其他的已经发布过的游戏。
I decided to write this tutorial as I noticed a certain lack of interest for game-related environmental texturing in the 3D community. This tutorial is targeted at medium level users and will present the process of texturing a photorealistic building that has already been modelled. I will focus on the texturing process in particular, even though the modelling and UVs are also important for the final look of the building.
Getting Started:开始: ________________________________________

For this tutorial, I used the 3DTotal Texture DVDs, a large libra ry of diverse textures that we here at AMC Studio use regularly. At the end you will find a list of all the specific 3D Total Textures I have used for each texture that I have created. Some of the images included in this tutorial also mention which textures were used.
在这个教学里我使用了3DTotal Texture DVDs里面的纹理,这是一套现在AMC Studio也在使用的种类丰富的纹理库。在本教学的最后你会发现使用了3D Total Textures里的纹理列表,一些在本教学重包含的纹理也会提到哪些部分被使用到了。
Usually, it is preferable that one artist does the entire process of modelling and texturing, as usually these processes are interlinked, so optimising the geometry will make changes to the texturing, and vice-versa. This is why I will also mention some of the means by which the geometry and UV have to be optimised to keep the textures needed to a minimum, whilst also adding extra details and personality to the asset.
The majority of game assets start their life as a concept art and some reference images that will help to better define the character of the building. For this tutorial I used the following concept art and reference photos (Fig.01 – 02). The subject of the concept is a desert building, inspired by the settlements on Tatooine and typical real-life Tunisian buildings. I also included some extra sci-fi details to make it more interesting. The desert environment will influence the chromatic variation of the textures as well as their detail, as far as weather influence on materials goes. Being a multi-purposed building, details vary; there is a generator in the tower and the back side of the building can be used as a market stall to sell different things.
游戏项目首先是从一些概念设计和参考图片开始的,这些可以帮我们更好的定义建筑的特征。在这个教学里我使用了下面所示的概念设计和参考图片 (Fig.01 – 02).这张概念设计的主题是一幢沙漠里的建筑,灵感主要来自于塔图因的居民建筑和典型的突尼斯建筑。我也添加了一些科幻的元素来让他们看起来更有趣些,只要气候影响到了材质的变化,沙漠的环境会影响到纹理颜色的变化,其细节也一样。为了表现出多功能的建筑和细节变化:在塔里面设计有发电机,在建筑的后面设计一个出售各种东西的杂货铺。





With the help of the concept and reference pictures, I modelled the low polygon geometry. The model has 2500 polygons, well under the 2700 polygon budget set initially. This will allow me to add further cuts in the geometry to optimise texture usage later on in the process. Here’s a screenshot of the building geometry from two different angles (Fig.03).



Here you can see the same geometry with the UVs unwrapped (Fig.04). The checker texture was added to make sure all the UV shells are proportional and that there are no areas with deformed UVs.



Before texturing, a quick drawn texture layout would be in order (Fig.05). This can be done either in Photoshop or on paper. This makes the texturing a lot easier if the layout part is sorted out beforehand. Because this process is rather quick, I usually sketch a couple of versions before I decide which the best one to use is. First of all, the entire geometry has to be measured properly so that the UV layout is as compact as possible, with as little unused space as possible. Large areas on the geometry will take up more space on the UVs than small areas. In this case, I chose the keep the texture resolution at 128 pixels per metre. This will allow me to keep all the UVs in proportion with each other and also figure out how much space every detail on the building will take on the texture. Having all the parts at the same resolution will ensure that no area of the building will appear to be blurrier than another.



Because this is a photorealistic building, the textures have to be chosen carefully so that they do not contain any artefacts due to compression. The artist has to closely follow the colour provided in the concept art or, as is the case here, the reference photos if the concept art is not collared. This particular building is part of a desert environment, so the tone of the textures has to match the desert climate.
When choosing the base textures, the most important things to follow are the material details, as the colours can always be modified later. Another good idea would be to choose textures that have a lot of colour variation, as this colour variation will add a lot of personality to the building.
Here’s how the wall texture for the basic shape of the building was made (Fig.06). The top image is the original texture while the lower one is the result after tweaking the colours with Colour Adjustment and a bit of Unsharp Mask.



The next image shows how I added different colour tones and a layer of paint to the existing wall (Fig.07). The easiest way is to select the necessary details with Colour Range and add them to our PSD. I use this method a lot.



Next up I used a mask (top frame) to add some details from a texture (middle frame) to our map. The result can be seen in the lower frame (Fig.08). The blending mode for that layer will be Normal. This will ensure that the newly created layer will not modify the original texture’s colour.



Most of the details can be added in this manner by using masks or Colour Range to isolate desirable details from one texture and add them to our own. The final colour can always be modified using Replace Colour if needed.
One very important thing to take into consideration is the texture resolution. The artist must always be careful when scaling the source textures to keep both the natural scale of the details while at the same time ensuring that particular details will not be sharper or blurrier than the rest of the texture.

Another thing to consider is the management of the PSD files. This will help obtain the maximum texture quality but also decrease execution time when working on a tight schedule. All layers should be named and organised in groups to make sure all the details are easy to find in case they are needed. I try to keep the layers on Normal as much as possible to make sure I keep as much detail from the original texture while avoiding colour deviation and artefacts caused by using other blending modes like Hard Light or Overlay. If these blending modes are necessary, it is very important to keep the resulting texture as photorealistic as possible. Soft light seems to be a blending mode suitable for accentuating highlights, shadows, bevels, etc.
另一件需要考虑的事情就是PSD文件的组织。这将帮助我们获得最高质量的纹理以及提高工作效率,尤其是在时间紧凑的情况下。所有的图层都需要命名,并且分组放好,这样可以保证所有的细节都可以在需要的时候快速的找到。我试着尽量让图层都是正常的混合模式,以确保从原始纹理贴图获得的细节没有颜色的丢失和人工痕迹,比如使用了Hard Light or Overlay.的图层混合模式。如果这些混合模式是必须的,那么他对尽量保持最终贴图效果的真实性有很大的作用,Soft light这种混合模式看起来是一种比较适合用来混合高光、阴影、斜面等等

Here is one example that follows the above mentioned (Fig.09).



This next picture shows the final wall texture with a bit of saturation added to it (Fig.10).



The two Photoshop guidelines mark the lines that define how the texture is tiled. I needed to make the texture tileable on these lines as the wall is 5.5 metres tall, but I only had 4 metres’ worth of texture to work with. The result is that I had to cut the geometry at 3 metres in height and tile the image at that height to increase the usable surface area. This technique is very useful when texturing a high building, but you also need to have dripping details at the top and dirt like details at and bottom of the texture. So basically, the middle part (between the guidelines) can be tiled to cover as much space on the geometry as needed, whilst keeping the top and bottom unique.
Here is the same texture applied to the geometry (Fig.11).



With this texture, not only does it tile with itself, but also with another texture used for the back of the building. This second texture has been created by using this one as a base and adding some masked details to make it unique (Fig.12).



Here are some further tiled texture examples, this time from assets that are not related to this one (Fig.13 – 14).
这里有更多的纹理平铺的例子,但这些并不是本次教学的例子的东西(Fig.13 – 14).

1107_tid_14_Tower-wall-texture 1107_tid_15_Roof-metal


The same method has been applied when doing the tower wall seen (Fig.14). To make the tile harder to spot, I reduced the detail of the texture by making the bricks look more alike in colour and intensity. Using some masks from the previous texture, I have saved some time when adding dirt at the base of the tower and dripping details at the top. Afterwards, I have used Colour Range to select some painted areas from the base wall texture and add them on top of the tower wall texture for added variation. It is often a good idea to use common or similar details for all the textures of the same asset to add unity to the texture and make them fit together better.
After adding these details, I copied a row of stones from the top part of the tileable area and blended it in with the lower part. This will make the texture blend in seamlessly. Usually, making the textures tileable should be kept for last to save time. Also note that the texture tiles vertically to span the height of the tower, but also tiles horizontally to make it easier to map it on the circumference of it (Fig.15).



The above image contains a step by step description of the way the roof texture was created. First I added contrast and colour to the texture by duplicating the layer and setting the blending mode to Multiply. I then used Colour Range to select some of the red paint and increase its intensity. Finally, I added some rust, paint chips and metallic details to make the texture stand out.
Next up is how I extracted the dripping details form a concrete texture to be used for the roof as well as other elements of the building (Fig.16).



Now, moving on to some of the details, we’ll first take a look at the entrance door (Fig.17). It is important to remember that keeping the PSD files organised and with as few layers and special blending modes as possible will avoid making the final texture look too cluttered. One layer for each detail type should be enough: rust, chipped paint, scratches, dirt, text, etc. A good idea would be to keep volumetric details as separate layers to make them easier to convert to a normal map later on.



The following image shows how the wood texture was created. When details with clearly defined vertical or horizontal lines are concerned, the first thing to do is make sure they are lined up properly. This will make the tiling process easier (Fig.18).



Optimising the workflow means that it would be a good idea to keep some textures or elements of the textures in a “library” organised by category – dirt, stains, rust, etc. This will make them easier to find when needed. At the same time, the most interesting elements of the already created textures can be used either for the same asset or for other assets to save time if necessary.
One last detailed area I’d like to point out is the pipes. Here is the creation process detailed (Fig.19).



To summarise, only a few Photoshop tools are used when creating textures – tools like Colour Range, Replace Colour or Healing Brush. It is important to keep the number of layers to a minimum and use blending modes as little as possible. Always keep the resolution consistent throughout the textures. Don’t forget to keep volumetric details as separate layers to make it easier to create the normal map and specular map later. All the time saved from keeping the workflow as organised as possible will give you more time to fine-tune the texture or add details to areas that you might have neglected.
Fig.20 shows the final version of the first map, with all the tiling areas. I set my target at using two 1024×1024 textures and one 512×256 alpha texture. Even with the budget restrictions, this should never be an impediment in adding as much details as possible. Adding more details on the tileable textures is always better than adding less when trying to minimise visible tiling areas.



This is the second diffuse texture, with the tiling areas also marked out (Fig.21).



The next major step to be taken is creating the normal map. First thing to do is create a height map from the diffuse map we already created. This is by no means realised by just de-saturating the colour texture and running a filter; there is more to it than that. A close study of the volumes defined by the colour texture is necessary. We start by isolating large volumes like door frames, window frames and large grills. Finer details like wood fibre, rust, or chipped paint, which do not have a lot of volume associated to them, should be kept separate so that they do not compete with the large details when converting the height map to normal map. Doing so will result in a final texture that is unnatural and cartoony.
Here’s how the height map looks (Fig.22). Basically it’s a greyscale map that defines the depth of each detail. Contrast is very important as it is the element that will add depth to the resulting normal map.



This is how the resulting normal map looks after using the nVidia Normal Map Filter on the previously created height map (Fig.23). You can also use Crazybump or Xnormal for the same purpose. This normal map can be further enhanced in Photoshop before being used. If some details need to be more pronounced, they can be duplicated on the normal map and the resulting layer can be set to Overlay. This will increase the depth of that area.
这是对前面的创建的高度贴图使用了nVidia Normal Map滤镜所创建的法线贴图(Fig.23).你也可使用Crazybump和Xnormal这两个软件来获得相同的结果,法线贴图在使用之前需要在Photoshop里面优化一下。如果有些区域的法线贴图需要强化,那么可以复制这个区域的法线贴图,然后把复制出来的法线贴图的混合模式改成Overlay.。这样就会增加这块区域的深度。



The same method has been used for the second texture. Here is the height map and the normal map for that texture in one image (Fig.24).



For some areas I have also added normal map details that were not taken from the diffuse map. Here are a few such details that have been added to the previous normal maps with Overlay to add variation to them (Fig.25).



Finally, the specular map! The specular map’s basic role is to dictate how much light is reflected off a surface. Materials like wood, brick or concrete will have lower specular values, while glass, metals and other metals have higher values. The same as with the normal map, the specular map requires careful examination of the surfaces involved to guarantee proper results. Some 3D engines might use a greyscale specular map, others a coloured one.
In the following images, the bright areas represent the windows with some dark areas for the parts that are dirty. The metal surfaces have brighter values with dark areas for rust and brighter areas for shiny details. The darkest values are for the bricks, concrete and wood. Of course, if the wood is painted, its specular value will be higher – same goes for wet or polished bricks. Another rule would be that older surfaces tend to reflect less light than new surfaces as they are affected by dirt, dust and/or rust, all of which have very low specular values.
In general, the specular map will have more contrast than the diffuse colour it has been generated from.
Here is how the specular maps look in this case (Fig.26 – 27).

下面是本场景中高光贴图的样子(Fig.26 – 27).




Here is a compilation of screenshots from Maya, using the High Quality Renderer (Fig.28). This is the closest you can get to the in-game image while still using Maya. Similar details can be obtained when using other software packages, too.



Before wrapping things up, here is a list of all the 3DTotal Textures used in this tutorial:
完成这个教学之前,这里例出了在本教学用到的3DTotal Textures的纹理列表。

Parts01 Texture: ________________________________________

Total Textures V1:R2 General Textures
– paving03
Total Textures V2:R2 Aged & Stressed
– brick15
– brick18
– metal09
– paint03
– wall10
– wall13
– wall14

Total Textures V3:R2 Bases & Layers
– red10

Total Textures V7:R2 Sci-Fi Textures
– ceiling_01
– door_12
– hull_05
Parts02 Texture
Parts02 Texture: ________________________________________

Total Textures V2:R2 Aged & Stressed
– misc09
– paint01
– plaster06
– plaster08
– wall05
– wall18
Total Textures V3:R2 Bases & Layers
– brown_01
– normal06
Total Textures V5:R2 Dirt & Graffiti Textures
– tile02light07
– tile02medium10
– tile04heavy01
Total Textures V7:R2 Sci-Fi Textures
– window01t
Total Textures V9:R2 Ancient Tribes & Civilizations Textures
– african15


As a conclusion, I leave you with a render of the final asset (Fig.29). I hope you have enjoyed this tutorial and hopefully this will help you better understand some of the challenges of texturing for next-gen games. 最后,给大家渲染出最终的效果,(Fig.29).希望你喜欢这个教学,并且也希望这个教学能够让你更好的理解次世代游戏的纹理制作方法。
Thank you,多谢捧场。
Daniel Vijoi
Lead Texture Artist
AMC Studio


0回复使用Total Textures创建次时代环境贴图"


电子邮件地址不会被公开。 必填项已用*标注