Make a Topdown Pixel Art Videogame

1. Setting up the Document: Hi. In this section, we're going to make a top them with a grain markup. We're going to stare from another markup under some reverse engineering to see what guys we need to make and how we need to make them. This markup is not going to be as complex that the previous want. But you will have the tools to analyze a screenshot from the video rain on from that Really your own day, ain't it? So I made this markup on from this markup on going toe. See what I see me to make to make something similar to thes. So actually, the smoke up is a lot more of thes, so I can marketings even see. But I'm just going to work with some off this part. So first the foul. You can analyze the smoke up just by looking at it. But you can also activate, agree to have a better idea of what you what? You want to make it right. But sometimes when you activated really it one much that ties as true. So you can use the with offset on cap some tale of reference for example, the folks so I can it shows here, the X offset until it makes sense on answered the way. Offset. So my books is in shoes one tile. That way everything makes more sense. No. Maybe when you are just a with offset. If you increase juice, the X offset, you will also increase the way offset. So you should have to click this change here and now you're gonna sure each offset individually. So I'm going to minimize this on going to make a new look mint on in this document. We're going to make the types it. So we're going to directly make the title set. I'm not the markup on fears going toe. Also activate agreed here, dirty to rate her to toe. Once of the vision on There we go. So now we're going to analyze what days we need to make. So I'm going to center around dispatch right here on green to pain some numbers into unique days so I can start with a zero for the base grass style, which is just solid color so they can pain here and now let's see what else we have. We also have a solid color for dear. That's going to be I want. And now we have, Ah, the connection between the grass on the deer. So we have some unity corners that goes like these on. We also have some other corners that goes like this. Also, some straight lines to make this patch bigger or smaller. So and you're into pain. For example, a to a tree, 40 inner corners on also a four for the straight part. No, this is going to look like a patch. So I'm going to have the straight birth something like these here, and I also can flip these to make the other part on the other part on the other book. So those are farce, but we'll take that and now the inner corners to connect between those parts. So something like this on here, angry in travel NYT one, which is the vase crusty. So with this, I can make a rectangle or square with the size I want. But I also went to make some more complex shapes on for that and going to need the other corners. So if you suppose that all of the's is grass on the middle part is the dirt t o their corner is going to be the other way. So I'm going to have something more like these Where all of the's stress on this is third. So this is my zero on this is basically ah, some kind off a four. But I can't my grass here under their here on this patch Hansen if to connect with those styles. So in this case, thesis other corner connects with this inner corner. So this one So maybe this explanation is a little bit hard to understand, but a Sinus restart Megan Tiles, you will see how it works. So first and going toe save this document going to make in your layer. I knew it was father. Sorry on going to save it was agreed that document so I can precise this on start working here. So I'm going to start with my base styles going to make a new layer on going to start with the base GREss. So that's just a vase cooler. I'm going to make my grass a little bit yellowish greenish I win yellowish something guy thesis. Maybe the darker There we go. So that's my base day off the grass on now and going to make the base dirt. So something like thes on. There we go 2. Patch I: I'm going to make the paucity of this layer lower on going to start working on the's Budge . So I'm going to copy my based style to grass on place it here. Now, I want this story into tile with yourself so I can make this patch longer on the Y axis. So I'm going to make a clean layer with this. Place it here on also here going to select based style on with a raise her and going to make some grass. They can polish the shape a little bit and now I can answer pain the deer here So you can make something like these say, the great cell. So I believe this on with the field goal. Disabling feeling very selection 19 There. So now it's a good time to change the grass color. Maybe they're attar There we go on. I can choose on tartare cooler to shave a little bit. Digress also maybe interfered. Fine. So now I can delete this particular layers. I can make the rest off the patch shows by duplicating this on rotating like so maybe I will have the flips some players on. There we go. I can rename some of my Larry So help the reference back, Ron. Those heart based styles on going to merge all my style's on make some corrections where I need so here. I'm of course not. Going to see the shadow on this is fine. And here the shadow should be on the other side. Devoto. So I got actually going to delete the shadow right here, So I'm going to selected, Painted with the race, their color with feeling tyre selection on. There we go. So now we have to make a connection between the style on this one. So this inner corner here So I'm going to make a new layer on Green Bank all of things with my base, their color and then maybe the connection here going to bring some grass. I'm now the shadow on the Elect's so they're required to connection. I know. Maybe I can't the blockade office on flip the layer to have the others connections. And now we can feel these with my base, their color, and there we have the fierce part off the taste it they can marriage, and there we go. So, of course, I made things really fast. Not the point is being able to with a level with this. So I am birth at my title, said into tile to see what we can make with those styles. So I'm going to feel all with my rests on then with this patch, they can make some square patches like these off the size that they want so we can select my top part on the top part is going to be there. There. Now this corner is going to be here. No, the right birth, though. Their corner the fordham Unless you can see it there we have some budges. Now you can also, for example, shows use the corners so one cornered there feel their coronary on. So you have I really smoke budge so you can make a square patch is but assume that you want to make a patch that looks something. Burke Sambou like this You will find up Roland on this style. Those make something like these and here But here in the style you don't have any other tile that works to make that much on that piece were the older corners come into play. So we're going to make those Oh, they're corners 3. Patch II: So I'm going to move thes here on to make the other corners instead of having dared on the middle, we're going to have a grass so I can select thes for example, this style control seeking for be on, move it here on now the style I love it here. This one is going to be at the bottom on now if you can see we're having whereas on the middle on we should have to make the connection between those states, merge my styles and then make the connections. So there we go. I can flip this state. So I important my title said into diet again. Now with my other corners on, Let's see if we can make some more interesting budges on that You can see we can make batches with the shape that we want. So now I'm going to make some variations to progress, to break the monotony off the rest. So in a mock up, I have some variations with some rest there, for example. I also have some more grass on. I have some flowers. Uh, let's see, as I have some florist like that. So we're going to make some variations And for that I'm going to select my based grace style, going to assays thes going to duplicate Dale on going to me. For example, six mediations on they come, For example, select the life Korder on the start painting somewhere else. I can also say to use the light color or type one. But in my case, I think like color do spirit on. They can have to make some flowers if we make into save your really very markup like these making the basic shape some perverse like that on then Just in the insect part flow er I couldn't in color like this and then with my dark color painting a drop shadow on the bottom. So there we have some variations for progress and now we're going to make some variations to the deer. So I have some variations here. I can some rocks on some holes in the dirt so the rocks are basically ah highlight on two shadows on the holes in the dirt are basically shallow on a highlight. So we're going to need dreamer colors. So going to recess thes and and make shadow. Who painted here? Vereker shallow. Um hey, every later. There you go. And now I'm going to duplicate six time My basic. They're tight going to move my colors here on going to start with making some rocks. So again, Bane, for example, I I like there there and then juice darker color. I don't need to paint the middle part. So something thes on to make some holes because my light is coming on this direction. This face is not going to be late, but this one is going to be so That's how you make a hole into their. So there we go there because some variations. So generally this, um we have some variation for progress on also for 2 30 So here we are on again, I important night variations on now I can select my creations Clicking and dragging present this bottom Anthes every time. Likely it's going to select a random tile from the selection. So this also works for the field goal. So I compressed these on leak on. It will pain everything basically, but this looks really nicely so but you can do is go back to creator. There we go on. I can't. So Margaret stays like please with the vase cooler, so I'm having more Ah, based Greste A on I can do the same thing for the dirt makes so I can't say over my style said, That's going to update on sale. And now I cancel it all off this on rent again. On that, you can see it's less nosy. So with this, we're basically having more weather that makes so I can do the same thing for the rocks I can paint here. Hear, hear on. There we go. 4. Crate and Chest: So now we're going to start making a box on a chest. So right here I have a books on we're going to make about similar two days. So I'm going to go here on select the base rest schooler, paint health off result and the other cars with the do color. This is so I can see the chest or the box. It's going to look in a grass background on in a little background. So I'm going to work with the corridors from the other, going to make a new layer. I'm going to make a palette there, on going to move my palate. So with this color going to goto the rectangular section tool, I'm going to make a box person shift on something. Lay this no. With the darker color grains of paint. Here, I'm going to move. Some things have the proportions of me books. So I think that site I'm going to add a darker color to my palettes. I'm going to use these to make ah hollow in my books thesis on this color here to make another hole in my box. I can use this color to make I like birds here There we go. And now I've been shoes as some planks of wood I'm here with the darker color on may be with my later schooler. I can I like here. Maybe not so late, like another, another color. And now I can make a show. So instead of painting the shadow with an obey color and going to select a really dark unless citrate death grow for example, on green to lower capacity through 25% for example, on going to paint the shadow here, um, here, going to make the shadow off the same stronger. So I planed over. So because I have the capacity, a 25% happened one time paint another time in the same place on it's going to add. So we make something like that. There we go. So the point of making a transparent shadow is so we don't have to. And so the shutter works on the dirt site on progress. And now I'm going to make the just so movement pilots. Let's see, I'm going to look for a chess on my mark up. I have one here. So for the chest, I can duplicate this on like this Why there show through, said the positive Act 100 on. In this case, I'm not going to carve within blanks. I'm now in going to add some some other colors going to read with my lentil, going to make something like this on something intermediate work. Some Prue like thes here on the bottom green to add that are cooler on bein some highlights like that. Maybe I want this color to be a little bit darker. There we go on. Now let's make the shallow again. Can merch this. Tell it the pallets on Let's see current books on the rest, on on the dirt. So there we have the chairs on the books. 5. Tree: So now we're going to make a tree. So a comma tree right here on a list safeties as a reference. So I'm going to go home to my document make and your layer on going to come a tree end up off that they're off their west story. So I'm going to make a nine a tributary square like this, Grains of love fists. Hey, Wes, on going to make a new layer for the trunk. I'm going to make a pile it with the porters off my chest, like so on. Also, this quarter I'm going to use those color for a drunk and also those colors. Fourth, the leaves. I'm actually going to need more colors, so I'm going to us pressure, sensitivity to my brush on going to start with the trunk on your layer and going to rename it from with this face color and going to start making to track. As I've said on the hardware part off the section where we discussed the difference between the most on that tablet, you can make pre select with the mouse. But I were fix tablet to help sometimes, for example, on this case there we go on green to move. We drank here on going to make a new layer for three lives on with embraced that I made for the clothes off the savior Build them. I'm going to make their lives Something like that. I think going to the same degree of I'm now in green to activate y'all flock and start working on the lifts anger into qualities with my targets Cooler One thing paint the same way the same way with you for the industry. So we paint them in shape and then we make some lives like this. So I'm painting something something that day. So if I have my send their here, So let's say so like these. I am painting those leaves like these, so rotating around this point. So, like thes All right, so the next color No, I'm going to change the color. So there we go. That's basically all for the lives. And now we're going to work for the trunk going toe there can cure on all of the side because I laid the duration is coming this way. So this is going to be shaving thes so something that now, with the darker color those places. You can make some nights like this to make some texture. And now the other colors for the highlights? No. Maybe the later scholar, the later, like the scholar is not going toe reach these French so and green to do it like that. Maybe I can have some or sees. And now I'm going toe right Click the layer off my trunk selector Bake Actually, no, I don't have to do that. And she's going to select my basic brush on going to select the created saving deal to look on going to select my darkness my darker, their color unthinking here. So something like only so if I can't my leg coming this way those routes are going toe cast a shadow. So some trick he's there. We go on now with a darker color on may be Were there a good one? So something like that is fine. I'm now we're going to switch to my eraser. I'm right here as you can see, a calf some a little bit off grass overlapping the drunk so and green to make thes with the racer making some lines like this. There we go. I can make a group with my trunk. I my lives separate into two layers with control control she on their care de tree. Either lead it the And there they regress background. I'm now I'm going to make a variation of the three duplicating the layer off the trunk on green to move thes outside that group. I'm going to make some modifications. So, for instance, and going to the days going to activate Alfa Look, um, going to the elites. He's I'm with you. Help. Look, I'm going to paint like this. Now I'm going to make some tincture like these. Ah, highlight Here. I think so. Maybe I can choose 30 color for this part. Maybe darker. And there we go. We have at three. That is guts. So it came off this year. I think that on its 6. Enemy: Now we're going to make a slain so I don't have any slain on my mark up. But we made slime on the previous section. So we're going to make something like that going to make and your layer on going to work in this corner, but in breath, actually going this type with a color like this, perfect and green to make the base off the shape. So it's going to be something like these on the comes off. He stepped on perspective. It's going to come out a little bit like this now I'm going to ransom colors on ill. So I'm going to use the color off my flower to have a highlight saying, going to activate the Alfa log on, going to start painting a little bit off dark here on with the darkest color on someone to vote. I'm here going to the save you 50 for sure. Sensitivity. I'm going to start painting some light like birds on now. Dilated Goler. Maybe they went this color to be darker. Auntie school. Or to be more orange on, I can try to it Oland with this cooler. And so there We cared the plane so I can rename the layer line on. Let's see how it looks on the sun. Looks fine. I'll digress. There we go. 7. House I: Now we're going to make a house. So here, my markup ICAP house right here on the fellows is basically made up off would. So we're going to take this house as the reference, but I'm going to make us house with more freedom. So future file, I'm going to add more space to make cameras with my corruptible like So I'm now and green too. Goto my tiles. I'm going to duplicate those three tiles sequins for me on going to the Lipkis on movies here. So with this, I can basically make I wrote Now we're going to make another layer. We love this on at sometimes off rest like these Going to merge players on the green to rename days as a base Going to look thes I'm here going to have my house. So I'm going to take colors off the world on also the colors off the plane. I'm going to activate some pressure sensitivity. In my case, I'm going to start driving some making some world. With this quarter, for example, I can activate the symmetry here. Well, they're actually here. Kick into several luck on. There we go. So I'm going to make some business of would like thes with the target glory. I'm going to have these so imprinted very freely with the racer again color pick to fix mistakes. Andi also going to add another business world here. Maybe without the symmetry. So something. Take that for the vase. I'm here. I'm also going to Ah, some dirt I can paint over this style on may be with the doctor cooler on some shadow Here , There we go and going to make a new layer to make their will on going to subject of a schooler Going to find something like these and going to a duplicate with control Shea, move it here like a breast control gate on that's going to merge this layer the layer that is below the layer stack. So, like these finding to duplicate control E, I'm basically some very fusing in place. He's here on with the like, thes on May be that ate some peace. There we go. So now I have this I got Redskins for sharing and conference day flip movies there Bush this concert she a movie above thes control on the with the line tool sehs from big salute going to the 70 Russia's sensitivity with the line door. I'm goingto make this. And now with the darker color going to being here on with the bucket tool, there we go. Current activity after Lord, I'm going to saving degrees. I'm also going to movies like that. So now I'm going toe some dark colors here. I'm actually going to paint this line two time. So it's going to be a topics away, Lane. I think so. I'm here with a darker color. Now with these were basically Atlantic nous toe our dove. No, I can maybe make some kind of stick here with a later color disabling TL for Look, I think he's on. May be here with the schooler. Some things here. I think this maybe with a lighter one I can make into needles. Inflict, please. There we go. I'm going to come back to this layer. I'm not going to feel thes going back to my rules. I'm going during into layer. Great to make your layer size one pixel, I'm in green to start making some lanes like these, so each for pixels, each five pixels and going to have a lane, So 12345 Can the slain I'm now should spend finish those lines with the lane through. And now with a later color going to pain like this. So there were constant erectus. I'm actually going to paint a night here and now I'm going to duplicate this. Flip it, hold it here. But before that, going to replace corners. So I'm going to replace this color with the targets. One get in their selection on this color tweet. These were a little like a move there. I also have to believe this line here I can delete with line tour. There we go. No. Maybe I want going to merge a face. So the roof may I want this color to be a little bit darker. 8. House II: So now I'm going to work on this part, going to activate, to create, going to make a hole for my third here, though thes, actually more like case I'm now. I'm going to work on this world so I can go up. It is on. This is basically a cylinder, so I'm going to shave it on radio, activate the pressure, sensitive it again on going to shape these like this. So I have to drop shadow this piece of wood and this part it's not catching a lot of light . I know. Till there Booth, I'm now in green to make a shadow for the door. So I have to They're here today that, um a highly there have a window, maybe on something to open their green to share shape, thes birth. And now I can invert this election. So going to select in verse addiction. I was here going to pain other shallow eso here. So my bacon, my fight is repeated. So many bacon does the same thing for the other parts. So I have some bows, like thes I'm now and going to select this. I'm going to go to my rectum where actually my putting on the activity undulation with up. I'm going to subtract Tous with everything restriction ruling being just abstract aunt here and going to paint so within blanks. So I got sir, for example, with a light color and going to make everything. And I'm basically making discovery fast. So you should really that you're trying to make the coast and you're with time on more work one for the sake of failure only. I'm making things fast. So going to make so Lang's fifties also going to have a shadow. I know it later. Good Are. And now with the targets one on there we have to face for our house. I have to fix it yourself. Here. Let's see here. There we go. Now I'm going to add shadow here. Several in the Alfa on this is going to gas a little bit. The shadow here, um, with ease. I'm also here now I'm going to select a darker color. Andi, think there also here? I'm now in going to grab the grass, scholar on pain. Some grass like this and this cooler. I'm also some grass like this on. That's basically so you make a house on a top. Tamu. No, Maybe this roof doesn't make any sense with this kind of house. But, you know, it's a really room so I can delete the base layer. Fears I have toe a Luckett on here. I'm going to select this color. Except for thesis ongoing Tow it, you can actually. The elite also my palate on. Let's see if I need to make anything else. I don't think so. Yeah, right. I'm going toe enable real. Unless you can see we have so separation between this line off the grill on the actual picture. So if we want to move all of the's on keep that difference. I have to make a new layer with a new color. I think these I can make something that involves all the days off the off the thing that I went more so something that on I can grab. I shouldn't going to make a roof. Uh, I mean, I grew up coz like this I can select the boat layers with concert on. I can move them vote on. Basically, I know that I need to match this corner with this. Won't like that on that way I keep the difference off their vixens. So there we have the clothes. So you in the next video 9. Tileset and Level: so I made a character for markup. So which has hair? A torture on some pants on also for no. Maybe you want to make the Charente their fears on Benteke House Because in general you make a host fracture ITER not a check there for a house. I'm because the problem of making a character before I mean after making the house is that you might have I really big charge there that cannot enter the off the house. So that was my mistake. And now we should have toe rearrange the tiles it so we can make a group which everything on the start moving some things, the house. We're going to make those cursing and your layer selecting on selecting vote layers. Morning, Pharaoh here. Now we can let this The camera is one north Dale there will to tree. It's more it here on the country. Now we can grow up that I'm like that until we have did They said no. Maybe I can compress this mark making something rectus having thes on the including like that. So now we're going to make some final adjustments. So I'm going to duplicate my cold. I said country. Shea, right. Click at filter mask on. Start playing with some colors. So there we go. Of course you can make in the reeds. Well, modifications toe each layer with the filter mask on. There we go. So I can save these on export. The tail said we thought the background. So file expert, um, this name it this. Name it. Thanks. It disappear and she on. There we go. Now we're going to make the level on tile. So we're going to click you map with those sittings. Save us. And father, I've here on time sets. We're going to click new tile set, browse. We're going to select our taste Set and map on. There we go. So now I can start, for example, good. Selecting all of the's pressing the run them. But, um, the field option on There we go. So I'm going to make this layer. That's the base. And now we're basically going to make some rose on some dirt. So there we have the rose. I'm going to make a new layer for the house, going to select house the activated around them. But, um, I'm painted there. I'm also going toe bring the check there on the cuffs layer there on. Then you layer for slimes green to go back to my my base citic thes from them. But, um I feel, um, brain there. Now we're going to ask some Luck says just Here we go. And now some threes, Another layer from the trees going to make in your layer for decrease below the house. So So what? You can see if I pain something with transparency on the same layer, it's going to the lead. So that's why I need to make another layer. And they can also make things like this so we can say green to file export this image on going to save drought agree with on anger into sports Jesus level this opinion she expert on. There we go. 10. GUI and Mockup: So we have something like this and going to go to file, say us on going to save thespian she as a created argument with the name off Final mocha again Activate decree 32 later to do with one subdivision on. I can use makeup through it to grow up what they want. Like so group on. There we go. Now I'm going to make a monitor as with the on the previous section. So the paucity to 25% the rectangle r selection tool going to place here. This number look, boats paint on with that we have the ratio so I can disable the look and then like the racial. Now I can make a square like these with the say they want. So make a something I think this Let's see, you can press stop to maximize thes I'm going to make something like thes. And now again, directly select a big select shrink selection with one pixel on breast fillets. Movies like that on I can wear the crop, Theis, if I want. And there will. You don't see if I move this layer, I will have a transparent pixels, so you might want toe, Go to layer. Import expert input. Layer that level again. On this way, you can move the level like this on. Um basically place that the level where you want. But in my case, I'm just going to work with these bark doing with the MCA. We're going to make again user interface. So in my reference, a cap on interface, I have some items on. And so some hurts. So I'm going to start with the hurt so I can Sediq breath color, for example, Going to make a new layer on the hurt is basically something like this. I have a 45 degree angle and then making a smooth line. No, I have ID like old nine on Await old line. Have some gun dressed. How may they want to move? Thes here. There we go. That looks better. I also have a shallow at the bottom like these on now is you have to shape the hurt so I can use to colors. My house is on us. A highlight seems like that. Maybe went there were to be more situated, so yeah, basically is something like that you can place in the shares this corner duplicate. I'm like this year I went to her calve off, hurt on the converse thes on. There we go. We have the first part off taken user interface and now we should scout to make this part. So if you can see we are using our items said again. So I'm going to import my items said they're ago on. I just need this war on the ocean. So I'm going to make in your layer we live below on. Basically I need a satirical big enough to have made sure inside. So let's try something like that. There we go. I know we have like old line I like only I always have. I'm in your life where it's like color like this on a darker in Italy May I went to school or to be darker And there we go basically something like that. So I have to off those if for about a week. So here Quincas applique a thesis circle on Move it, for example. There, you know, on green to move a potion there. So we have that I can merge going to move each year. I know we have to make those bottoms so I can start. I think that at the shallow take their now the highlight shallow on the only so because of varieties in your layer well with their and then make a copy to make the yellow one. I'm going to delete these on. There we go. So we're basically done. Read the markup? No. Maybe I want to grow up thes more. I can also look the racial on the group group. It's or like these may be maybe I should have to move thes for here Think grew up hump in places and yet there we don't We can export these US final mocha disappearance. She on his thumb for the sector says you recovered to make your own Top them with a grain markup. You can start from another screenshot of having the grain or UK major on my car from the vaccination please post your service insecure in a section of the car so I can give you feedback. This is the end off the top down with Graeme section in the next section. We're going to animate the charity there that we may in to save you beat the game section