AutoTiles OpenSimplex Noise Procedural Generation Godot 3.1 Tutorial

so today we're going to go over a little experiment of mind that uses Auto tile maps along with open simplex noise to randomly generate different Maps it does have some significant limitations but it also just helps visualize what simplex noise is I thought it'd be a good exercise for showing how to use multiple tile maps and simplex noise to make interesting maps so the first thing we're gonna go over is how to make Auto tile I highly suggest looking into some other tutorials because I'm gonna briefly go over it but basically the map figures out exactly what picture is supposed to be placed in each cell based on the tiles around that cell so this picture is decided by the 8 cells around it now if you put one here it changes this original one so it links up and it'll keep changing if you continue to put more and more tiles immediately around this starting one so this tile doesn't actually have any effect on the original tile this tile does effect here but this tile like I said is only affected by these eight and how you set this up you'll make a tile map note and the tile set here will be empty you'll go ahead and make a new tile set when you get to this page you won't have a file here you'll have to click this ad PNG I'll put a link in the description so you can get this one it's just from open game art it's a great tile map for starting with Auto tiles because you need fairly extensive tiles to actually make a proper Auto tile so when we look at this Auto tile the first thing that you're going to have to do is make a region and before you can properly make a region you're probably gonna have to set the snap options it's just easiest to leave the snap on so this is how you turn the snap on and off and this in the snap options you'll want to set it to 16 because that's just the size of these tiles and you'll want to grab everything in this region and the next thing that we're going to move to is we're going to have a bit mask now this bit mask is a three by three minimal three by three needs a very extensive tilemap and even this one doesn't really fit the bill for what you need but it works very well for a three by three minimal when you have this bit mask what it's what you're showing is what the neighbors of this tile would be so like I was talking before if you have just the tile because this is the current tile that we're comparing to so you always have to have one in the middle really for it to do anything if you just have one you see that and we go back to the grass tile set now if I were to add to that tile to the side here now it has one adjacent to it on the right side so that's why it turns to this picture now so you can see what the difference between three by three minimal and three by three just standard is so this tile right here it would actually get confused in the minimal it kind of ignores these diagonals if it doesn't really know what to do with it if you didn't designate exactly what that should be then it'll just ignore them and it'll still give you this straight edge one because as you can see this tile has one that should be here and here but this like I said the three by three minimal is just a little bit smarter in knowing that you still want a straight line there and that's why I use it if like I said if you have a much more extensive tile map then you can use three by three but this is an amazingly handy tool like it will just do one more example this tile right here would be like a tea and so we have this one right here and so it picks out that picture so go out make sure you play around with that whenever I make these I always have to fill everything in and then just fill in a whole bunch of spots just to make sure that everything looks correct and I use find one or two that I missed you just missed one little square and it can make things look really silly but overall once you get it set up then it's easy to set it's easy to make the rest of the map now the trick is that we're actually going to make things procedurally and we're not actually going to add anything into the map right now so we're actually going to be making four tile sets from that same image but let's go ahead and look at what we used for code with the grass and what we're doing here in the ready function I've done a few of these before we're randomizing so we don't get the same map every time I'm actually gonna shut that off when figuring things out it's actually good not to have the randomize on so you can see if your changes are actually making the effects that you want it to so we're just going to have a variable noise that we're going to set to an open simplex noise again we don't need the random because that just makes the a different noise each time we're gonna keep it simple with just a one octave noise and the period is 12 later on we can play with these numbers a little bit to get different types of maps that we want but like I said for right now we're just going to keep it very very simple we're going to make the grass first and then we're going to put the roads on the environment map and then which the environment map is the little rocks and the mushrooms then we're added on top and then we're gonna make the background if you remember there were kind of holes in there and I don't want it to just be blank inside those holes we're gonna put some type of stone looking walls on the far side of those holes to give them some depth so to actually make this grass map we're just going to loop through the map size and then we're going to get the noise and we're going to check to see if that noise is above the grass cap which is at 0.5 and then we're going to set the cells to zero now I'm going to comment that out real quick and show you what that does so we're just going to make the grass map this is what it looks like so boom the Auto tiles don't do anything so we just end up with the basic auto tile the I believe you'd end up with the icon whatever you set for the icon of the Auto tile but what's happening is it's placing all of them and it's not realizing what's it's not even checking really what the bitmask is all the little red squares that we took the time to place so what we need to do is we need to take that tile map and we're going to update the bitmask region you can update a bit mask area which would be just a specific spot but a region you can set multiple things we're going to just reset the whole map so we're going to go from the upper left corner 0 0 to map size X map size dot Y which will be the bottom right corner and so it's basically going to go through every spot in the map and then change it to what the Auto tile should be so what you end up with is this you get a nice little border on your grass so moving on to the road map we're going to do the exact same thing except we're going to have different caps so I don't want to build roads on the holes and I don't want to build roads exactly right next to the holes but I want there to be some roads so basically I just picked some numbers and again we have to play with these numbers if you change I just thought that these worked fairly decently so basically we're gonna see if it's less than 0.3 and if it's greater than point zero five then we're also going to set the road to that Auto tile which will take just a quick look at since we've already done some Auto tiles so this screen is a little bit glitchy if you're having trouble moving it around just zoom out or zoom in either one and then you should be able to use the scroll on the mouse to move it around so if you can see I have set up again the region and the bitmask and sometimes on the road it's actually a little bit easier to see what I mean by the adjacent the adjacent cells so basically you're just gonna follow what the road is I mean just to be as simple as possible the bitmask is the road and follow along with what that path would be so if you have any trouble with this let me know in the comments but if you follow this exactly it should work also to note when you make a tile map node it usually starts off with the size of 64 or so so make sure you switch those to 16 so like I said in the script we will add that function to what's happening and again just to show you what that does if you don't update the bitmask it'll just be the brown if you do update the bit mask region then you get this nice little road and one of the drawbacks of this method that is pretty obvious is you can tell that this is made by a noise texture just by the way it's shaped but I think it still looks pretty neat now the environment map is going to be slightly different it's actually not gonna be an auto tile we're just going to pick random tiles from it so and we're going to loop through the map again we're going to see if it's above the road cap and or below it that's what I mean by that is we want to put rocks inside here between the hole and the road but we also want to have or we also want to put rocks and mushrooms in these spots too we don't want to just have it on one side of the road this is between the road and the hole and then this last part is also just the large areas of green that I was talking about picking a random number between one and a hundred and then we're going to see if it's below two you can also play with this ratio but I don't make it very high because you don't want rocks and mushrooms on every single spot then we're going to pick a random number that's less than four and we're going to set the cell to that number now the reason why I picked a number less than four is when we look at the environment tile map so we took this and I actually and I actually added single tiles how you do that exactly add a single tile you click the region and boom if you have the snap setup it'll just pick that region for you and it will add it to here and again when we look at this our options are 0 1 2 3 so in our script this returns a random number of either 0 1 2 or 3 and then we will set it to that so like I said this isn't an auto tile so it's just a basic tile set so we don't need to update any bit masks in this one so if we add the environment so then now that our environments done its and added a fair amount of random mushrooms and rocks and I think it looks pretty good now when we look at these holes here one thing I did do already is I went into the project settings you can go to environment and the default clear color I set to something fairly dark blue and the reason why I did this is it matches pretty well with the background that I'm going to add I wanted the bottom of this to just kind of dissipate into that dark abyss now this one is slightly different to actually get this to work properly if you just grab this I was kind of annoyed by this little edge here it grabs like a pixel of the road over here so I actually went over here and I just offset it by one and then you should be able to grab what you need basically this offset just pushes the X to the right one I did add a bit mask okay we're not gonna have a needs that are above or below and we want to make sure that this is three by three minimal again this one is just this end to the right this is both sides it'll pick a random one between here you can actually prioritize which one you want to have more with these two you can set the priority here I'm not 100% for sure which one is I more often we'll have to check that out I don't know if this happens a third of the time and this once happens two-thirds of the time or if there's one is first priority and this one is second priority I honestly don't know but we'll figure it out going back to the bit mask like I said just added this to just give a little bit more randomness instead of just having the same texture over and over again so when we come down to this make background we're going to loop through every spot in the map we're gonna see if the grass cell is empty and then if it is we're going to check above it to see if there is grass there so the reason why I split these into two different spots is I don't want to bother with checking both of them over and over and over again basically there's no reason to check to see if there's grass above it if they're if we're not actually going to put it there anyway so what we're looking for is this empty spot in the grass and then we're going to check the one above it but if this spot is empty there's not a grass above it so we don't want there to be just a whole bunch of walls in here we only want there to be walls if there is an empty spot with grass right above it so again we're going to just make sure that you check the grass but then we're going to set the background cell remember that's the that's going to be the Stonewall and then we're going to update the bit mask again when you do yours you might notice that the background is a lot brighter than mine and so I kind of played around with a few things and the best solution that I had if I made just a quick four egman shader - just lower the alpha of the picture the lower it got so it just dissipates into darkness and I think I matched the color like I said and with that alpha drop I think it blends in very nicely so what that looks like real quick without going too much into shaders that's kind of a topic for another time but since I have it in this example I want you to be able to make be able to replicate it so when you go to the tile set like I said I went to background tile set and I made a new shader material then you have to type in this exactly like I said I'm not gonna go too far into this it's a very simple shader go ahead and copy this and get it in there and it'll make it just fade into darkness a little bit better so once you've done all that we can randomize again end up with a bunch of interesting paths and holes that you can fall into so I hope this gives you a little bit of an idea of what's possible with open simplex noise when matched with the tile maps and specifically the auto tiles

Channel: Gingerageous Games

Views: 17,507

Rating: 4.9560437 out of 5

Keywords: Godot, 3.1, autotile, Tile, Tilemap, map, Random, Open, Simplex, Noise, generation, tutorial, how, to, Make, Game, Development

Id: SBDs8hbs43w

Length: 16min 38sec (998 seconds)

Published: Tue Aug 20 2019

Reddit Comments

[u/gamedevmanhyper]

Great tutorial! Thanks man!

Can't wait to set my teeth into Godot as well, but need to complete a project with Pygame first.