top of page

Evolution Architecture

For my research on the evolution of architecture I decided to investigate the Mayans, 15th century Japan, Modern day Korea and futuristic cities. From this research I realised I wanted to make my environment based on the future. I will take ideas from modern day places like Korea and Japan.

Investigating games that are based in the same time zones as their times, The Mayans were hard find a game based on them, all i could find was civilisationn games. For 15th Century I investigated Sekiro and Ghost of Tsushima. For Future cities I just looked at Cyberpunk2077 because it would be a similar game that I would want to base mine off.

I couldnt find much research material on The Mayans so my three main ideas im going with are:

15th Century Japan

Modern day Korea/Japan

Futuristic City

15th japan mind.png
City Mindmap.png
Final City Mindmap2.png

Environment Ideas

Idea 1

My first idea was to make a solo experience environment based in a Futuristic city. This idea would have been too big to make by myself and would take a long time. I will hold onto this idea for sometime in the future because it sounds like a better idea for a different time. I drew a first idea on a whiteboard, but I didn’t like how it looked so I made a different version that is much more refined in Photoshop. From that idea i then added in more details like extra walls and different sized buildings. I like the second revision better because it looks more like city than somthing you make with just a bunch of squares.

IMG_20210209_155744.jpg
plan.png
plan2.png

Idea 2

I decided to stick with the Futuristic time period for my second idea but for this one to make it as a Capture the flag. This idea would be much easier to do but trying to make it fair for each side may not be able the best idea. Looking at other capture the flag maps I have noticed that there are multiple ways to get to each base, I will take this into thought with how I make my bases in my map.  The first drawing a layout of all the buildings and the lines are where the players would have to enter the bases.

IMG_20210211_104348.jpg
City CTF1.png

I made a second design to make it more fare on each side but still have certain points on the map where certain classes are better

Idea 3

For my third idea I decide to make a solo experience environment based on 15th century Japan. Japan is a very beautiful country with lots of wildlife and exotic plant life. The type of buildings that there were in that time period were very simple with just the materials being clay and straw. The statues and temples used much refined materials like wood and metal, the detailed design that is the building will be hard to do because they are very different from other type of buildings. 

IMG_20210209_155734.jpg
Japan plan.png

The base idea of the environement was to have a village in a mountainy region. I wanted the houses and farms to be at the bottom of the mountain with a river flowing through the middle of it. I also wanted the Temple to be up th mountain with a very long staircase going up to it. I could have done this idea but similar to idea one it would have taken to long with the time frame i have to make it like i want.

I first wanted to stick with making my first idea of making the Futuristic City solo experience map but because it is too much work for me to do myself, I may have to switch to making the capture the flag environment. My ideas can transition over but means I have less space to work with will be enough for the details I want to put in. I looked at cyberpunk 2077 as more of a reference for the map. Akudama drive is an anime based in a technological utopia, which I will use more as a reference to what details and holograms I want to add in.

I realised my first idea of the CTF map did not have much going on in it, so I decided to make a revision of it, and came up with idea 2, I did a much more detailed version to show what building will be what.

City CTF1.png
City CTF2.png
City CTF3.png

Version 1

Version 2

Version 3

This second revision adds in more specific building with even ones that could be used by snipers on each side. The way the map is made it means that side B has an advantage because they have more cover and things to go behind.

The sizing’s may be different in Unreal Engine because the sizes I want will not be the same transferring over. For the buildings I will make a basic design of each and then keep editing it multiple times to make it different for each building. I can also make minor changes to the materials to make it look different on each building.

From looking at references I decided I want to make my environment time to be at night and I want it to be raining as well. This is to create a good atmosphere in the city because of this it means I will have to add in a lot of particle effects to make the rain look like I want.

Creating the Environment

This is the journey that I took going through making my plan into 3D, I first took the picture of my plan, set it as a background and put a plane as the main ground and then started adding the squares to do as the buildings. Once I had all the buildings in place and scaled to be at the right height.

Top down view

Picture2.png

3D View

Picture4.png
Picture5.png

After they were the right height for me to do, I colour coded some of the building to show what they represented:

Red = Base B

Blue = Base A

Green = Park

Grey = Skyscraper

This 3D take of my plan will help me visualise what I want it to look like when I start to create it in Unreal Engine. After this I will start to add in the details to see what I will want to add later in the environment.

I decided to add in pavement blocks. That is the darker grey. From this I have realised that the two buildings that are used for snipers will be always in the road. This means I may have to move them more towards on the pavement or even make them smaller.

Other than that, I think the layout like it is, is what I want it to be like in Unreal Engine.

Now that I have a finished layout, I can now work on the details. I have realised that for some of the non-important building I will just have them as using textures but for the important buildings I will model the whole building.

The road will still be the main area of focus but because I have made it smaller it means not many players will be able to be at it at the same time, which will also mean the alleyways will get used more.

Picture6.png
Picture7.jpg

I started blocking out my map in Unreal but when doing so I have realised I will have to make the ground twice the size and the building 1.5 times the size they are now, this is to give more room for players to roam.

Picture8.jpg

I decided that I needed more reference pictures for what I want my building to look so I thought about taking some screenshots of ones in games. I looked for games that have big open cityies similar to Tokyo Japan.

In all I took 15 pictures in games that I can use any of them as references. Once I had found all that I needed I went and started doing my buildings in blender and trying UV textures. This did not go well because even if I make it right in Blender it may not match in Unreal engine. So, I think most of the buildings I am just going to make them a simple cube and put a skyscraper texture on them. For the building that you will be around more I will add more details like this picture.

I started making and finding the materials that I wanted to use. For the road I used the basalt material from the starter the pic, same as for the pavement I used the concrete tiles material from it.

Picture9.png
Picture11.png

After doing them materials I decided that I wanted to get the sky light done first. I did not know how to do it myself, so I had to find a tutorial on YouTube. This is the result I ended up with trying to make it night.

This what it looks like from the players point of view, but I will make it darker later when I have implemented more lighting.

Picture10.png

After this I wanted to do more testing with materials, and I made an emissive sign. In Blender I made a bunch more different type of signs for me to use around my environment.

At first, I could not make it pink but connecting the colour to a multiply with a constant, it worked how I wanted it to.

I ended up taking a long break from making my environment to give me more ideas. When I came back, I went straight into making my buildings. My original idea was to make textures and use them to make the building look more realistic but due to time constraints. I am just going to use basic colours and make the window parts emissive. I am modelling my buildings using Blender and then exporting them too Unreal.

Here are the firsts building I did, This is the main building in the centre of the map. I am just using basic black and white because a normal office building would just have bright lights showing through the windows. I made the black material on the building metallic so that it will reflect the emissive white light.

Picture12.png
Picture13.jpg

Here is what the building looks like in Unreal engine so far. I had to increase the world lighting to make it so I can work and see the buildings.

Picture14.png

This is the building that I made for use as the bases. For the colours of the building, I decided to go with Green and Pink because I thought blue and red are too generic to use. For Base B I will just switch the material to a neon pink one. The building has three doors, one big one at the front and two on the sides.

This the main apartment building by the side of the road. I have gone with a more orange look for the windows to make it look more like normal lighting people have in homes.

Picture1.png
Picture16.png

This is what the current environment looks like with the sky sphere on white. I have a lot more building to do so I will just reuse the modelled buildings.

The buildings collision at first made it so I could not walk through the doors, but I resolved it by switching the collision from simple to complex.

Picture17.png
Picture18.png

This is the store building that covers the door on each base main entrance. In a capture the flag map where you can use gun and snipe, this will be a perfect spot for the sniper to use. The ramp going up should give enough room for the player to go up. 

Similar to the base building the collision made it so i couldnt walk up the slope but i corrected by changing the collision to complex 

Picture19.jpg

Adding in more buildings and signs this is what it currently looks like with the sky sphere on white. 

The only i have left to do are the outer wall ones. Most of the them will be skyscrapers so i could use the same building model but just resize them for what i need.

Picture20.jpg

Here is another screenshot but of one of the buildings with lighting. This is what it looks like when I play the scene. I have gone with the orange again because I feel it suits the back alley building aesthetic, like a bar or café.

Picture21.jpg
Picture22.png

This is what the environment looks like at 75% completion. I used some of the buildings multiple times because I did not have enough time to model the other 13 buildings that I needed.

I had to decrease the amount of building because I felt like it would be over cluttered on the edges of the map so if there was two building right next to each other that could be covered by just one building I did it. This also helps in performance because it means less meshes for the engine to load.

In total i modeled 13 different buildings for this environment.

With all the buildings over and done with I decided to start on the park area. First, I added a plane and put the basic grass material on it from the starter content. After that I placed the benches and pathway so I could know where I wanted to put my foliage. I instanced the bushes using the foliage brush. I noticed that the starter content did not have any trees so I went online and looked for some trees that I can use to hide the wall.

I found a pack called ‘Stylized Nature Pack’. If i did have more time I would have made my own trees but if I did it now, it would take time away from lighting and particle effects.

Picture23.jpg
Picture24.jpg

Here is what the finished park looks like with trees and some lampposts that I made, because I could not hide the wall very well, I used one of the building to cover it. I think that it turned out great and it does what it needs to.

The main next part was to add in more lighting and fog. so, I used the lamps on other areas that had low lighting, to every lamp I gave it a spotlight-coloured white facing down on the floor. This worked better then a point light because I did not want it lighting up areas that it would not really interact with. I added in the volumetrtic fog now so I can see what areas needed the most lighting.

Picture25.jpg

Here is another screenshot from the perspective of the park. The white lighting works really well with the dark aesthetic i was going for. The orange bench doesnt look out of place because its not overly bright.

Below is a screenshot of the cafe building with its lighting built .

Picture27.png

This is the first screenshot I took of the lamp with the spotlights and the fog on a dark blue colour.

I tested the fog with a white/grey colour and didnt think it fitted so i tryed with a darker colour and found that dark blue gives everything a purple vibe to it.

I really like how this turned out because it gives the sort of dark city vibe, with the purple bouncing of the blacks and the white is reflects through the fog.

Picture26.png

The way my environment is right now, is kind of bland but still looks good. If I added in more objects and models to fill in all the empty space it would be better. I could maybe add these in later to make good screenshots to add to my portfolio.

Now that most of the lighting is done. I can start work on the rain particle effect.

Testing out the Niagara particle effect to create my rain effect. Currently it is not looking like I want it to because I want it to collide with the ground and not bounce. 

Picture28.jpg

By changing the size of the rain particle, I have made it so you can see it much better now and now it more like a line rather than a circle.

Picture29.jpg
Picture30.png

This is what all the particles look like when selected.

The collision now works but it just spreads all over.

 

To make it better I also added in a rain sound effect that I found free online.

With my rain now done I feel like i have finished making my environment and made it how i hoped it would turn out.

Picture31.png

Conclusion

My criteria from my original idea were to make a capture the flag style City environment, based at night-time with rain. I feel like I have accomplished this, plus more because I added in the fog. Some setbacks were minor like having to take some buildings out, but the result does not look that much different from what I wanted it to look like.

If I spent more time on the buildings, I think I could make them look more professional. I could have gone with the texturing route rather then just plain materials. My base idea for the materials was to make them look realistic but changed to a simpler and more stylized look due to not spending enough time working on my environment.

Another subject I should have spent more time should I have adding in objects to make it look more filled in. I would also put more signs around the environment and maybe put pictures onto them.

Overall, I am happy with my outcome because I really like how the vibrant colours have come out. It may not be a realistic city, but it still looks like a city environment.

Finished Screenshots

Picture32.png
Picture33.png
Picture34.png
Picture35.png
Picture36.png
Picture37.png
Picture38.png
Picture39.png
Picture40.png

(Recording lagged first 3 seconds because Unreal was running in background)

bottom of page