Nash Posted May 2, 2011 Share Posted May 2, 2011 The Art of the Pixels: Pt IA Tutorial by Cowboy14 Note: PLEASE reply to this topic once you have read it. Its been too long for me to remember exactly whats hard about pixeling so in order to better help you I need to hear questions/input from people just starting out! Other Useful Tutorials to read through along with mine:Quer Skull's Pixel Tutorial Ceddo's Pixel Tutorial Im going to break this down into multiple parts, this being the first part of an entire tutorial. Breaking it down into three different threads will ensure you dont get too much information thrown at you all at once. Part I: The LandscapesPart II: The PeoplePart III: The Buildings/Rooms And so it begins... Part I: Landscapes. Step1: Make a Canvas; In this case mine is 300x150 Step 2: Make a horizon line dividing the sky from the ground. Step 3: Make your first layer of mountains. Step 4: Make your second layer of mountains. Step 5: Make your third layer of mountains. Step 6: Make a river in the foreground to fill in the space. Step 7: Draw some other things like trees to fill in the space. Step 8: Its important for the placement of things to make sense.In this case, the tree was cut down so theres a tree stump along with the rest of the tree behind it. Step 9: Continue filling in the foreground untilyour satisfied and it doesnt look empty. Step 10: Added a dragon hatchet. Step 11: Added a road. Its a cheap trick to fill in space. Step 12: Added more stumps. Step 13: Shading the mountains; start with the first row.(the first ones you drew) Step 14: Shade a darker part of the mountain closer to the ground. Step 15: Now shade a lighter part on the top edges of the mountain.This is where the sunlight would be shining on the most. Step 16: Shade darker spots some more. Step 17: Shade the other two rows of mountains.They should end up looking like this. Step 18: Time to shade the grass!-Start with the furthest back ground. (by the mountains)-Basically just scribble different shades of green around. Step 19: Make darker scribbles. Step 20: So now your grass behind the lake will look like this. Step 21: Now scribble the water like you did with the grass. Step 22: Darker scribbles. Step 23: More scribbles. Step 24: More scribbles! (more shades of blue) Step 25: More scribbles!! (still more shades of blue) Step 26: Now do the same scribbling technique for the grass in the foreground. Step 27: Tree stumps are fun.Step 28: Scribble vertically like tree bark.Step 29: Darker scribbles Step 30: Scribble like you did with the grass and water but on the road now! Step 31: Make a gradient for the sky going from light to dark as you go higher up.Using dithering shading techniques helps alot for this sort of thing (the checkered shading) Step 30: Add little details everywhere you see fit, add a border and your name and you have a sexy new pixel sig! And there you have it. Now this may not be the greatest way to pixel but it is in my opinion the easiest not to mention the way I learned how at first :thumbsup: . Feel free to post your work on this thread and ill help you with any problems you may have! Goodluck pixeling!Cowboy14 Pixel Signature Made By Me.Pixel Art Tutorial * Pixel Gallery * My Free Pixel Sigs Shop Link to comment Share on other sites More sharing options...
Tim Posted May 2, 2011 Share Posted May 2, 2011 I love it. I've always loved doing Pixel Art but I've never been good with the blending. :thumbup: Popoto.~<3 Link to comment Share on other sites More sharing options...
Cacmypants Posted May 2, 2011 Share Posted May 2, 2011 That's an interesting method, I may have to borrow from it to make my game backgrounds. I was wondering though, wouldn't people need a general feel for what they're pixelling before they just 'scribble' for detail? I know I would have to be very careful if I tried. Link to comment Share on other sites More sharing options...
Nash Posted May 2, 2011 Author Share Posted May 2, 2011 I wouldnt say scribbling grass is hard. The water is trickier but still not super difficult. Id say shading only gets hard when you do people and inside rooms. As for landscapes its alot like painting, just blobs. thanks guys for commenting so quickly :) Pixel Signature Made By Me.Pixel Art Tutorial * Pixel Gallery * My Free Pixel Sigs Shop Link to comment Share on other sites More sharing options...
Cacmypants Posted May 2, 2011 Share Posted May 2, 2011 I wouldnt say scribbling grass is hard. The water is trickier but still not super difficult. Id say shading only gets hard when you do people and inside rooms. As for landscapes its alot like painting, just blobs. thanks guys for commenting so quickly :) Hm, you're right, it is similar to painting. I did also notice that the water in your sig is quite nice, have you ever tried to animate running water? I imagine that would be tedious. Link to comment Share on other sites More sharing options...
Nash Posted May 2, 2011 Author Share Posted May 2, 2011 I animated lava a long time ago but it looked terrible and i scrapped it. An animated waterfall would be kind of nice though :) might try it! Pixel Signature Made By Me.Pixel Art Tutorial * Pixel Gallery * My Free Pixel Sigs Shop Link to comment Share on other sites More sharing options...
K4ylan Posted May 2, 2011 Share Posted May 2, 2011 Thanks, looks simple, but the end product looks so hard Are you just using MS Paint? ~~~The Harpy List~~~Harpy Facts~~~It's Super Effective~~~The Beginning~~~Harpy Therapy Center~~~Alg~~~Jedi Harpy~~~Rohirrim~~~Attenuation~~~ Link to comment Share on other sites More sharing options...
Nash Posted May 2, 2011 Author Share Posted May 2, 2011 Yeah I like pixeling in Paint because its easier (has less bells and whistles to work around) and I can set up 28 custom colors in my little color box :) As for hard its not really too difficult if you have the right instruction :) I was lucky enough to get mentored by Destro and Jopie when I came into it along with occasional tips from dharokslayer and Hiimben. But hopefully things like this will help encourage people to give it a shot as well as dismiss some of the rumors that pixeling is near impossible to do. Pixel Signature Made By Me.Pixel Art Tutorial * Pixel Gallery * My Free Pixel Sigs Shop Link to comment Share on other sites More sharing options...
Cacmypants Posted May 2, 2011 Share Posted May 2, 2011 It is very useful to have access to layers, though it isn't necessary. If I had to create sprites with only MSpaint I'm pretty sure I'd rage-quit, but that's just me, haha. Link to comment Share on other sites More sharing options...
Nash Posted May 2, 2011 Author Share Posted May 2, 2011 Oh yea making sprites like the one in your sig would be suicide in paint lol. Pixel Signature Made By Me.Pixel Art Tutorial * Pixel Gallery * My Free Pixel Sigs Shop Link to comment Share on other sites More sharing options...
Cacmypants Posted May 2, 2011 Share Posted May 2, 2011 Well it's mainly due to me splitting up each sprite into individual objects (head, torso, left arm, right arm, legs) so that various animations/orderings do not interrupt each other in-game (e.g the hair waving loop should not reset while walking/stopping, it also easily allows the sprite's arms to attack while running) Link to comment Share on other sites More sharing options...
K4ylan Posted May 2, 2011 Share Posted May 2, 2011 I'll definitely try it out, but it seems like I'll need an hour or two of free time. ~~~The Harpy List~~~Harpy Facts~~~It's Super Effective~~~The Beginning~~~Harpy Therapy Center~~~Alg~~~Jedi Harpy~~~Rohirrim~~~Attenuation~~~ Link to comment Share on other sites More sharing options...
Nash Posted May 2, 2011 Author Share Posted May 2, 2011 Oh wow cac you know how to make pixel style games? Id love to make a small game with you <3 its always been a goal of mine but i only know how to pixel lol. maybe something like the old zelda game (but much much smaller obvs) and k4ylan yeah itll take an hour or two. be sure to post your progress in a thread in the gallery and ill help you :) Pixel Signature Made By Me.Pixel Art Tutorial * Pixel Gallery * My Free Pixel Sigs Shop Link to comment Share on other sites More sharing options...
tripsis Posted May 2, 2011 Share Posted May 2, 2011 Nice tutorial :) The one comment I haven't isn't about the tutorial itself, but more about the final image, if that's okay. The way you've set up your layers of mountains is backwards. Right now you have the closest mountains (in front) the lightest colour and the ones in back darkest. But in reality it should be swapped. The further away things are, the more they blend into the background. So when you're looking at mountains in the horizon, the further away ones will appear lighter and bluer. The closer ones have more definition and contrast. Here's an example (look at the very very top of the image): Anyway it's not the biggest deal in the world but I thought I'd point it out and maybe it'll help you in the future :) Also, @ the above conversation.. I'm currently making a pixel game for a Game Design class project :XD: - 99 fletching | 99 thieving | 99 construction | 99 herblore | 99 smithing | 99 woodcutting - - 99 runecrafting - 99 prayer - 125 combat - 95 farming - - Blog - DeviantART - Book Reviews & Blog Link to comment Share on other sites More sharing options...
Cacmypants Posted May 2, 2011 Share Posted May 2, 2011 Well I've never made a complete game per se, but I've recently been formally educated in the sacred art of basic programming concepts, I'm just combining this knowledge with what I've learned from all my past failed attempts. I know for a fact that solo game development is near impossible unless you have boundless hours of free time and are relatively skilled in all areas like music, design, graphics, programming. The software that I use, multimedia fusion 2 (developer), though rather simplified, well accommodates a solo developer and can be quite powerful if used correctly. Things like the platforming presets are generally bogus, I work from the ground up. Some people tend to ask why not just make 3D model games like most are today, since there are tools for that too. Meh, pixel style is appealing and generally easier to achieve acceptable production quality. Link to comment Share on other sites More sharing options...
Nash Posted May 2, 2011 Author Share Posted May 2, 2011 By small game I meant like 1 person going up like 5 floors of a g and castle, defeating a boss and the end lol. As for programing and such i cant help you there, but i can make the pixel graphics and provide some music if you give me some time over the summer to record some stuff :) @Tripsis; yeah lol ive done it both ways, in more realistic pixels i like to do it the way your saying but in cartoony ones i like to flip it because it looks more fantasy-like. Pixel Signature Made By Me.Pixel Art Tutorial * Pixel Gallery * My Free Pixel Sigs Shop Link to comment Share on other sites More sharing options...
Cacmypants Posted May 2, 2011 Share Posted May 2, 2011 By small game I meant like 1 person going up like 5 floors of a g and castle, defeating a boss and the end lol. As for programing and such i cant help you there, but i can make the pixel graphics and provide some music if you give me some time over the summer to record some stuff :) Small games like that can be amazing if they're given a distinct feel/style and maybe a few twists. It's also better to remain realistic about what you can achieve without a massive development team, the bigger visions fall much harder on your psyche when they fail. Thanks for offering the help, but I generally prefer not to place burdens on people other than myself. Link to comment Share on other sites More sharing options...
My_Eggs Posted May 2, 2011 Share Posted May 2, 2011 Nice guide cowboy. Do you plan on making a guide on how to draw people? That's where I struggle usually when making pixel sigs. 99 HP, Attack, Strength, Defence, Summoning, Ranged, Herblore, Prayer, Agility, Magic, Slayer, Fletching, Fishing, Woodcutting, Mining, and Thieving. Jagex'd out of my untrimmed hp cape on 6/14/2011. Link to comment Share on other sites More sharing options...
Cacmypants Posted May 2, 2011 Share Posted May 2, 2011 Nice guide cowboy. Do you plan on making a guide on how to draw people? That's where I struggle usually when making pixel sigs. To pixel-art people you really have to start with knowing all the general sketching basics like proportions, natural postures etc; it carries over. here's a few easy proportion rules to remember off the top of my head: Body: - The entire body length should be at least 6 heads down- 2 heads down is approx. where the chest should be- 3 heads down is about where the legs start- The legs should at least be the same length as the torso (from the stomach) + head- Hands are generally the size of the face- Feet are the approx. length of the forearms, go a bit shorter if needed.- Arm length usually reaches from just above the knees with extended finger-tips, can go shorter, but it's better to have arms looking a bit too long than a bit too short.- Bicep muscles usually end at around the same point the ribs are furthest out a bit below the chest.- Male torsos have a solid/bean shape with broad shoulders, female torsos have an hour-glass shape that is a bit wider at the start of the legs (pay attention to this, lol, it's easy to make female character look male)- Also, try to limit the size of breasts, they might end up amazingly unrealistic, if you really want to draw them right, you have properly observe naked models, its the only way :wink: Face: - Eyes are half way down, with a single eye-width between and half eye-widths to the sides- The top of the ears should roughly match the level of the brow- The mouth should extend far enough so that the corners reach about the same distance as the center of each eye (can be smaller though)- The nose is the most flexible part of the face, but it's also a feature that makes or breaks. Although, as long as the rest of the face matches, most nose shapes can work. Sorry if you already knew all of that, heh. Link to comment Share on other sites More sharing options...
My_Eggs Posted May 2, 2011 Share Posted May 2, 2011 Nice guide cowboy. Do you plan on making a guide on how to draw people? That's where I struggle usually when making pixel sigs. To pixel-art people you really have to start with knowing all the general sketching basics like proportions, natural postures etc; it carries over. here's a few easy proportion rules to remember off the top of my head: Body: - The entire body length should be at least 6 heads down- 2 heads down is approx. where the chest should be- 3 heads down is about where the legs start- The legs should at least be the same length as the torso (from the stomach) + head- Hands are generally the size of the face- Feet are the approx. length of the forearms, go a bit shorter if needed.- Arm length usually reaches from just above the knees with extended finger-tips, can go shorter, but it's better to have arms looking a bit too long than a bit too short.- Bicep muscles usually end at around the same point the ribs are furthest out a bit below the chest.- Male torsos have a solid/bean shape with broad shoulders, female torsos have an hour-glass shape that is a bit wider at the start of the legs (pay attention to this, lol, it's easy to make female character look male)- Also, try to limit the size of breasts, they might end up amazingly unrealistic, if you really want to draw them right, you have properly observe naked models, its the only way :wink: Face: - Eyes are half way down, with a single eye-width between and half eye-widths to the sides- The top of the ears should roughly match the level of the brow- The mouth should extend far enough so that the corners reach about the same distance as the center of each eye (can be smaller though)- The nose is the most flexible part of the face, but it's also a feature that makes or breaks. Although, as long as the rest of the face matches, most nose shapes can work. Sorry if you already knew all of that, heh. Yeah, I've been taught a lot of that stuff in drawing classes and what not in school, however it's nice to see it all in one place where I can look back on it while drawing since I have forgotten quite a bit of it. Thanks for the tips. :thumbup: And by properly observe naked models, you mean I shouldn't be distracted by doing other "things" while looking at them, right? :lol: 99 HP, Attack, Strength, Defence, Summoning, Ranged, Herblore, Prayer, Agility, Magic, Slayer, Fletching, Fishing, Woodcutting, Mining, and Thieving. Jagex'd out of my untrimmed hp cape on 6/14/2011. Link to comment Share on other sites More sharing options...
Sam Posted May 3, 2011 Share Posted May 3, 2011 Thanks for publishing this tutorial, C14. 2257AD.TUMBLR.COM Link to comment Share on other sites More sharing options...
Pat_61 Posted May 3, 2011 Share Posted May 3, 2011 Did you see the link I gave you to Demented Hero's old tutorial? Well done what what you have so far though, you should make installments and keeping adding to it with different concepts ^^ Do you pixel your text?What is your normal border size? EDIT: Sig so far... I Support TET!| If you want bunny PM Me.|Click For My DevArt^ Cowboy is the Best ^IT'S A TRAP SHINY JUST WANTS TO STALK YOU.Hell yeah I do. Whats your msn?That's how it all starts. Next he's going to ask you what flavor of candy you enjoy and whats your favorite color van. Link to comment Share on other sites More sharing options...
Nash Posted May 3, 2011 Author Share Posted May 3, 2011 Hey Pat long time no see :). Yes I do my own text, its nothing special but i think the hand drawn text looks more authentic in pixel sigs. My borders are usually just a 2pixel thick black border ;) I did see demented heros tutorial and i might link to that at a later time (when im doing people) as I think his is too advanced for the beginning pixeler. Sig's looking great pat :) glad somebodys already making one from my guide :D Edit: Your gunna have trouble with the way you placed that road. Its either going to have to lead to some sort of tunnels in the mountains or lead into a town of some sorts. Roads cant just stop all of a sudden :P Pixel Signature Made By Me.Pixel Art Tutorial * Pixel Gallery * My Free Pixel Sigs Shop Link to comment Share on other sites More sharing options...
Harpy Posted May 4, 2011 Share Posted May 4, 2011 Nash!I love it! Thanks I shall try to work on one in the near future. Keep up the great work! Haha. Makes me think of Minecraft. :blink: 92 Fishing | 92 Firemaking | 92 Dungeoneering | 99 Cooking100% FTP | 800+ Total | 19 Combat Optima dies.. prima fugit. .::. Forever a Harpy Link to comment Share on other sites More sharing options...
Nash Posted May 4, 2011 Author Share Posted May 4, 2011 lol? why minecraft? But thanks and i look forward to seeing your progress :) Pixel Signature Made By Me.Pixel Art Tutorial * Pixel Gallery * My Free Pixel Sigs Shop Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now