[Music] foreign [Music] this tutorial is the first of a series of different tutorials of how to make components for a 2d platform again in this tutorial we will be creating a very simple tile map with a player with idle and run animations for the Assets in this tutorial I'm using warps caves by antimos and this can be found at hio which are free to download I will leave this link in the YouTube description now let's head over to Godot and start to create our project so click new project give the gamer project name we'll leave it at forward render choose your folder to save the game and then just remember to create the folder for the game I'll click none for this option because we don't want any Version Control on click create and edit I have a preferred editor layout so I'm just going to set my layout first so feel free to move around your tabs if you wish to use an editor layout that's similar I find that it's very easy to have my file system on the left hand side and then I can filter my files here the history tab is next to that then I have a scene an import tab inspector and then node and then my main viewport is here where I can view my 2D nodes and I can also review my scripts as well and we can run the game here when you're happy with your layout you can save your layout here and then recall that later okay let's begin by creating a very simple tile Mark click on 2D scene and you can rename your scene by just pressing F2 and then type level and then add a child node and choose the tile Mark mold in the Talbot node what we want to do is want to create a tile set but first what I'd like to do is just create a new folder to store my tile set in and then head over to the warts assets collection which you've downloaded bring them over and then in the watch files under PNG in environment go to layers and then we want this tile set here so what we can do we can click and drag that over into our tile set but then just drop that and move that into the folder and then let's rename this I'm just going to call this game towel set one okay and then in the tile set here we just click create new tile set and then we'll get a tab down here that we where we can add that so we've got towel set and tile Mark now click towel sets here and drag it over into your tiles and it will ask you if you want to Auto create your tiles using the atlas texture so what we'll do we'll click yes and it will automatically detect all the tiles within that tile set now for this tutorial we're just going to create a very simple platform for the player to be able to stand on and move and run along so zoom in on the tiles and we're just going to choose this tile but first we need to just configure a little bit more in our retail map so we need to create a layer and we'll just call this ground and what we need to do we also need to create some Physics as well for that so now click on Pulsa and add one physics layer so the physics layer will be added to the tile and each physics layer gets a layer name so what we can do we've got layer one layer two layer three four and so on but what we want to do is we want to put our ground on layer one so open up the edit layer names and in layer one like the word ground then you'll see the layer one is now been named as ground and the Collision mask is also ground so we can leave that as it is now pop over to your towel set again and click select and select the tile that we want to use so we want to use this tile and then in the physics option in the physics layer 0 which corresponds to this physics layer here click in inside this box here and press F on the keyboard to activate the layer and what it is now done if we zoom in we now have a collision box that fits that tile perfectly and what that will do that will apply that to to the tile so what we can do we can click paint and if you select the physics layer again you can click other tiles and they will paint other tiles but for now we're only going to keep this simple one for a very simple tile mark so that's all now configured what we'd like to do is go over to our time up select the tile that we'd like to paint and then you can start to paint it to make this a little bit quicker if you click the rectangle box here we can then draw our platform and that's everything for a very very simple tile mark now let's save our level convert a new folder wallet levels and save our level suit so soon serve soon choose levels and click save now that we have a simple platform let's begin creating our player so click scene new scene new 2D scene and what we want to do is we want to change this and all so we can go to change type we want a character body 2D this is a special nod which we can use for moving characters and another thing for enemies so change and we'll see the icons change now let's rename that null to player and create a new folder to store our Player information in so create that and let's save that scene so we say save scene and pop it into the player folder player we want to create idle on run animations so let's add a child mode and what we'll use is the animated Sprite 2D notes so we've got animated Sprite 2D create that node and then we need to create some Sprite frames so click new Sprite frames and then open that and we are giving our Sprite frames windows so in this window we can create new animations for idle on run change the frames per second for the animations Loop and auto load so now head over to the awards collection again and go into png's Sprite sheets player and now find our player idle and player run Animation Sprite sheet so drag them over into the player folder I'm like speaking creating our first animation so click new animation F2 or double click and then decide on we'll click the add friends from Sprite sheet option go into the player folder and click player Idol what we now need to do is how to have one image per frame so we need to change our vertical option we've already got four in the horizontal so we don't need to change that and then just click and add the frames what we can now do is zoom in on the player and click click play and it will start to animate those frames let's increase the frames per second to speed this up 10 is okay so we'll leave this on looping so that the animation keeps looping around and because this is the very first animation in our set we will create we will click Auto load because we always want when the player comes into view the first animation to be idle let's create our run animation and click up Sprite frames again and click the player run spreadsheet again reduce vertical to one and increase horizontal until we fit all the images into each frame so there are 10 frames in the Sprite sheet let's highlight them all and add 10 frames let's click play to run the animation and increase the frames per second to speed the animation or get the correct speed for our animation and 12 is okay so we'll leave looping on and we're not going to Auto load this because we don't want our player character to be running automatically when it comes into view okay let's pause that animation let's set back to idle again and then click our player option here now zoom in on the player and we can see that the asset and the pixels in this are blurred now this is going to be a pixelated game so we want Pixel Perfect asset now click project project settings we need to make a change to the renderer and in general under rendering in textures if you look at the default texture filter we have linear and we need to pop this onto neera so returns this to nearest and go close we can now see that we've got better pixelation in our assets the next thing we'd like to do is to move our asset so it sits on the x-axis so the fee are slightly just below the x-axis and we can do this by clicking animated Sprite and moving our Sprite up now I don't want to do this on the player node because I like to keep the origin on the x-axis so we can see with this icon here it's on there and I want to just move the Sprite up itself so click on animated Sprite and go to transform position and change the y-axis and then we can see that the feet are just touching that if you then click on idle and play you can see that the animation is running and then click run and zoom in again and the feet are just touching the x-axis just falls out into the back I'll pop it back onto idle so again look at the player node and we've just currently got a warning message on here and what we need to do we need to add a collision shape so add a new node search for Collision chain click create and in the Collision shade we also need to add a shape and that's what this warning message is for so we need to click this option and go to capture 2D and again the capsule is at the x-axis zero so we just need to move this as well so pop this is roughly in the middle and then drag that open expand that can make modifications here and just reduce that a little bit to make it a bit smaller okay that fits my player perfectly now that we've got a capsule collider for the player we want to then go back to player node scroll down and this is for the physics and the collisions so if we hover over layer one we can see we have that ground layer but we want to put our player on a different layer so we'll do that on Layer Two click this option here I did layer names and in Layer Two add layer close and change the layer that the player is going to be on so deactivate one but the mask we're going to leave at one because what we want to say we want to say the player has its own collision and layer but the player should detect the ground now that brings us to the end of this tutorial watch the next tutorial where we add a player script and take inputs from the keyboard to make the player move if you like the content of this tutorial please remember to click like And subscribe and thank you for watching