Modular Technique of 3D Modeling and Procedural Texturing for 3D

Game Environment Design of “Jurnal Pahlawan”

William Suanto

, Yusup S. Martyastiadi

1,2

Faculty of Art & Design, Universitas Multimedia Nusantara, Tangerang, Indonesia

Doctoral Program, Graduate School, Indonesia Institute of the Arts Yogyakarta, Yogyakarta, Indonesia

Keywords: Modular Method, Procedural Texturing, 3D Game Environment Design

Abstract: 3D game “Jurnal Pahlawan” (Hero’s Journal) is a game project based on the battle of Surabaya, Indonesia in

November 1945 between Indonesian soldiers and British & British Indian troops. The purpose of this

project is proposing a joyful learning media with history contents for youth through the game. The young

users can interact with game system, which resemble to historical recount of the battle of Surabaya. The 3D

digital visualization of the game world leads game players are be immersed to the game. This paper

describes the process of designing the game environment, mainly historical building modeling and

texturing. The research uses qualitative method such as battlefields observation, literature study and visual

existing study. In addition, the assets design process uses modular technique in 3D building modeling and

procedural texturing. Finally, the result of this design process gives opportunities for 3D designers to create

game environment systematically. It means, in terms of 3D game environment, the repetition process of 3D

assets production could be applied for making huge digital architectural in the game world easily.

1 INTRODUCTION

Many heroes from various places sacrificed their

lives to fight for Indonesian independence. The

battle of Surabaya on 10 November 1945 was one of

the important historical events in preserving for

independence. In the battle, many fighters from

various groups together against allied forces (The

Dutch - British Army) who trying to occupy the city

of Surabaya (Sentosa, 2014). This battle event was

later designated as a hero day, which could be

interpreted as a true fight.

Discussing about history, mostly, some sources

of Indonesia historiography obtained from literatures

such as history book and textbook. On the other

hand, the young Indonesians tend to not read history

books (Rofalina, 2015). It is a potential problem that

faced by young people to learn about history

content. In spite of that, technology gives

opportunity to integrate any knowledge so they ease

to learn. Therefore, game as a new interactive media

can be an alternative in disseminating this

information.

The game is one of the fastest growing digital

media and also very fashioned to the society at the

moment. In addition, McGonigal (2011) added that

playing games could increase the positive emotions

of the players. This sensation affected by the

pleasure and satisfaction that are gained when

accomplishing the games.

There are so many themes that can be

incorporated into the games and historical content is

one of them. Recently, there are lots of practices in

combining game with history content that has been

done and give positive feedbacks. Players can feel a

direct visualization of the historical reconstruction

which being displayed. As a result, the content is

easier to understand due to the game appearance and

can be linked directly to its historical events

(Wainwright, 2014). Based on this, the game can be

a supporting media in the delivery of historical

material, especially the events of the battle of

Surabaya in November 10, 1945.

This 3D game is named “Jurnal Pahlawan” (The

Journal of Heroes). The name of this game was

taken based on Indonesia Heroes' Day as a memorial

to the battle of Surabaya.

1.1 3D Game

Three-dimensional game is a digital game that

applies three-dimensional media, so the objects in

Suanto, W. and Martyastiadi, Y.

Modular Technique of 3D Modeling and Procedural Texturing for 3D Game Environment Design of “Jurnal Pahlawan”.

DOI: 10.5220/0008525200050012

In Proceedings of the 1st International Conference on Intermedia Arts and Creative Technology (CREATIVEARTS 2019), pages 5-12

ISBN: 978-989-758-430-5

the game can be seen from various sides and

interacted with them. Adam (2014) divides several

types of perspectives displayed in three-dimensional

games, namely:

• Fixed 3D: game that presents static three-

dimensional backgrounds but is rendered in real-

time. In this perspective, players cannot see

objects freely.

• First-Person: game that makes player sees based

on the perspective of the first person. Elias

(2019) added that this type of game seems quite

realistic because players like to look directly into

the game. All interactions performed by the main

character are seen through the eyes of the

character.

• Third-Person: in this perspective the player acts

as a third person and the player can see the

characters played from various sides and move

the character in various directions.

1.2 3D Environment

A three-dimensional environment is an environment

made into three-dimensional forms. Meigs (2003)

states that in the game, environment has functions to

visualize the atmosphere, provide information of the

time and location, and complement game play and

support the stories. A game environment usually has

seven basic elements, namely terrain, water, sky,

sun, clouds, indoors and plants (Chopine, 2011).

Ahearn (2017) points out that designing

environments on a large scale requires a long time,

so it needs efficient techniques to develop the game.

The modular technique can speed up the processing

time of 3D assets modeling. Modular technique is a

technique that repeats a simple asset and organizes

into a single unit. In this process, modular

techniques also require several other techniques that

can give a little variation to the assets compilation,

which are free-form and hybrids techniques (Ahearn,

2017). Free-form technique takes advantage of the

player's perspective and rotation, so the assets seen

slightly different. The hybrids technique provides

other variations and details by combining non-

modular assets into modular assets.

Chopine (2011) in his study describes that 3D

objects in games certainly have a low number of

polygons. This low-polygon has limitation of the

assets’ form, which the assets are looked rough. To

overcome this boundary, the 3D artist can apply

normal maps to increase the detail of the 3D objects.

The normal maps function as a texture that creates

the impression of depth and can be applied with

procedural techniques. The procedural texture is

texture repetition techniques with same pattern as

seamless edges, consequently they can be replicated

on other assets (Chopine, 2011).

1.3 Dutch Colonial Architecture in

Indonesia

The Dutch colonial architecture built in Indonesia

belongs to the category of modern architecture.

However, Sumalyo (1995) explains that these

architectures are unique because there are adaptation

of two cultures between modern architectural

culture, which brought by the Dutch and traditional

Indonesian culture. In the urban planning, the Dutch

had their own characteristic of built magnificent

buildings in the downtown. In addition to the

distinctive features of the city structure, the Dutch

also had a buildings characteristic that they erected

which was adapted to the climate in Indonesia. The

adjustment optimized lighting and air circulation as

construction elements of the interior of the building.

1.4 The Battle of Surabaya in 1945

Ricklefs (2008) emphasizes that the battle of

Surabaya was the biggest battle that occurred in

Indonesia after Indonesian Independence Day. The

main cause of this battle was the arrival of allies

(The Dutch - British Army) who aimed to evacuate

prisoners of the previous war. However, the arrival

of these allies coincided with the speech of Sutomo

(Bung Tomo). This circumstance led tempestuous

condition in Surabaya at that moment.

Actually, the allied forces and the Indonesian

side had a cease-fire agrement, however fighting

broke out again as a result of the murder of

Brigadier General A.W.S Mallaby. Theorina (2007)

wrote that in its movement, the allies attacked the

Surabaya region from the north, which was the coast

and then moved to the south by deploying the navy,

army and air forces. Ricklefs (2008) adds

information that during this battle, allied forces

successfully controlled more than half of the city of

Surabaya, consequently Indonesian forces retreated

to other areas.

2 METHODOLOGY

There are several methods in design process in

collecting some supporting data. These data will be

the basis for creating the environment concept. Then

the next process is brainstorming & mind mapping

which is useful for determining the focus in this

design. After passing the two processes above, the

CREATIVEARTS 2019 - 1st International Conference on Intermedia Arts and Creative

next thing to do is to set the environment concept.

This is related to the location and object that will

exist in that environment.

2.1 Data Research

At this stage, the authors conduct literature studies

and interviews, which employ to explore the

material and techniques needed in the design

process. In addition, we also conducting former

battlefield observations in the city of Surabaya and

also compared several existing works. The aim of

existing study is getting an overview and also visual

references. The battlefield observation used for 3D

environment conceptualization.

2.2 Brainstorming & Mind Mapping

According to the phenomenon and obtained data, the

focus set for asset visual is a Dutch colonial building

with a specific location, namely Jembatan Merah

area. The reason for the establishment of this

location is because there is much iconic architecture

from the Netherlands. The designer set the colonial

buildings that would be developed were Internatio

building and Cerutu building. In addition to the

visual focus, the author also determined the PC

platform as a platform for playing games.

Furthermore, the PC also used for separating

building asset and produced supporting game

properties.

2.3 Environment Conceptualization

The concept of environment is made to adjust the

theme; therefore the environment will be described

as the place where the battle of Surabaya was took

place. The visual theme of the game environment is

realist visual style. It is a challenge to reconstruct the

battle of Surabaya in realist visual theme.

Figure 1: Visual Reference of Jembatan Merah Area.

(https://upload.wikimedia.org/wikipedia/commons/d/de/COLLECTIE_TR

OPENMUSEUM_De_Roode_Brug_en_de_Handelstraat_in_Soerabaja_T

Mnr_60028087.jpg)

Figure 2: Visual Reference of Internatio Building.

(https://i.pinimg.com/564x/61/57/48/615748537aa1e2d91f126e1fc81758ac.

jpg/)

There are many differences according to the ties of

time and battlefield. To overcome this challenge, the

researcher looks for some historical photographs as

references to get approximate visualization of the

battle time, for examples as shown in Figure 1 and

Figure 2.

Since the area around Jembatan Merah was an

urban area, there will be many buildings in that

location in the game world visualization. For the

map topology, the author follows a photo from the

Surabaya tram map in the 1940s (Figure 3).

Figure 3: Surabaya’s Tram Map in 1945.

(http://picssr.com/photos/bad_boy_4_life/interesting/page29?nsid=5825643

3@N07)

Modular Technique of 3D Modeling and Procedural Texturing for 3D Game Environment Design of “Jurnal Pahlawan”

Figure 4 shows the process of designing the 3D

environment in the “Jurnal Pahlawan” game.

Figure 4: Design Process Scheme.

2.4 Sketches

2.4.1 Environment

The designer sketches the topology for the Jembatan

Merah area (Figure 5), which is adjusted by

reference from the tram map (Figure 3). Figure 6

and Figure 7 illustrate the atmosphere of the

battlefield.

Figure 5: Sketch of the Jembatan Merah Area Topology.

Figure 6:

Sketch of the Urban Atmosphere.

Figure 7:

Sketch of the Jembatan Merah Atmosphere.

2.4.2 Buildings and Props

Basically, houses that designed for residents have

the same shapes, so the buildings for housing will be

made by adjusting the sketch of the Jembatan Merah

topology. The sketch of colonial buildings drew

based on visual references, as shown in Figure 8 and

Figure 9.

Figure 8: Sketch of the Cerutu Building.

Design Application

Asset

Implementation

Data Research

Brainstorming &

Mind Mapping

Environment

Concept

Literature Review

Battlefield

Observation

Study Existing

Game Engine

Implementation

Internatio

Building

Supporting Props

Textures

Visual Reference

Colonial Building

Jembatan Merah

Area

CREATIVEARTS 2019 - 1st International Conference on Intermedia Arts and Creative

Figure 9: Sketch of the Internatio Building.

Props are illustrated according to the objects in

the old photos references in 1945, some games’

visual references, and also adopted from the

properties of existing animation movies (Figure 10).

Figure 10: Sketch of the Props.

3 DESIGN APPLICATIONS

In this process, the author implements a sketch that

has been designed into the process of three-

dimensional modeling and texturing.

3.1 Environment Asset

In this stage, the designer did a layout blocking

based on the sketch of topology maps as shown in

Figure 11. The purpose of this layout blocking is to

determine the structure of the building and the

density of the location.

Figure 11:

Blocking Level of Jembatan Merah.

The next steps are 3D architectural modeling, 3D

game properties modeling, and textures making.

3.1.1 Building

The 3D modeling implementation of the building,

the scale of each part of the building for housing is

determined by character height. In addition, the

designer also breaks down each part of the building

as needed (Figure 12). The Internatio building

(Figure 13) and the Cerutu building (Figure 14) get a

special treatment for modular parts. This special

handling of the 3D modeling process due to broad

modular section and more detail of those buildings.

Figure 12:

Modular Section and Building Scale.

Figure 13:

Modular Section on Internatio Building.

Modular Technique of 3D Modeling and Procedural Texturing for 3D Game Environment Design of “Jurnal Pahlawan”

Figure 14:

Modular Section on Cerutu Building.

After the modeling process, the designer made

UV map template by adjusting the 3D model using

material features of the 3D modeling software. The

3D model unwrapping process (as shown in Figure

15) was needed for preparation of texturing

implementation using procedural texture technique.

The result of this unwrap process must have

proportionally same measures (length - width) with

the texture dimension. This procedure is important

to ensure the texture look fit to the 3D asset and

visually not stretch.

Figure 15:

Unwrap on Modular Walls.

3.1.2 Game Properties

In this game, properties are made in various types

(Figure 16). These properties were designed to

provide variations and triggers of the interactions

with players. For instance, the property could be

used as a protector when shooting the enemies

(Figure 17). Since the property assets are non-

modular 3D model, the property assets were made a

lot and varied, so they can be visualized more

distinction.

Figure 16:

Game Properties Asset.

Figure 17:

Game Properties Asset as Protector.

3.1.3 Textures

Procedural textures are made into several types to

give variation to buildings as shown in Figure 18. In

addition, each texture is made into seamless edge.

So it does not cause cuts effect when be

implemented to the 3D asset. It means, the texture

has simultaneous visualization when it is repeated to

the tiled assets.

Figure 18:

Texture Set for Modular Assets.

CREATIVEARTS 2019 - 1st International Conference on Intermedia Arts and Creative

This procedural texture can be applied to any

modular assets. On the other hand, texture that is not

implement the procedural technique can only be

executed on certain objects, which have been fitted

to its texture.

Some textures, especially wall textures were

designed to match the theme by using a slightly

more faded color and also there is the effect of

cracks or broken walls to give the impression of

historical of the battle. This texture can only be

applied to modular assets with good unwrap as

explained in the previous point (Figure 15). In the

game engine software (Unity 3D), first step, the

designer made a material that is main texture

components such as diffuse/ base color before this

texture was used. This function is making the color

giver (Figure 19) and also normal map whose

providing detail and depth effect (Figure 20). Some

additional textures such as roughness, metallic and

height can also be added to furnish more detail of

the material. When this material preparation has

been completed, the next step is assigning the

textures material to modular assets.

Figure 19:

Base Color of Concrete.

Figure 20:

Normal Map of Concrete.

3.2 Game Engine Implementation

Modular assets that have been completed were then

set into the 3D game engine. Next, the procedural

texture was applied to modular assets and arranged

using a free-form technique that utilizes position

changes and rotations on objects precisely (Figure

21). If arranged correctly, the results will be

obtained as in Figure 22, Figure 23 and Figure 24.

Figure 21:

Modular Asset Preparation.

Figure 22:

Modular Asset for House.

Figure 23:

3D Asset of Internatio Building.

Modular Technique of 3D Modeling and Procedural Texturing for 3D Game Environment Design of “Jurnal Pahlawan”

Figure 24:

3D Asset of Cerutu Building.

After completing the construction of several

buildings, the last step is utilizing the results of the

layout blocking that has been previously done by

replacing the marker boxes with building assets and

properties, so they become a whole environment, as

shown in Figure 25.

Figure 25:

The Visualization of Jembatan Merah

Environment.

4 CONCLUSIONS

According to the results of this study of 3D game

development, we can conclude that the

implementation of modular techniques on 3D

modeling and procedural texture potentially has

positive influence in designing large-scale game

environments. Both of these techniques are able to

accelerate the process of working on assets,

especially in buildings that are scattered in the huge

game environment.

The recommendation for next study is doing

research for an implementation possibility of

modular technique for organics modeling of game

assets, such as plants & trees and other non-angular

objects.

REFERENCES

Adams, E., 2014. Fundamentals of Game Design. USA:

New Riders

Ahearn, L., 2017. 3D Game Environments: Create

Proffesional 3D Game Worlds. Boca Ranton: CRC

Press

Chopine, A., 2011. 3D Art Essentials: The Fundamental of

3D Modeling and Animation. USA: Focal Press

Elias, H., 2019. First Person Shooter: The Subjective

Cyberspace. Portugal: LabCom

McGonigal, J., 2011. Reality Is Broken: Why Games Make

Us Better And How They Can Change The World.

New York, NY: The Penguin Press

Meigs, T., 2003. Ultimate Game Design: Building Game

Worlds. California: McGraw-Hill/Osborne

Ricklefs, M.C., 2008. Sejarah Indonesia Modern 1200 –

2008. Jakarta: Serambi

Rofalina, F., May 7, 2015. Infografik: Pelajaran Paling

Disukai dan Dibenci Siswa Indonesia. Retrieved from

https://www.zenius.net/blog/7657/pelajaran-disukai-

dibenci-siswa

Sentosa, I., 2014. Tionghoa Dalam Sejarah Kemiliteran

Indonesia: Sejak Nusantara Sampai Indonesia.

Jakarta: Kompas Gramedia

Sumalyo, Y., 1995. Arsitektur Kolonial Belanda di

Indonesia. Yogyakarta: Gadjah Mada University Press

Theorina, V., 2007. Pertempuran 10 November 1945 di

Surabaya. (Unpublished Undergraduate Thesis).

Yogyakarta: Universitas Sanata Dharma,

Wainwright, A.M., 2014. Teaching Historical Theory

through Video Games. Journal of The History

Teacher, Vol 47, No 4, August 2014

CREATIVEARTS 2019 - 1st International Conference on Intermedia Arts and Creative