Introduction to Substance Designer

Hospital Tiles:

During this time we practiced using Substance Designer to create textures; mainly being the use of different kinds of tiles. To being this we first started out by creating a project in Substance designer and figuring out what kind of tiled texture we wanted to create.

We first started out by using uniform colour nodes for each of the 4 starting nodes that we needed. Such as a turquoise green for the overall mesh colour. Within the uniform colour node there is also an option to change it to grey-scale, which we used to adjust the metallic and roughness values for the mesh to make seem more like a tile and less like a polished piece of metal. Finally we used the RGB numbers 127, 127, 255 to create the normal map colour for our information to be projected on, and then which could be used for textures in game.

 The first step was to create a pattern of tiles with a setting in mind. For my texture I wanted to create an old mouldy type of hospital tile. To do this is first made a multiplied my tiles to fit the cube in a 10x10 pattern; then by using a tile generator, this made a got rid of random tiles to make the some of the tiles invisible to give it more of an organic look, as if tiles had fallen off over time.

As Substance designer works similarly to Photoshop, where the designer can uses masks to only let certain texture information though, this process took a while to understand. As well as this, most textures we learnt use a blend function, where information would be places on a foreground and background, with the option of having another kind of information work as its opacity to let even more particular information through.

SP Graph close up

Once the tiles has been randomly generated, we also used another function to make the tiles look as if their sides were rounded; which also used masks and the process of blurring the edges of the squares, giving them a more realistic appearance.

The main focus of this was detail, as rather then created a tiled wall in something such as Maya, UV mapping said wall and then texturing it, this process takes a lot less time but also needs a certain amount of time needed to make the textures worth while.

Overall Map

The background of the mesh (which the tiles sit on) was a combination of different layers of textures. The very ground of the mesh was created by combining different colours projected through different Noises. These are pre-rendered textures that give detail to the surface they are projected onto. Alone with standard detail, these Noises can also be used to seemingly subtract or add height detail onto the mesh. Although it would all be on one flat surface, it would give the illusion of depth.

Taking into consideration of what wall tiles uses, I also needed to create the adhesive used to place the tiles on what walls. To do this is created my adhesive as a random tile generator again, however this time also randomising the shape of each square. I did this in a few different kind of variations to not only misshapen the outer edge, but to also project grime and detail within each square, again having its detail be randomised to create an organic piece.

Once I was happy with the result, I place this into a blend with the pre-existing tiles, having the adhesive sit between the green tiles and the background.

As I wanted the piece to look less uniform, I used a function within the colour choosing system within Substance Painter that works similarly to the Colour Picker in Photoshop, in which I could use a existing image, and run the mouse along the image. This would make a gradient like palette, which could then be used on the mesh. I used an image of mould for the adhesive and some form of old stained wall for the background.

Once all this was done, I needed to create some kind of watermarks on the tiles as its realism would keep with the mould and moisture of where this texture could be used. This was near enough the same process as the others where I could take the random generated tiles, decrease their size, warp their shape and then make place them only on top of where the green tiles were. Because of the mask from the beginning (which was created after the Tile generation) most information could be used from there, is made to say anything within it that is black is in the background, while anything that is white would be in the foreground. With this I could make it so that the watermarks were only project onto the white (which was the green tiles).

SP Render

Close-up

For this trial with the software I mainly only used the 3 of the main 4 starting nodes, with that being colour, normal and roughness. Although I would have liked to work on this texture more, such as experimenting with the height information of the tiles, I am happy with how this first time use of the program came out.

Mayan Tiles:

When it came to creating the Mayan influenced tile we used a similar process to when I created my hospital tile texture. I began by setting the uniform, normal map, roughness and metallic colour and values to be something similar to stone. Rather then creating a uniform texture pattern this time however, I created a pattern but this time experimented with differently shaped tiles; using squares and rectangles of different sizes.

Like the hospital tiles, I smoothed the edges but this time trying to make each tile as unique as possible, as while a the hospital tiles would be uniformly cut, these would have been made of stone and would each have a slightly different shape. Using various Noises and Blend nodes to project the shape of the squares through them and distorting their shape achieved all this. I was also able to change the overall distance between the tiles in the tile generation sequence, which was possible in the settings.

Mayan Graph Close-up

 Once this was complete, I moved onto adding smaller amounts of detail onto each tile. Within this experiment the detail was achieved by taking the tiled pattern and projecting some form of damage onto them. The overall shape, the damage around the edges and the damage on the inside of each tile was made by projecting different variations of Noise details onto select parts of the texture, with some adding information and some taking information away.

With the overall detail of the tiles finished, I added a background colour to the mesh as well as setting the tiles to give height information rather then simply projecting the tiled pattern. This gave the texture a form of depth, making the tiles look like they were carved into the surface.

Overall Graph

To add to the aesthetic of the tiles, I used an existing image of a tribal skull to make add another level of detail into the texture. I inverted the black and white colour scheme to do this and then by using Substance Designer’s nodes I was able to isolate the information needed. I was then able to project this onto the tiled pattern and make it look like it had been carved into the stone by having the image subtract height from the mesh.

Once all this had been completed (the tiled pattern, different levels of damage and the tribal carving) I once again used the colour picker function to choose realistic colours from an image of sandstone and after a few variations I was able to find one that made the texture look as realistic as possible.

SP Render

Close-up

Although I am happy with this piece, I would have liked to figure out a way to fix the tribal carving projecting onto the background of the texture and only be on the carvings. Although this is only visible on close inspection of the texture, and could be fixed by slimming the gabs between each individual tile, I would still like to fix this in the future.

Georgian Tiles:

With this task we were given more freedom to pick a type of tiled design to create. Originally I was planned to take inspiration from Bloodborne and create a cobbled street, however I realised that the shape of the tiles would be fairly similar to the Mayan tiles, I designed to go with a more stylised type of design.

I looked into Georgian tiles and their complex pattern design and decided rather then placing more attention into the overall shape of the tiles themselves I wanted to create more detail for what was on the tiles. 

I began by going with the usual format of first setting my parameters of uniform colour, normal map colour and grey scales for my roughness and metallic maps to get the basic look. Similarly to the hospital tiles I made a tile generator, this time however going 5x5; then going back to my uniform colour and using a blend with my tile generator to set the colours for the foreground (the tiles) and the background (which would later be the adhesive and grout).

Once all the basics were set I moved onto creating my pattern by using the shape and transform nodes within the substance painter graph. This took some time, as each shape would need to be made individually or moved to make a symmetric pattern. For the blue diamond pattern for example I first made the square pattern, and then by using the settings within the certain nodes. I was able to make a more complex pattern. I did this as well for the flower and then leaves, using functions within the nodes to try out different patterns that would work together.

Once each was complete I blended them all together into a single transform and moved onto colour. I made each one a different colour, using the green and red/pink for the flower to achieve the most contrast and becoming the most eye catching. 

Now that this was complete I needed to move on to adding damage and other forms of aging to the tiles. I first started on the background as this would be more prominent then the watermarks. I use a randomiser mask on the tile generation to remove tiles bring more of the background through so I would be able to view the background easier.

Georgian Graph Close-up

Rather then using just two random noises to create a texture for the background, I looked at each of the different textures and tried to imagine how I could combine them in a more complex fashion. I test multiple combinations until settling on a final one, which could be the overall background and then moved onto the adhesive what would be stuck under the tiles. I found two noises that made a cross pattern I felt would work well, and using a few other textures I was able to make a seemingly organic type of background, as I felt that went well with the time period of the tiles.

Using what I learned from the hospital tiles I was able to take a second set of 5x5 tiles, make them smaller and warp the shape of them, creating an organic looking adhesive. Once this was all created I simply needed to use masks and blends to project the different information onto the adhesive and background. By using a gradient colour picker I was able to find a combination of colours I felt worked well with the foregrounds tiles. With the combination of the cross pattern and the other textures I felt that this worked well in making a realistic background for my tiles.

Overall Graph

Creating the watermarks for the tiles was surprisingly similar; as with grout I started by combining different noises and textures to create an over texture. I then use a levels node to enhance the lights and darks so the watermarks would be more visible. I then projected this texture on top of my tiles and plugged it into my roughness map rather then the base colour. At first the watermarks were projected over the entire mesh including the grout, which was not what I wanted, but by using the tile generation as a mask (as this showed exactly where the grout and tiles were respectively) I was then able to project the watermarks onto only the tiles.

Now that the tiles were created and had all the damage I wanted done to them, I exported the overall textures as to types, the first where the tile was completely intact and the second with the missing tiles and background damage. I did this as I was going to load the texture information into UE4 as use vertex painting to freely paint the damage onto the texture. This is a very useful process as rather then copying and pasting the same damaged texture over and over again which would look stagnant and repetitive, this process would let me choose which tiles were missing. This process also has a lot more potential as more layers of damage could be applied to the tiled texture and by using different RGB channels in UE4 a lot more variation could be applied to different parts of the texture, rather then it being repetitive.

UE4 Graph 1

UE4 Graph 2

UE4 Graph 3

UE4 Graph 4

To start this process I loaded all the textures into UE4. Then I created a HeightLerp node, which acted as my foreground and background (also, as I was only using a single channel, with having the tiles either clean or completely broken, I only needed to use the alpha and not the different RGB channels.) I used this method of the metallic, roughness and normal maps as well before plugging them into the respective final node. Once complete I then exported the random tile generator as a height map and plugged it into each of the HeightLerp nodes. Finally I set up the vertex colour map to allow me to add and take away the foreground tiles it the material was complete. 

Example of Vertex Painting

Watermarks Close-up

I found this project to be very interesting, as it has shown me another skill that can be used within the industry. Although at the moment I have only been looking at tiled textures there is a lot of potential that this process could be used for such as micro detail on meshes that wouldn’t cost polygons but could still achieve depth and results. I am happy with each of the textures and enjoy the concept of vertex painting; where instead of creating multiple textures to sit onto of each other, an artist could use substance painter to create a single graph of multiple layers, such as the grout, main body, grime, watermarks, burn marks etc, and then use vertex painting and different RGB channels to apply different detail where necessary.

Game Jam - Lunch Crunch (3 Days)

Boiling Point:

For this project we as a year was tasked with creating a game within a short amount of time with some form of theme (in essence, a Game Jam). We were tasted with creating groups of 5 and was given the theme to be Boiling Point; this theme we could interpretive however we liked and had to make a single screen game (camera would not be allowed to move) that had around 5 minutes of gameplay.

During that afternoon we as a group decided to brainstorm different ideas and ultimately we decided to go with a 2D plat-former set in a kitchen to go along with the theme of Boiling Point (quite literally). We also had the idea that although the camera couldn’t move, we could create multiple levels that would transition to the next when the player gets to the end, that way we could put much more into the game while also keeping to the rules. Although we decided to go with a 2D game format, as one of the members in the group stated they weren’t strong using software such as Photoshop, we decided to use a 2.5D layout, as this would possibly add to the games overall look with hand painted textures, however this also meant having much more work to do unfortunately.

To begin we assigned ourselves jobs (mainly as this was we would but on our credits of the game). As I was assigned the job of lead artist I spent most of my time creating the 2D sprites of the characters within the game. As the game was set in kitchen, with our plan to have to levels in a fridge (ice level) countertop (normal level) and then the oven (hot level), we tried to create a wide range of characters.

The person who came up with the game idea also worked on the artwork of the game, finishing off the characters with facial features and later helping with the animations of the game. We ended up working with a good format, as I would sit next to him and design characters, he would tell me what would work, what wouldn’t or what might be a good idea. We gave each character backstories to help up speed up the process, using humour and jokes to keep it light hearted. Once I had finished a character, I would then send it over where he would add the facial features and at the same time I would work on the next character. This process worked really well although we were continuously working non-stop, we were able to finish most of the characters within one day.

Character Sprite Sheet

Character Sprite Sheet

Characters with faces

Once each character was finished we each took a few and gave them arms and legs and began making the sprite animation. As I was new to this I would have taken a little longer, however after being shown and being reminded of stop animation this process didn’t take to long. Each character would have an idle, walk, and wall jump and dying animation. We took inspiration from Super Meat Boy for its fast game play, with as soon as the player dying, they can start straight away without loading of respawns, thus not taking the player out of the immersion.

During this time another member of the group was making 3D assets to be placed in the game, these consisting of blocks to build the levels with, and different kitchen utensils that would kill the player. As a day had already been spent with character creation, a lot of the assets had already been made and unwrapped. Once the UV map had been sent over we once again split the workload between me and the other artist, and began creating hand painted textures.

As the blocks would be used to build the levels, I designed the textures for the blocks specifically with each level in mind. For example, ice blocks that would cause the player to slide for the fridge level, or wooden/marble blocks for the kitchen level. Another good feature of using blocks to build the level was that once the UV map for a singular map was made, I could make countless other textures for the blocks to build the different levels. Other Meshes that were made were such things as an oven, meat tenderizer, frying pan and a few others.  While there project wasn’t completely smooth sailing such as a heated dispute about what certain blocks should do or where they should go. However even with disagreements about the utility and how aesthetically pleasing certain choices would be, we ultimately was able to texture all the blocks and utensils for the game (equalling to around 15 individual different textures).

Icicle, Ice, Snow, Concrete Blocks

Honey, Grate, Marble, Wood Blocks

Oven, Meat Tenderiser, Hot, Obsidian Textures

Saucepan, Knife, Honey Jar, Frying Pan Textures

While all this was going on two other members of the team was working on the game itself; with on planning level design and the other creating the blueprints for all the moves in the game, including the blocks specific properties (such as the honey jar slowing the player).

The final part to do for the artists was to create the Start screen, character select screen and controls screen. the character select screen i decided to use the sprites we already had to make it much easier and to save time, for the background I did a basic render of each of the levels to give the player a sense of understanding as to what was to come. sticking to the humour route the start screen was all the characters doing the cliche jump from an explosion, as i felt this showed the humour of the game. As one of the other team members had time he was also able to help me with the custom buttons we used in the select screen.

As with the controls screen, we wanted to keep the humour blunt and to the point, as well as to not confuse the player. We made the controls screen as simple as possible to do so.

Title Screen

Character Select

Movement Screen

It was the last day; all the meshes had textures as well as having each character individual sprite animations finished. It was at this time however everything started going wrong. Out first problem was that the member creating the blueprints for the game wasn’t able to have the screen transition between each level, thus we wouldn’t be able to make multiple different levels. Although this could have been rectified if they had told us sooner (as it was one of the first jobs we needed to be finished) we also understood having one person doing all the blueprints for the game could have been too much of a challenge.

Blueprints

Unfortunately there were more problems to come about. The first again involving the blueprints, this time after working before something went wrong with the characters wall jump; where unlike a normal wall jump, the character would slide straight up the wall. This caused a problem as it took out the skill of timing jumps the player could now stick to the walls.

The final problem was a combination of everything else that had happened. As it was the last day and we were unable to have the multiple levels, all previous work on the game have to be placed into one level to show off everyone’s hard work. As we each couldn’t work one the level, as only one person couldn’t transfer data over because of errors happening, the asset production artist (who had also helped with blueprinting on the side) took the project home to try and combine everything together seamlessly.  This however backfired, as now the scene was far to cluttered with all the meshing trying to kill the player as well as being a much more cramped space for the player to play in. another problem was as all the meshes ran on the same blueprint, the swinging knives for example moved at the same time making the game seem robotic.

Final Level

As we had some time in the morning to try and tweak what we could we asked to have some of the meshes deleted to give the player some chance to actually play the game, as previous play testing’s had players die after the first obstacle. The artist however made the stubborn comment of his hard work would be less visible (as there was far to much going on and we needed to have at least half the obstacles in the level), and almost refused to change anything at all.

At this point there was no time left to argue and the game subsequently didn’t win any of the challenges set of this project (such as best 2D game, best humour, etc.) as in our review our game was stated to be to hard, and therefore the furthest players could get was the second level within the scene.

While arguably pointing fingers of blame wouldn’t help, it was still a loose that I felt could have been rectified due to better planning. If we as a group would have worked harder on the game mechanics first and perhaps less on the artwork perhaps problems couldn’t have been sorted. However knowing the game lost simply because it was too hard after most of the group clearly seeing this problem was vexing, ultimately this project taught us what working in a group meant.

During the short time of this project, I thoroughly enjoyed working with the other artist partner to create a good workflow, as well as seeing our creations and textures in game come to life. From what I would take away from this project would be to stand stronger against my instincts, as well as the way to work within a group, for better or worse.