Scratch RPG | Devlog #02 | Tile Layering & Collisions

Key Takeaways

[Music] hello fellow scratchers welcome back to episode 2 of my devlog building an RPG a role-playing game in scratch this project is destined to be one huge epic tutorial so to ensure I get things right before the official tutorials begin I'm documenting my journey so you can join in the fun last time I shared how I managed to get a working tile scrolling engine and began work on an awesome level editor but there were problems specifically gaps appearing between tiles gosh I mean look at this tree so stay tuned for a look at how this can be fixed and later on find out why Collision detection in this project almost brought me to tears yes it's true are you ready let's delve in well let's start with these ugly tile edges I knew when I picked this tile set that this would be an opportunity to try something new many of the tiles are not full squares but instead have transparent masked regions and only look good when they're layered on top of another full tile the existing tile grid system I have only supports a single layer of tiles but it's no big deal to duplicate that up and then have a way to set which layer I want to edit in the editor here I am editing layer 1 the bottom layer once the grass is placed down I can switch to layer 2 using the number 2 key on my keyboard and begin laying down the tree again oh yes this is much better do you see how the grass shows through the edges of the tree perfect let me do the same for the raised area below smooth out our layer 1 and then on layer 2 brush in the raised grass area again super I'm really liking that and it doesn't stop with these costumes we can also now bring in one of the larger structures like this awesome looking house as you can see the layering works great now I'll just stop there as I don't have a lot of room but what I wanted to show you was this although having two layers allows us to fix the issue with costumes overlapping we could take this further what if we were walking behind this house shouldn't this high up roof appear layered in front of the player the same goes for this tree right well watch this I'll remove the upper portion of the house from layer 2 and introduce the new layer 3. if we assume our player is standing on layer 2 then everything we paint on layer 3 is above them and so it is we can create this really fun illusion of depth we can walk in front of the house but also behind it so cool layer 3 is in front of the player this same applies to this tree that makes the level so much more immersive you might realize quite quickly that certain tile costumes will consistently need placing on the same layers so to speed up the placement I added a cool feature to assign a default layer to each tile type in the tile palette see that the ground tiles are all on layer 1 the Treetops layer 3 and the tree trunk on layer 2 and you'll love this I can change the default layer right within the editor just by tapping the number Keys cool stuff so let's see this in action I can switch to Auto layer mode and lay down a tree to confirm it worked we just check we can walk around it what a cool feature but I can't help but wish there was as a way to speed up tile placement especially for these larger assets that are constructed from many many smaller tiles it just gets so tedious in our Mario tutorial we introduced tile Auto arranging do you remember that where tiles would automatically switch as we drew to make them fit together correctly that was sweet but for a tile set of this complexity it might be tricky but because of the tiles are already laid out in the same order we want to lay them down I came up with another idea to make this work I think you're going to love this too what I can do is hold down space before I start drawing and then as I move across with my mouse the selected tile in the tiles palette also switches in the same direction I move this way in no time at all I can lay down an entire house wow look at that and it's done it with all the correct layers too so cool also if I move into some free space see how I can press space and just move my mouse around so even without drawing I can switch costume this way I can pick out the exact costume I'm after without having to click over in the palette to the right this also works for more intricate structures I can choose when to move on to the next tile costume as I draw as it follows an easy predict pattern well since we can change costumes so easily now we can even work full screen without having the need to have the palette visible now that is really useful and I can still pick to use any tile visible on the screen using the tile picker e key and then continue to work from there so the building process is super optimized now which is fantastic news for us imagine how much faster we will be able to put together and try out our RPG worlds yeah of course there are still a few layering combinations that are just not possible with three layers so we need to just work around them for the time I'm being clever level design has always been a big part of tile based adventure games man this is all looking so so cool I just can't wait to make this into a game are you as excited as me yeah okay guys the editor is really shining so I decided it was time to focus on the actual player and their movement in the game or more specifically where they can't walk due to a tile Collision now because we are stamping costumes we don't have the luxury of using scratch's Sprite touching blocks instead we have to go off the tile grid list contents we know which tiles our player is touching and we work from there the simplest approach would be to tag each tile costume with a straightforward I am solid I am not solid status then we can calculate if the tile We Touch is solid we stop the player and if not we can walk on but in the tile sheet that I chose things are not that clear-cut these tiles for example are certainly not fully solid but they do have solid edges it appears so my next idea was to Define which edges of each tile are solid I coded up an awesome Edge editor right into the level editor so I could quickly sketch on the solid edges per tile and then I got to work scripting up the Collision code and no it wasn't quite as straightforward as I hoped but I got there and here we go I can tell you things are working pretty sweet well for some time at least I kept this design but problems have emerged some of the tiles in the tile set don't fit with my Edge Collision Concept as the Collision edges in the costumes don't align to the edge of the Sprite at all this was very upsetting after all that hard work and I was a little stumped as what best to do so I thought if the tiles were designed with half tile collisions in mind maybe defining which quarters are solid and which are not would be a better system yes I had to recode it all and no it didn't work I sadly forgotten I'd need to factor in the cases where the Collision edges were paper thin rubbish never mind so what back to edges we could use edges but segment them into half edges oh man this is getting far too complicated and then I had a different idea how about rather than edges we switched to nine pins in each tile each pin could be solid or not and the rule is that the player's hitbox cannot pass through a pin as long as the hitbox is bigger than the distance between the pins then we could never pass through a gap yeah that was it this was a system I was happy enough with it worked and that was not deadly hard to script oh thank goodness and thank you for watching my devlog if you're excited to get started with the actual tutorial then smash that like button now and let me know what you are most excited about in the comments below the video don't forget to subscribe to the channel too I'm thinking we might begin next week with a tutorial on the text engine as that will be super useful both for this RPG and many other projects besides so yeah subscribe and make sure to check that Bell icon too in the meantime work on this RPG continues and with the help of Crystal keeper 7 do check out his YouTube channel we have begun to expand and update our tile set too but that's it for today I hope you have a great week ahead and scratch on guys [Music] thank you [Music] thank you