4 | Modularity and Mathematics

---

Modularity is the focus on this week’s work.

Lesson 1:

all hail the grid

Lesson 2:

“Modular sets require you to think ahead” (Kronenberger, 2020)

Modularity in video games is a technique used for environmental design to help artists work more efficiently by re-using assets. Meshes are broken up into walls, floors, windows, anything tileable, and these pieces are stored in a Kit, and assets are taken to build scenes. The fact that these assets are identical has a myriad of benefits, these include keeping a consistent art style, speeding up the workflow, and improving run-time by reducing draw calls.

(what the heck is a draw call? – me when I attended this lecture)

A draw call is a process used to load objects into a scene, the game object stored in the memory combines with the translation data and adds up to 1 draw call. As games become larger and larger, they must process more and more draw calls. Modular kits combat this by reducing the need for so many draw calls, therefore reducing the stress on the computer.

Utilisation of the grid present in Maya was key to making these modular kits, and the snapping tools allowed me to be extra precise when creating them. Each square on my grid was 100x100cm, but I planned to edit my grid, so each square became 10x10cm. The advantage of this for me was that I could work in smaller increments and continue snapping to the grid.

The next step was planning my modular kit. Before attempting this on my own design, I decided to have a look at real world architecture and think about how that would be broken up. A question I asked myself was to what extent and intricacy should these buildings be broken down into.

By colour-coordinating sections I believe could be tiled on 2 different buildings, I got a better idea of what sort of sections I should be looking to isolate and where good places for seams between the pieces would be.

The first building I looked at was the old Limehouse buildings I found images of when researching the history. Here I looked at big shapes, what would be the smallest about of tiles I could manage here. The main points of separation were changes in brickwork/material.

Fig.1: Unknown Photographer. Ca. 1880-1940. No title

The second building I looked at was Hotel Tassel, the art nouveau wonder in Brussels. This time I thought more about elements which could be dragged and dropped on top of wall tiles, such as windows, as well as brickwork variations and complex elements such as doorways.

Fig.2: SULLIVAN 2007. Hôtel Tassel

The Sakyamuni Pagoda I decided to break down for the roofing tiles, in order to make these modular, one would have to pre-plan the shape of the building to work out how many sections should complete, and divide 360 degrees by that number to calculate the angle of the connecting edges.Thinking back, Maya would calculate the degrees for you so the annoying maths is not necessary (this is a win).

Fig. 3: FONG 2019. Pagodaoffogongtemple2019

After doing all of this I had a pretty good idea of what pieces I wanted to make modular, these include:

-Roof tiles x5

-Sash window

-Entranceway

-Secondary door

-Bay window

-Gutter railing x5

-Gutter joint x2

-Railings x2

-Wall segment x2

-Architrave

-Bracket

-Column support

-Roof trim x2

-Roof finial

-Wall trim

-Name plate

-Guardian lion x2 (Zbrush)

Now the list was compiled, it was time for locking down measurements, I did not have a linear process here, it was more like a sin wave of progress. Trial and Error is not my preferred method of working but on short notice I could not come up with a more efficient way to test out sets of measurements for my building.

These tests were all done by counting squares on the grid to reach measurements and further utilisation of the snapping tools to maintain accuracy. While the divisions on my grid appeared every 10cm, I confined the large pieces to only the 50cm marks while also attempting to stick to the “power of 2 rule” mentioned by Kronenberger in her breakdown of her modular process. This details how scaling becomes easier if you keep dimensions a power of 2 as you run into less issues to do with half numbers on grid lines. This was not always possible, and the measurements I have ended up with would make Kronenberger very sad. To keep the shapes that I have planned, some of my measurements drop into numbers divisible by 20, or even 5. Not ideal, but its okay! Worst case scenario I have to make more wall segments.

This was not an iterative workflow, more of a keep adjusting the same cube without making copies. To keep a record of the measurements I copied down grids into a notebook and recorded lengths on the diagrams. I even pulled out the Pythagorean Theorem at one point to measure a diagonal length!

Parallel to all the technical work, I was also brainstorming ways I could integrate the theme of Harry Potter further into my design as I feel I have reached my goal of art nouveau/Chinese architecture but neglected the magical side of things. What’s the fun of having this beautiful restaurant if everyone in Diagon Alley sees it as too ‘muggle’ to want to enter.

The first and easiest idea I came to was floating Chinese lanterns. Lanterns are something I have not yet incorporated into my design, so what if I took floating lanterns and had them flying out from the entrance and spreading slightly into the street. As well as being gorgeous, they also have the function of providing light to an otherwise possibly dingy street. Thinking further about the lanterns, who says they must all be lantern shaped!

Picture glowing lanterns shaped like cranes perched on the roof or gently gliding about the street. Cranes hold important symbolism in Chinese art and culture, with 3 common colours depicted, white, black, and yellow. The appearance of a yellow crane symbolises prosperity and good fortune, and creativity. White, another common colour, infers longevity.

In place of the stone guardian lions featured in my design, I could sit paper cranes to watch over the restaurant.

Stone guardian lions traditionally come in a male and female pair, with the female holding a cub and the male holding an orb (representing the world). This has strong links into Taoism and Confucianism, with the lions representing yin and yang energy respectively, order and chaos. In many forms of media symmetry is valued more than accuracy and so often features twin male lions with orbs resting under-paw. Order without chaos.

A theory of why the lion cub often looks like a direct replica of the father is one summed up nicely in this quote:

“As the son is a perfect replication of the father, daughter of the mother, and society of earth is the perfect reconstruction of the perfect and eternal heavenly court ruled by the gods.” (ChinaFurnitureOnline, 2024)

Reading this altered my idea slightly, instead of an egg, the yin (female) crane will protect a smaller crane as opposed to an egg, which shall be passed to the yang (male) crane to symbolise the world. After all, children inherit the earth so representing the world as a vessel for a child is not too far from the source material. In terms of colours, I felt that the yin crane should be yellow, and the yang crane should be white. The combination of father and son is a good option to represent longevity, so the son shall also be constructed of white paper.

I am aware of the stereotyping in the form of ‘male seeks legacy’ in choosing to make the father and son represent longevity, as opposed to making the mother the representative as she is the caretaker of life. I will defend my choice here as the longevity factor reads better with the colour-coding. The son will grow up to replace his father and the cycle will begin over. This idea is also so ingrained in Chinese culture that they had a literal national shortage of women.

During the 1 child policy from 1979-2015, many families decided that their sole child should be male and therefore many female foetuses were aborted. The reasoning for this was heavily rooted in sexism, and echoes of this are seen today in the increase in trafficking of women around the countries where the gender ratio is skewed, and the “estimated 80 million extra men” (Stauffer, 2019).

The cranes I will most likely make in Z-brush as hero-assets along with the sign. I need to keep brainstorming about how to stylise them so they appear as paper lanterns as opposed to flesh and blood.

Anyway, it’s the end of week 3 and Chinese New Year! I’ve was in the kitchen cooking for the whole weekend and served up a feast for my flatmates and friends. Braised fish, pork shoulder, dim-sum for days, noodles, and I promise there were also vegetables. Time to make a fish stock with the leftover bones for a risotto😊 

It’s the year of the dragon, Kung Hei Fat Choy :D

---

REFERENCES

Figure 1: Unknown Photographer. Ca. 1880-1940. No title. www.thatsmags.com [online image] Available at: https://www.thatsmags.com/guangzhou/post/17619/the-last-three-restaurants-in-london-s-forgotten-chinatown.

Figure. 2: SULLIVAN, Mary Ann. 2007. Hôtel Tassel. Bluffton. [online image] Available at: https://homepages.bluffton.edu/~sullivanm/belgium/brussels/tassel/horta.html

Figure 3: FONG, Charlie. 2019. Pagodaoffogongtemple2019. Wikimedia Commons [online image] Available at: (https://en.wikipedia.org/wiki/Pagoda_of_Fogong_Temple#/media/File:Pagodaoffogongtemple2019.jpg

KRONENBURGER, Lea. (2020) BALANCING MODULARITY AND UNIQUENESS IN ENVIRONMENT ART. [online] Available at: https://www.beyondextent.com/articles/balancing-modularity-and-uniqueness-in-environment-art beyondextent.com

THE LEVEL DESIGN BOOK. (n.d.) Modular Kit Design. [online] Available at: https://book.leveldesignbook.com/process/blockout/metrics/modular book.leveldesignbook.com

BURGESS, Joel and PURKEYPILE, Nate. (2013) Skyrim’s Modular Approach to Level Design.  [online] Available at: http://blog.joelburgess.com/2013/04/skyrims-modular-level-design-gdc-2013.html blog.joelburgess.com

NAZMIYAL ANTIQUE RUGS. (2015) History of Cranes in Chinese Art. [online] Available at: https://nazmiyalantiquerugs.com/blog/cranes-chinese-art-symbol-meaning/#:~:text=Cranes%2C%20or%20herons%20as%20they,bird%20symbol%20after%20the%20phoenix. Nazmiyal Antique Rugs

STAUFFER, Brian. (2019) You Should Be Worrying about the Woman Shortage. [online] Available at: https://www.hrw.org/world-report/2019/country-chapters/global-0#:~:text=In%20the%20world%27s%20two%20most,boys%20for%20every%20100%20girls. hrw.org

CHINAFURNITUREONLINE. (2024) Foo Dogs: The History of Chinese Guardian Lions. [online] Available at: https://www.chinafurnitureonline.com/foo-dogs. chinafurnitureonline.com