Using Transparency Maps

During the time in which I had used speed tree in order to construct different pieces of foliage in Speed Tree, I felt that I was missing part of iconic foliage which would really suit the environment that we were constructing. The fern is fairly common in the source material that we are looking at, however, there were no tutorials on the matter.

The Fern that is the Transparency Map.

I had never attempted to create transparency maps at all, so this was a new experience for me. I looked at images of ferns and saw that they all originate from the middle and spread over each other. I then proceeded to create a plane, angle it so it shoots out of the center, duplicated it several times and dangles over the other planes.

The model ready for the transparency maps.

The next step was gather the image of the fern, then U.V the plane to the fern. I then took it into Photoshop, deleted the outside of the phone and then saved it as a png file. I took this into Unity and made sure that it was "Cutout" in the material setting, getting the result.

Im really happy with the result, especially since this was one of the first times I had used transparency maps.

The finished Fern in Game.

Using Speed Tree and Creating Assets

One thing that we felt that the game was missing was foliage. It was something that wasn't man made. Looking at the research that was done in the process to designing the environment, one that was present in the images was the use of trees and bushes. This helps breath extra life into the environment and make it less bland. There several things that we needed when it came to the foliage. We decided that to help emphasis that Miami feel, we needed to create Palm trees that will sit in the shopping center. We also needed to create some bushes and fern which will be scattered around the mall.

Creating and Adjusting in Speed Tree.

I was finding Speed Tree a magnificent program to use, with all the extra detail into controlling the outcome of what the tree was going to look like. Im very lucky because Speed Tree has many different templates which people can use, with the palm tree being one of them. This was great as it helped introduced me to the program slowly. The program also gives us a height perspective, where we can see what the player would look like compared to the trees.

Using the tools within Speed Tree.

There were many detail;s within the program that I could adjust, this was perfect for constructing the right tree for our game. Here I could could control how tall the tree was, how many iterations of the tree there was, how much detail was going into the tree and how many leaves there were. I also could change the bend in the tree, which was something that could make a tree unique.

The program also has an option where the user can generate a collider for it to use in Unity. This was fantastic as it could save game designers time when putting the models in. Speed Tree also generates physics with a wind generator. this gives us a sample of what it will do in Unity.

Creating a Bush in Speed Tree.

After the trees were in game, we were all really happy with the results.I was then told that we needed some bushes that would sit it in the pots scattered around the environment. I was struggle in my attempt to make a bush, there weer no tutorials or templates for me to work with, so I had to use what I learnt from the palm tree. I ended up getting a template of a Birch tree, reducing the size or the bark in the middle to minimal and reducing the detail of the leave so it would run nicely in the game. In the end,. I was rather happy with the result that I got, as using a new program is always difficult, but I feel with the time I had, I really did learn a lot.

Creating Dead Grass within Speed Tree.

Another thing which I fought would add to the extra detail of our environment was the inclusion of grass scattered around the environment. This would sit mostly at the bottom of the palm tree to help the environment feel slightly more realistic. Again there was a grass template that Speed Tree had, however, it did look rather different to the end result. With adjustments that I had made, I managed to grab a clump of dead grass which suited the rest of the foliage.

The Trees in game.

The Trees amongst the Ferns.

The Trees amongst Grass.

The Bushes in the pot.

I have rather enjoyed using this program and in the future, I would love to proceed with the program and see the experiments that I could create with it.

Inside the Shops

Some extra detail that we felt was missing was the addition of background pieces such as shelves to fill the environment. Although these will not be in direct contact with the player, it helps fill out the environment. For the inspiration, we looked at really life shops and took particular interest in one fast food restaurant called "5 Guys".

The first thing that I made was a shelf. These shelves would be behind a window where the player could see them, but could not interact with them. This meant that they had to be extremely low poly and have had impact on the game. Most of the detail of these models had been produced on the Albedo maps, with the black dots and lines representing a hole in the model. Overall for a low poly model, I am rather happy with the result that I got, especially since it is in the background of the game.

Shelves that feature in the shops.

Ben Matthews, a team member, who was constructing parts of the environment included a shop called "3 Men". This was a play on my teams favorite fast food restaurant "5 Guys" and was a nice Easter egg to add to the game. What the restaurant has there is a variety of different tables and chairs, so I decided that it would be best for me to construct several of these for the game. Below is just a combination of the table and chair that I constructed for the game. Again, these models had to be low poly, however, as the shop that Ben had made was open, the player could travel around,  so the player could go right up to the table. Im rather happy with the result, as I feel that these suit the game perfectly.

Fast Food Table and Chair.

The models that were to feature in the restaurant had to be extremely low poly, this was so that it did not affect the performance of the game. Again going back to the restaurant that Ben had constructed, we needed a variety of different chairs for the restaurant. Below I have constructed a booth type chair where multiple people can sit on. This version is a double sided one, so it suits the environment that it is in.

Double Booth.

Just like in many fast food restaurants, they have a variety of different chairs and tables, we wanted to implement this variety into the game. I decided that to suit the environment that we are creating, especially with the double booths, I needed to create a single booth, this means that we don't have to put more tables down and the row of booths can finally end. This also helps the restaurant look more natural.

Single Booth.

To add detail into the restaurant, I added a different style of bin in the building, this was to separate it this restaurant from another environment. I thought the idea of putting the other bin that I had constructed for the shopping mall would look out of place in the restaurant. As you can see by this design, its a lot cheaper looking than the other one. This one is also made out of plastic, where as the shopping center bin made of wood and metal.

3 Men Bin.

The booth tables are a different style as the other table would look completely out of place with the booths. These table also are attached to the walls, with the top of the table leaning slightly to the left. I wanted the wood for this material to be the same tone as the other booths to help fit in, where as the underpart of the table is a black metal that keeps it standing. When combined with the other booths, it fits in perfectly and works really well as part of the restaurant.

Booth Table.

Collection of Assets.

The Shelves behind the glass.

At the front of the shop.

Shot inside the shop.

Even though this hasn't been a huge part of the environment, I have really enjoyed the process of creating these models and putting them into the game. I feel that as part of restaurants and shops, these pieces fit together nicely and if we chose to do the game later on, I would be more than happy to continue with this process of making models.

Assets around the Environment

There were many assets that needed to be placed around the environment. This was because we were trying to fill the environment and needed to give the player something to look at and run past. We wanted the player to feel as if they were running around a shopping centre. When it came to thinking about what would be in a shopping centers, all sorts of ideas came out, which included Bins, Cameras and Benches.

The Bin.

The Bin was a fairly simple model that I constructed. I looked into a variety of different designs that were around shopping centers, especially in the 1980's and this is the result that we came up with, it also helps match the benches that I created. I like the fact that there is a combination of metal and wood, giving the bin a slightly designer feel. These had already been placed around the environment by our game designer and we were fortunate enough that he managed to replace all the old greybox models.

A Video Camera.

The video cameras was something that I felt were import to the game as its based in a shopping center. it helps give the feel that you are not alone in this world, that people are watching your actions. That a world outside of the environment exists. I managed to find some fantastic reference of security cameras from the 1980's which I felt were perfect for our game. There are some fairly basic color that suit the style of the camera, with the beige being perfect for it.

A Drinking Fountain.

Again by looking online, I managed to find some reference of some drinking fountains. This again helps us feel the environment with some themed models, while at the same time, the model's tri count is low, meaning that the performance of the game is not affected due to the addition of these models. I incorporated the beige color for the security camera and managed to put it in the bottom plating of the fountain. I even managed to make the drink tap fairly low poly. This is a short drinking fountain and will sit on a wall above the ground.

A Single Bench

The Benches were a vital addition to the environment as it helps sell to the player that this place is part of the real world, people come here and they shop. There was a fairly simple design that we managed to find online, which we felt was perfect for the game. Just like with the vending machines I had to make sure that there were more than one model on a U.V map in order to save materials. I just happens to be on this particular map, there were 5 models on the map. This was good as it does help the game run smoothly, however it does lead to some of the texture being slightly stretched.

The Double Bench.

After I had constructed the single bench, I felt that I needed to add a double bench, exactly like one that you would see in an actual shopping center. This was fairly simple to create, all I had to do was use the single one that I had created earlier, cut it in half, mirror it and connect the two. I then needed to create a barrier in the middle that would separate the two sides and add the wood planks so that the style that we are trying to enforce follows through.

A Pot Plant.

The model needed to be fairly simple, it would host some of the foliage that I would be creating later. Looking at designs in a shopping center, this is really the only thing that stood out for me that looks like it would fit in the environment that we were creating. 

To help save the use of an explicit amount of materials, me and the game designer had a discussion, in which he had suggested that several of the models should be U.V'd together, and textured. If the model has the appropriate Color I.D, then it will not matter if you texture all of these models in Quixel. Once the materials are made, thanks to the color I.D, you can place the material on each one of their models, with only the texture that you set on the combined map in Quixel for that model appearing.

Assets in the Game.

Assets around the Game.

It was nice to come back to modelling, even if it was just low poly models that would suit our environment. The one thing that I had learnt out of all of this was to optimism models a lot better, which means reducing the tri count to a minimum and mapping sure the texture space is not wasted.

Vending Machines and their Concepts

I was told that one thing that we needed for the environment, with it being a shopping center, was the creation of vending machines. These vending machines would be right in the players view so needed to have a large amount of detail to them. I felt there were two machines which I needed to construct, the food vending machine, that would contain snack and the drinks vending machine.

Before I started the machines, I needed to get some real world inspiration. I looked at machines that were around in the 80's, which besides the button layout, looked fairly similar to ones that are around today. The brand that made it is laid across the front, with it only selling products from that brand. Due to copyright issues, I cant exactly use a product such as Coco Coal or Pepsi, so it may be appropriate for me to create my own brand for the game.

Inspiration for Concept.

This new drink that I was going to create needed to take inspiration from the products that were already out there. The product also needed revolve around the time period that it was set in. I decided that the drink is was going to create was going to be called "Core Cola".

I got the measurements for the front of the drinks vending machine by creating a U.V snapshot to make sure that it fitted perfectly. Then I decided to use my knowledge of Photoshop in order create this piece. I first started by gathering images that suited the project in order to put them together for the final piece. These included the can, the pouring liquid, ice and a synth wave back ground. By putting together these images with a combination of filters and adjustments to the color I managed to get something that I was happy with. The next step was to add the text and detail to the can, such as the strips and water droplet to help finish the piece.

Art that I created for the front of the Vending Machine.

To make the Vending Machine illuminate but to keep the rest of the machine unlit, there were several things that I needed to do. I firstly needed to make the parts of the vending machine separate meshes, this meant that when I took it into Unity, I could put a separate material onto these two parts of the mesh, then put another non-emmisive material on the bulk of the machine.

As mentioned earlier, these two will have two different materials, with the front door panel and button being the emmisive, with the rest not. The best way to do this is to select the faces that I wanted to light up and press the "Extract" button in Maya. This made them their own meshes. Then to take these into Unity, I had to make sure that when I exported these objects, the button was turned on.

Parts of the Model that I wanted Emmisive had to be separate.

With the food Vending Machine, I didn't have anything to illuminate, however, I had a glass plane which would feature over the front of the snacks, the way in which I could achieve this was again repeating the steps that I did in the previous model, with using the same "Extract" tool.

This model was fun to create, especially since I had to create all these bars of chocolate and crisps that will go into the machine, ready for people to buy. This is the extra level of detail that I was told to put into the model. We originally were going to make this model similar to the one that we had made before, where I would design the food front and then place it right next to the drinks machine. However I wanted to separate the two, as I believe that variety around the map gives the player something different to look at.

The Transparent window had to be separate from the Vending Machine. 

Again the Two Vending Machines had to share a U.V map, this saved on the amount of materials that we were going to use in the game, especially since we had a map that would be fully dedicated to the illuminious material on the front of the drinks vending machine.

Once I had baked the basic color I.D map and textured the majority of the items, I then had to move onto the snacks. I have done a lot of adjustments on the Albedo and Normal maps when it came to these two to help give it a nice finish. I started off by adding the numbers and icons that would be on the front of the buttons. The next step was to create all these concepts for the snacks. I combined some ideas that were around when I was a child, with my imagination.

This looked fairly interesting when the map was complete. however I understand that the U.V space is not used well and when I am to continue with this idea of U.Ving more than one model onto a texture map, I need to use the space more appropriately.

By putting two models on one texture sheet, it saves using more materials.

The Illumination map was fairly simple in the end. I have never attempted it before, so this was something me to learn, I started this off by putting the front and the buttons of the drinks vending machine that I separated from the mesh earlier and put them in the same texture map. I then grabbed a U.V snapshot of the meshes, then putting the concepts that I created earlier to work. I also decided to create some concepts for the buttons, including drinks such as "Core Cola" and "Jump". The way that this map worked was everything that wasn't black would be illuminated, as long as it was U.V'd correctly.

A separate map is made for the Emmisive part of the model.

Im fairly proud of this model, as I designed all the brands that feature in machine are all unique. I fell that as a model, it looks quite nice, but a way in which I could improve upon this is to sort my U.V space out and to use it more wisely. As part of the game, I feel that this works, because if a player wants to look into it, they an then see all the different variety of the machine.

The Food Vending Machine.

Even though this model was fairly simple, I am really happy with the way that it turned out, more so than the food vending machine. I especially love the fact that the concept that I created looks perfect for this machine.

The Drinks Vending Machine (Illuminating).

Even though these models were relatively simple to create, I really happy with the way that they have turned out. I feel that with these placed around the environment, it gives us that extra something. I am also proud that all the concepts for the drinks and the snacks have been completely made up by me, with me getting a chance to try something different on this project.

Assets in the Game.

It was now time for me to work on different parts of the environment and incorporate what I had learnt here into different aspects of the project.

512 Neon Tiles for the Environment

To help fill out the environment, I was tasked with the construction of neon tiles that would feature in and around the shops to add that extra realism. As I had mentioned earlier, in the game I had been tasked with creating neon signs that would feature throughout the environment, however after testing these 3D models throughout the environment, it did not work as well as we anticipated. This meant that I had to go back a create for cheap 512 tiles using what I had learnt on vending machine when it come to luminous maps.

A selection of neon signs that I created.

The signs that I made where ones that we were expecting to see in a shopping mall, such as the exit sign, or food neon signs. I made the signs look like they were made out of the same neon tubes that you see of side of buildings in cities. In total I made 16 signs which I felt was appropriate, at least to see what they look like when they are placed around the map. There were a huge variety with what I had made, however, if we wanted to make anymore, it was fairly simple for m to get back to.

A coloured neon sign.

With a couple of the 512 tiles, we wanted them to have different color variety. this meant that when I was working on the files within Photoshop, I had to assign them the right colors there. The main Neon signs that I had to do this with are the food signs. According to the game designer, this means that we have to create a separate materials for each one of these signs, which can take its pressure on the game. I tried to make sure that these colors were left to minimal, however, with signs such as the burger or hotdog, these really required.

A plane Sign to colour later.

With the other tiles, we wanted them to one color, this meant that when we put the tiles within unity, we could change the color to whatever we want. By making it white, it means that we can reduce the amount these actually affect how the guns run. After these are put in the game, we can then look at the tones which it is surrounded by and judge accordingly.

A redone sign in order to make the game run better.

Coming back to the 3D sign that I had created earlier, I had a discussion with the game designer George Burchmore, who said that a way in which we could make the game run better, would be to change the 3D signs into 2D ones. This is one example, I had created a 3D pharmacy sign, which sits in a cross shaped box, however, it does start to look fairly wrong, with the motion blur on, when the player runs passed it. A way in which this could be improved, again is to create a 512 tile that will sit in the box, which is exactly what I did.

Neon signs in shop windows.

The selection of tiles that I created is something that I'm rather happy with, especially since I only had a 512 x 512 pixel space to work with. Its now to see how these look within the game, compared to the 3D ones, to see what looks better within the game.

Creating, Rigging and Modelling the Arm for the Character

 After I had finished the guns for our game, the next step was to create the arm that would hold the gun. Since I had started the course, I have never had a chance to create 3D Character art. This was my chance, but as we were working on a tight schedule, we all felt that instead of wasting time in creating a base mesh from scratch, we would obtain a mesh that had already been constructed off of the internet and adjust it accordingly to suit our game.The problem is that I would have to put alot of time into the construction of the arm, when it would look no different to one that gas already been made before, exactly like re-inventing the wheel. I managed to find the website called free3d.com which provides people with free 3d models. I happened to find a  basic body mesh that was available for me to alternate.

The only thing that I needed from the mesh was the arm, as the game is a first person shooter and the arm being the only thing visual on screen. I thought that the best thing to do would be to cut the mesh at the shoulder, this means that if we wanted to implement a reload animation or sprinting animation, then the arm would not be cut off and floating on screen.
Once I had the arm, I wanted to give it a bit of originality, so I decided that the best course would be to create a jacket for the model, which will be in full view of the player.

The arm that I took in the end.

There were several ways in which I could attempt the sleeve of this jacket, one being the use of a program called Marvellous Designer. At the time, our tutor had managed to gain control of a few licences of the program, meaning that I had a chance to get a full look at it. I tried the program at first, with there being many tutorials on the subject matter, however, I was making a fair amount of mistakes and made the decision to go back to Maya and construct it the way I knew. I would love to come back to Marvellous Designer, as I felt that it was a very interesting program, but perhaps at a time where the time wasn't so constricted.

When I went into Maya, the first thing that I had to do was think of a design for the arm. We were really interested in our character being a renegade cop, perhaps a detective. Watching themes from that era that evolve around those themes, the stand out theme of the character is the leather jacket that they wear, the carelessness that they have for the law and the uniform. This is evident in shows and films such as Miami Vice, Jake and the Fatman and 21 Jump Street.

Jake and the Fatman.

After I had decided on a design, it was time to create this in Maya. This first thing that I did was to create a plain, in which I added some detail, such as indents around the sleeve and a part at the wrist in which the jacket would get tighter. Once the Detail was done, I used a tool in Maya called Ncloth and turned on gravity within the program, I also had to make the arm a collider, so that the cloth did not fall straight through it. This meant the when I moved the time slider, the detailed plane that I had created, which was raised above the arm, would drop onto the arm and replicate the fabic ripple around the arm. I then detleted it halfway around the arm, then copied the remaining half, turned it 180 degrees and then stitched it together with the new half, meaning the arm was fully covered.

After I had used the arm as template for the jacket, the only thing that I needed off of the body mesh was the hand. The arm under the jacket had been deleted, this was done so that I didn't have to paint two sets of skin weights for the arm, in which it would react to the movement of the skeleton. It also meant that there wasn't any chance of the arm clipping through the jacket. This meant that I had to add edge loops in the most important places of the jacket, such as the arm and the elbow, which would stretch.

Once this was done, I took a step back and looked at the arm that I had now made, I was pretty happy with the result, especially since I have never attempted a piece of character art before, now I had to construct the skeleton which would be binded to the mesh in order to make it move within Unity.

The finished Arm.

The next part required me to create a skeleton. This was the next stage, where the skin, which is the mesh, would be attached to an external skeleton. By attaching these two, if you where to move the skeleton, the skin that it is attached to would move. The pivots that make up the key role of the skeleton are placed in important places such as the joints. These are the only things that can be moved and help us create animations. If you select the previous joint that you had put down, and then create a new one, they will link, with the parent having control over the child joint and its children as well. I made a skeleton and fitted the joints to the correct position as shown below. I then selected the two (skeleton and mesh) then selected "bind skin" option in Maya, which attached the two together.

The arm with the skeleton.

After the skeleton had been put in place, I was then tasked with painting the skin weights, this concept was completely new to me, as were the use of skeletons in meshes, however I managed to power through this part of the project with the help that is out there on the computer. It was a fairly simple concept to grasp when it came to painting skin weights, by selecting the joint that I had created earlier and selecting "paint skin weight" tool in Maya, I could paint the influence that each joint had over each part of the skin. I also had to bare in mind that each joint had to have control of a value equaling 1, so they couldn't have no influence. The higher on the list the joint was, it would also have the influence of the joints below it. It was a case of having to put the influence in the right place. It took me a long time to get this right and working within Unity. Even to a point where you changed one of the weights on the list and it would affect all of them.

Painting the skin weights.

After the difficult task of painting the skin weight had been completed, I had to then finish off the model by texturing it. This is where I was in my element, I quickly unwrapped the model, hiding the seam on the outside of the arm where players would not see it. As I had a whole map to texture this model, i didn't have to worry about any pixelation on the model, especially with it being constantly in the view of the player. I used 3 materials for this model, which where the leather for the jacket, the cotton for the sleeve and skin, but with some adjustments which is ready available in Quixel. In regards to the detail on the hands, such as the thumb nail and the creases in the skin, they were all done in the albedo and normal maps, as I hadn't had the chance to experiment within ZBrush, which is perfect for sculpting these sort of details.

The finished Textured Arm.

Head down shot of the Arm.

Side Shot of the Arm.

After the struggles that I had with this part of the project, I am extremely happy with the results that I managed to achieve. Not only does it look like an arm that would suit our game, but the skin weights as well ended up being ok in game, though the thumb, which I struggled with, got a lot of help off of George. This process though did however make me feel less comfortable creating the enemy charterers, especially with the deadline looming and the enemies splitting apart when they are shot, this would mean that I would have to create two different meshes, one that would be blown apart at all the different joints, one that would be the full mesh. I have decided that if we were working on the game in the future, I would then have the time to learn the program and process for creating a character.

The arms in Game.