Indie game storeFree gamesFun gamesHorror games
Game developmentAssetsComics
SalesBundles
Jobs
Tags

imonk

243
Posts
108
Topics
152
Followers
37
Following
A member registered Dec 30, 2017 · View creator page →

Creator of

Recent community posts

This looks very faithful. I look forward to playing this! 👍

There's no use for the money haha sorry, ran out of time.

Same issue here

I've had the same issue. Sorry to hear that but thanks for playing anyway!

Totally understandable, thanks for feedback.

(2 edits)

I've set up a Doom-inspired game jam. It is currently open and will last for almost 4 months. The idea of the jam is to submit games based of the "Doom" video game series primarily, but can also take inspiration from other shooter or combat focused games such as Blood (1997), Heretic (1994), Unreal (1998), or Quake (1996), etc. This is the overall purpose of the jam. Here is the link and I hope you join!

😆

Thanks! I hope I get back to making tutorials eventually but I'm trying to focus on school and a new career because art world has been rough in recent years.

"I'm gonna take my horse to the old town road, I'm gonna.. riiiide til' I cain't no moe 🎶..."

Incredible storytelling. The world reminds me of Pandora from Borderlands. Also like how you went from struggling with UI to coming up with the wanted poster format. Last but not least, thanks for adding the robo-cacti. 🙂

Hey guys, I'm back. If you're new, I suggest you check out the first tutorial of my Zelda mockup series. This time we're going to draw some dirt. It's good to search up some reference from 2D Zeldas, especially Zelda: The Minish Cap in my opinion.




If you look at the dirt alone, it's actually pretty simple to draw. It might look difficult at first because the game's art looks so good as a whole, but the dirt itself isn't all that difficult. Just to experiment for now, we can try drawing a single tile of dirt (more or less) just to understand the texture of it without worrying about the technical details so much yet. We can start with our grassy scene from the previous tutorials as a template. then draw a single brown square in the center. It's a good idea to try to pick a bright color for this because we will have dirt walls in the future.


Now we need this tile to transition seamlessly into the grass so we will add some blades of grass. I see a lot of 2D Zelda games make them bright so we'll try that. 


We will need our shadows in the dirt caused by the grass. For the shadow colors though, I'd actually shift them towards red but make them dark enough so it's hard to tell. So the shadows aren't actually brown here, but secretly red. Just so you know a little bit about hue shifting.


So that decent for a single tile of dirt, but for a game developer, it's pretty useless when it comes to tile mapping. A game developer can't use this to create dynamic patches or roads of dirt with only this one tile. It would be a lot more useful to have a dirt tile, then having bordering tiles separate


because now we can resize it.


There's still a problem though. If we do the inverse having grass in the center and dirt bordering it, we'd be lacking corner tiles,


so just make sure you fill those in.


This is all we really need


and there's so much we can do with it. 


It could help to have a variation of the dirt tile with some roughness though, but try to avoid making them look obviously like squares.


Are here is the dirt with other assets in the scene!


So thanks for reading. I'm looking forward to writing the next tutorial.

Back to Homepage

(4 edits)

Hey guy's I'm back. Continuing on to the Zelda inspired Mockup series we will be drawing some boulders. If you haven't started from the beginning of this tutorial series, I'd recommend that. We will need some space to draw the boulders so I'm using 128x128px for the canvas, but we can also have some grassy details in our scene. 


Drawing boulders is easy to start but a bit tricky to texture, so it helps to search up reference. Pretty much any realistic rocks or boulders you find on the internet are worth studying, but it's also a good idea to search up "rock texture" specifically so you can focus on just the texture as well. My boulders are going to be gray, with some slightly bluer shadows. I'm going to start some sketches. For now they're just simple boulder sketches with polygon shading. I'd do this on a new layer.


Just like the tree from the previous tutorial, we'll add some grass along the base of these boulders.


So this is ok, but it looks odd that we don't have shadows on our boulders, specifically at the bottom. If you search up "ambient occlusion" and "cast shadows", this might be a lot easier to grasp. Mainly right now we don't have shadows and that's the problem. These boulders being embedded into the grass would cause shadow to form around the base. Not just on the grass, but on the bottom of the boulders as well 

 

Notice how this already looks better on the boulders, even without editing the grass yet. I'm also considering the rough texture a bit as I'm sketching here so that's why you'll notice a bit of rough texture.


And shadows applied to the grass:


Alright, looking good. Now we should figure out the texture. I will admit this part is a challenge, even for me, but I've had some practice with it. I will provide some reference which I think would look great on these boulders.

Notice how the rock texture in these first 3 examples have seemingly parallel formations of bumps and crevices. 




Then notice how these ones are more random.




Those are just some things to think about as you're trying to illustrate the texture. Maybe you can even try a combination of those 2 ideas. Try to keep the texturing very subtle or it can easily get very messy. To pick colors, I'd start with the current rock colors we have for our brush, then modify the colors with the HSV/HSL color sliders. It might be a good idea to have the tree from the last tutorial visible as you're drawing this to try to match the style.

So for the texture example:


And I could see how it would look with the tree on screen.


Notice how the tree has a cartoony outline, but the rocks don't. I'd fix that by adding a soft outline around them


And I'd copy the strong shadow color from the tree, so I could just take that color from the tree actually and apply it to my stones here.


So this is pretty good! However I feel like some of the stones look too sharp and flat-faced, so I would give them rounder and bumpier shapes and bevel some of the edges, but some of these rocks are ok already.


So I'm satisfied with those. Thanks for checking out the tutorial, and part 4 will be coming soon!

Next Tutorial

Back to Homepage

(1 edit)

Hey guys, I'm back. So this is a continuation of the Zelda Mockup tutorial series. If you haven't checked out part 1, you might want to do that first. It mainly goes over how to draw Zelda grass. This one will go over how to draw a top down "Zelda" tree. Here's what they look like in different 2D Zeldas.

Oracle of Ages

Oracle of Seasons

Link to The Past

The Minish Cap

These trees are stubby. I presume the reason why they are so wide is to serve as useful player boundaries, and the reason why they are short is so that they don't obstruct important gameplay elements. The treetops have noticeable layers of leaves and they take up most of the design, leaving the trunk barely visible. I think 3x3 or 4x4 tiles would be a good size for our tree. We should add a new layer for our tree so that we don't accidentally merge it into the grass layer. For the sake of simplicity, I'm going to hide the grass details we did in the last tutorial, but we could end up with a sketch like this. If you want to make the tree look symmetrical, you can mirror half of your sketch over the Y-axis.

 

Next thing I would do is add an ellipse shadow at the base of the tree. Technically this shadow would be semi-opaque, so for our shadow color, we'd use a blend of black and the grass color resulting in something like this.


Notice how the top border of the tree is hard to see, I'd add a soft outline along it.

And since grass is not flat, it would make sense to add some spikes of grass along the base of the tree. If you don't want to ruin the sketch you already have, make another layer for this.


Here is my polished version. It just uses more colors and shading mainly, with a harder outline.


And here is the tree within a grassy scene.


So thanks for reading and stay tuned for part 3!

Next Tutorial

Back to Homepage

(3 edits)

Hey guys. I have a quick tutorial but it's part of a bigger series. I wanted to go over how to create some grass from top down view. The grass tiles in this tutorial will be 16x16px each. I want to have a few variants. I'd look up Zelda: The Minish Cap as reference because it's a really great example.

If you look at the grass here, you might notice that the grass is just a single cluster of green with a few patches of details. So what we could do is have a background layer and a detail layer in front. On the detail layer, we can add whatever details we want to show in front of the grass. For now, I'll draw some spikes of grass hue shifting towards blue.

We can also sketch in some patch of dirt.

We can use a mid-tone grass color and some shadows in the dirt to take the texturing even further. So you could end up with something like this.


Another way to illustrate grass is pretty similar but the spikes of grass are brighter, hue shifting towards yellow, and there are little dents in the grass.

If you wanted to add mushrooms, flowers, and pebbles, you can do that too. 

So those are some of the ideas for grass. It's a pretty short tutorial but next we will add a tree to the scene. So stay tuned for that!

Next Tutorial

Back to Homepage

(9 edits)

Hey guys, I'm back with a sword pixel art tutorial. In this tutorial I want to discuss how I would draw swords and help others understand a bit more about them. It helps to know some of the anatomy of a traditional sword.


But in pixel art, you don't necessarily need to know all of it starting out. However I think you should at least know the hilt and the blade. To start off, we can draw a very simple sword in 16px. The hilt could be brown and the blade could be white.


Then we need to know a little bit about reflection so that we can improve the shine of our blade.




The shines here are relatively small compared to the full length of the blades and can pretty much go anywhere along the blade. Also the blades aren't actually white, they're made of metal so they're more gray or silver. Knowing this. I created a few examples of shiny blades here.

Then we should improve the hilt. We could add a shadow between the grip and the cross guard to make them appear as separate shapes. I also think it makes the cross-guard appear thicker, which makes wielding the sword seem a bit safer.

Just a small detail, we should shade the grip as if it were round. It's similar to a cylinder so I would shade it the same way. 


And we can use more colors for the hilt to make it more interesting. If we look at some swords, the colors are usually seperated into 3 parts: the pommel, grip, and cross-guard. Sometimes there will be a gem or something on the cross-guard as well.


For now, I'm just going to keep it simple. I'm going to use a gray pommel and cross-guard, but a brown grip.


Since I want my pommel and cross-guard to be made of metal, to illustrate that, I add some shine to them as well. 


Then I think an outline would help it stand out against the background. I prefer selective outlines. I think of them as shaded outlines. Pretty much where the light hits, the outline appears brighter.

For a simple sword, this is pretty much done in my opinion, but here's a little secret: you can actually use a blue tint for the metal, just keep it very slight. You can see the two end results here.

Here are variants of the original sword, only having a few differences. These are both 32px, the cross-guards are curved, and the shine on the left sword is split into two white smears. Also notice how now you can see that the blades have 2 faces: the left face of both swords are in the light, and the right face of both swords are in the dark.

The next sword we can try drawing is a claymore. It appears just like the sword above but there are a few differences. The main difference is that the blade is longer. The second difference is the cross-guard's shape. The arms of the cross-guard, or "quillons" are straight (not curved), and they are slightly angled upward forming an obtuse angle just above the cross-guard. The ends of the arms have quatrefoils that resemble four-leaf clovers. 


The quatrefoils won't matter much because I'm drawing the claymore at a 48px resolution but it's still good to know in case you ever want to draw a very detailed claymore. Using the original sword as a template, this is what I came up with.

The last one I want to draw for this tutorial is a Zweihander. The most iconic features of the Zweihander are its massive length (even longer than the claymore) and its parrying hooks.


 For this one, the cross-guard shape can vary but the parrying hooks are positioned just above the cross-guard (about 1/5th from the cross-guard towards the point of the blade). They can point straight out or upwards similar to the arms of cross-guards. Using the claymore as a template, you might end up with something like this. This time I made the grip ruffled.

So thanks for checking out the tutorial. I hope you learned a bit about swords and I hope to see you in the next tutorial!

Back to Homepage

nice go!

This isn't bad, but I started playing Zelda: The Minish Cap recently and I really like their character sprites. Not sure if that's a style you'd go for.

Don't work for free! Every artist deserves to get paid for their work. Charge a fair amount. No amount of work experience is going to fully prepare you the next gig because the next gig is always going to be different. There's always more to learn on the fly so just charge a fair amount or at least something as you gain experience.

Me and MusicaJosh drew this. It's Dampe's graveyard from Ocarina of Time.

It's ok, it's not a race. Have fun! I am doing a Zelda mockup with someone right now.

(1 edit)

Hey guys, I'm back with yet another tutorial. So in this one we're drawing a coin bag. The things we're illustrating are:

  1. The sack 
  2. The coins
  3. The tying string

This tutorial should be real easy. We're going with 24x24px so create the canvas.

Then create a sketch. Ideally you'd want to use most of the empty space, if not all. I'm creating this for an icon set, so I like to leave a little space in between icons. You may want to create a light-blue background if it makes things easier for you.


From here, we add our main light areas (we'll shade the coins last, for now we're just focusing on the bag). 

Now that we have our light, we know our shadows go on the other side. Roughly around these areas.

If you want the bag to be fuller you can leave it like that, but I think creases or folds might help give the sprite some texture. This can be done very subtly. The creases are vertical. You can start rendering some subtle lines like this. Mostly just between the clusters.

Now that the bag is mostly done, we should start our coins. I want the coins to be stacked. You can draw the coins on another layer and lock the bag layer if it makes things easier for you.


The coins can use some shading. It's probably easiest to start with the shadows first since they're already pretty bright. For gold material, you can use colors ranging from yellow to orange, or even red in some cases where there are really deep shadows. You might want to color pick the coins then use the HSV or HSL sliders for this. 


Now we can try some highlights for now (might be a little too bright, we'll see later).


I want the shade the coins a bit further. I also want the coins in the stack to look separated from each other, but at this scale of pixel art, adding shadow lines in between the coins would look a little too thick.


The problem is that the separation lines reduces the shine of the coins because they're so thick and replace it. The workaround is keeping the shiny clusters, but just adding a little bit more detail in the shadows.


Now I just take the polishing further. Here can decide if you want to add more shades, tweak colors, adjust the silhouette, increase saturation, etc. but make sure everything has good readability. The coins were too bright against the bag so I reduced the contrast by decreasing the shine and adding another highlight tone to the bag. The second thing I did was add an outline to the coins to make them pop out better.


So that's the final result. Thanks for checking the tutorial/process. Looking forward to seeing you in the next one!

Back to Homepage

(2 edits)

Hey guys! I'm back with another tutorial. This time we're drawing a health potion in 24x24px. I won't be talking about how to set up a canvas or use Aseprite in this tutorial but finding documentation on how to do that should be easy enough on their website. I'll just be going over my thought process for designing the sprite itself.

So first off, reference always helps before starting so look up some on the internet. We're drawing one of those round "light-bulb" looking potions with the red liquid inside. There's just a few key things we need to focus on when illustrating it:

  1. The Red Liquid
  2. The Glass Container
  3. The Plug
  4. The Reflection

If you can keep those in mind, you should at least end up with something decent. Of course we will need to shade it and add shadow but I feel like that's an after-thought, the idea comes first.

So I will set up my 24x24px canvas and I will use a blue background just because it has good contrast for this type of sprite. The first sketch I do here is just to get the light-bulb silhouette going and have somthing that resembles red liquid.



Then we add the brown plug/cap that's used to seal the container. 


We need the container. The container is see-through and the easiest way to show this from the beginning is just show the border only without the semi-opaque glass within the sprite.


Now we need to show that the glass is reflective. To do this, we need some very small highlights, preferably around these areas: the bulb and the bottle-neck. Also if you look at a lot of potions or shiny spheres, the highlight on the bulb part should be slightly curved. 



From here, we need to start shading it so that it actually looks like a round potion. Since we know where our highlights are (top-left), we know ideally that our shadows would go in the bottom-right.


Next thing is the glass is a little too clear. This is where the partially-opaque pixels come in. The reason why I'm using pink here is because pink is the blend color of the glass + the liquid. I use pink in the brighter areas only.


Now just for fun, I want to try making the bottle look half empty and wavy. First I remove some of the liquid so it has some room to slosh around.


and I want to show the liquid at slight tilt so to do this, I make the top part brighter than the side (light is coming mostly from the top). I also try to keep this top part of the liquid circular because the potion is a sphere. So now there's a noticeable circular top surface to the liquid.


Now we need to add the waves, so if you look at something like a sine wave, that's basically what I'm trying to apply around the top edges of the liquid.


Now it's all about polish and getting the sprite to be fun to look at. This means "pop"! First thing that helps with the pop is stronger contrast. You can see here that I add stronger shadows towards the very dark areas so the potion has a very strong outline. It looks almost as if it were a collectible floating around in a game.


Next I play around with proportions! With pixel art depending on what I'm drawing, sometimes I like to "chibify" sprites, whatever that means. It's hard to explain how I got the idea, but I just look at a lot of existing pixel art items people created and I get a feel for the cartoony style over time.


And finally I add bubbles just as a final detail.

So that's it for this tutorial! I hope you enjoyed it. Thanks for reading and I'll see you in the next one.

Back to Homepage

I write very long tutorials in the 2D Art forum section and sometimes I wish I can save a post as a draft to continue writing later, so having a way to save posts as drafts would be nice. That's my little suggestion! 👍

Woohoo!

(8 edits)

Hey guys I'm back with another tutorial. This time we're drawing a block of dirt with some grass on top. If you're still very new to pixel art and haven't checked out my complete beginner guide, I suggest that you check it out because there is a lot of useful information in that tutorial that will help with this one. Ok with that being said, this block will roughly be around 16x16px, but it will have some grass on top so it will be a little taller. For now lets create a canvas with the size of 48x48px just to have a little extra room to work with. Make sure color mode is set to RGBA so that there is no limit to our color choices. Make sure background is set to transparent, in other words, we won't have a background for now. And make sure the pixel aspect ratio is set to 1:1, what this does is set the pixels' width to height ratio to be equal.


After all that is set, hit OK. If you want to double check the size of your canvas, you can see the width and height in the bottom-left corner of the screen. 


Next thing I want to talk about is the preview window. The preview window is a window that displays your artwork in front of the Aseprite interface real-time. You can activate it by pressing this button in the bottom right corner of the screen.

It can be resized and moved around like any other PC window. I always keep mine small in the bottom right corner.


Now we need to talk about navigating the canvas. It's usually very hard to draw while zoomed out and sometimes we need to zoom in. There's a few ways we can do this. The first one is use the zoom tool. With this selected, you can left-click to zoom in or right-click to zoom out, or click-and-drag the mouse left or right to zoom around. (You may see a hand tool in place of the zoom tool. Click on it and you should be able to find the zoom tool next to it.)

Another way is to modify the zoom level directly. This value can be found in the bottom right of the screen.


But my favorite way to zoom in and out is use a shortcut. I have mine set to (Ctrl) and scrolling the mouse wheel. If you want to zoom this way, make sure it's set up in your keyboard shortcuts

The next thing you need to know is how to pan the view. When you're zoomed in, sometimes you won't be able to see other parts of the canvas that you need to see so it helps to know how to move the camera around. You can do this one of two ways. You can use the hand tool found in the same slot as the zoom tool.


or you can create a keyboard shortcut for the tool. I have mine set to (Ctrl) for hand tool (quick). What "quick" does is only select the tool while you're pressing the key and deselect it whenever you're not.


The navigation functionality works for both the main canvas and the preview window. Okay so now that you now how to create a canvas, use the pencil and eraser, and zoom/navigate the canvas. You should be ready enough to start drawing a block of dirt and grass. Set your active color to some brown dirt color, doesn't need to be exact. You can draw the dirt block with the pencil if you want, but that would be incredibly tedious. There's a few better ways to create squares. The easiest is to create a square with the filled rectangle tool. The other way is to select a square with the rectangular marquee tool and fill it in. When using these tools, make sure that your grid spacing is set to 16x16px and snap to grid is on because we want to make sure that the block is perfectly in the center of the canvas.

Filled Rectangle Tool

Okay so first I'll explain the filled rectangle tool. What this tool does is pretty self-explanatory; it creates rectangles filled with your active color. You do this by selecting the tool and clicking and dragging.

Rectangular Marquee Tool

The other way is to use the rectangular marquee tool and fill in the selection. What it does is makes rectangular selections of areas on the canvas. If you use this tool, the way you'd create a square is click and drag with the tool to create the selection, or if you have the preference set, 

you can double click on the transparent background to select squares. Most of the time you will probably want to have the replace selection option checked.


After that, you'd need to fill it in. You can use the paint bucket tool


and left-click inside the selection, or you can go to Edit-Fill, but I often just use the shortcut (,).


Now you should have created a 16x16px brown square in the center of the canvas. After that, draw a thin layer of grass on top and give it a few spikes of grass sticking out. 


Now lets add more detail. We can illustrate pebbly texture inside of the dirt with shading. Shading is the process of illustrating light and shadows. We can start by adding brighter colors, or darker colors. However I recommend starting with the darker colors first because it will lay the foundation for the brighter shading. You probably have your grass color selected right now, it will help to revert back to the dirt color first. You can use the eyedropper tool and left-click the dirt to set the active color back.

 

but if you remember from the first tutorial, I have my right-click function set to copy colors by default. It's just easier for me. Once you select the dirt color, slide the Value or Lightness to the left by using the color HSV (Hue, Saturation, Value) and HSL (Hue, Saturation, Lightness) sliders. You can find these sliders by clicking on your active color.


The purpose of drawing the shadows here are to illustrate numerous individual pebbles in the dirt. I'm using black for the shadows.

Now that we have our individual pebbles, we can start adding light to them. Technically when shading there are A LOT of factors to consider about the lighting, but you don't need to know all that just yet. All you need to know is that we're using 3 shades for now. So once you have your shadows drawn out, add the lighter tone to your pebbles. It doesn't need to be perfect.


So this is shading, but lets take it further. Instead of using only 3 shades, let's use 5. Now, this is not a strict rule, but try to keep your shade transitions smooth and you should end up with something more visually appealing.



Now we just need to work on the grass and we're done. For the grass, notice how the color blends in too much with the background, we will need more contrast between the two. There's a few ways you can do this. Two that I know of are you can add a black outline, or you can add a selective outline (tinted outline). I often prefer using selective outlines, it's just my style. After you add the outline, try shading it. You want to show spaces in between the blades of grass similar to the crevices between the pebbles, and again, try to keep it visually smooth enough.

The next gripe I have about this block is that the transition between the dirt and grass is too perfect of a horizontal line. It would help to break up the transition a bit.


And finally the last thing I want to talk about is tweaking colors after you're done. It's not a huge difference but it helps with getting the right colors you want. To do this, you'll need to select pixels by their color. There is the magic wand tool for that, select it.

Make sure tolerance is set to 0, and contiguous is unchecked and "replace selection" is selected. 

Once that's done, you can click on a pixel on the sprite and it will select all pixels of matching color. 


From there, you can fill the new color you want and do this for all the other colors. It helps to use the eyedropper tool and color sliders so you color choices don't end up too far off.


So finally, that's it for the tutorial! Congrats on making it this far. Next time, we'll start creating a grassy scene but until then, see you next time. 

Back to Homepage

(4 edits)

Hey guys, I wanted to make a pixel art tutorial for complete pixel art beginners. The purpose of this tutorial is to help artists get familiar with Aseprite, which is the probably the most common pixel art creation software that pixel artists use these days. Graphicsgale is a great free alternative, however I won't be teaching Graphicsgale because I no longer use it and I don't have enough time to teach both software so without further ado...

Starting Aseprite

If you haven't done so already, purchase and download Aseprite from their website for just $20. Once you have purchased Aseprite, you should have lifetime access to it so if you accidently delete it off your PC, you should have no problem getting it back. Download it and the newly downloaded files should appear in the Downloads folder. Although you don't need to, I suggest you take a little time to organize the files into a memorable directory on your PC. I have mine located in This PC/Local Disk/Program Files/Aseprite. After that's done, you can right click on the executable file (it should just be called Aseprite) and from the pop up menu you can create shortcuts to run the software (Create Shortcut, Pin to Taskbar, Pin to Start Menu). 


Once your shortcuts are set up, go ahead and launch the software and you should see a pretty blank interface but with a menu in the top left. 


For now we're not going to worry too much about what all the tabs are for, but I do want to talk briefly about the preferences and keyboard shortcuts which are found under Edit. Also take note of the key prompts that appear on the right of the various commands, these are the keyboard inputs you can use to trigger them.


If you're serious about using Aseprite long term, it's a good idea to optimize these things. First we'll start off with the preferences so click on that. Update whatever you want but the first thing I recommend taking a look at is the right-click functionality while you're drawing. This option can be found in the Editor tab. As you can see, there are a few things you can do with it. I like to set mine to pick foreground color, that way I can always set my pencil color to already existing colors within my sprite just by right-clicking on them. Be sure to click apply at the bottom of the window to save the changes.


The other thing you may want to consider is the Background tab. When you create a blank canvas, you will see a default background looking like this.

If you're fine with it, keep it as is, but you can change the grid size and colors of the squares. 


If you're a tileset artist, icon artist, or just like drawing a series of sprites at the same size, you can toggle the visibility of grid lines on and off to help you with measuring width and height. You can set the color, spacing, and opacity of these lines.


And to toggle their visibility, you can find the command under the View menu tab.

That's all I know for preferences, next we should take a look at the keyboard shortcuts because if you want to get work done fast, you need shortcuts. When you click on Edit-Keyboard Shortcuts, you should see this window. On the far left, you will find a few different categories of things you can set shortcuts for. Actions are pretty self-explanatory, various functions/commands that you can do in Aseprite. And Keys are the keyboard inputs you need to press in order for the actions to occur. You don't need to know what all the actions are yet, but set up what you think you know and click OK when you're done.


After you're all done with that, create a blank canvas. You can do this by going to File-New.

After you click that, you will see a list of options for your new canvas. For now, leave them as they are, except set the width and height both to 128px just so we have a decent amount of room to draw stuff, then hit OK.


Now you should see a blank canvas where you can draw whatever you want. On the upper right, you will find a list of tools you can use to start creating your first sprite. A common tool you will be using is the pencil tool, especially when polishing sprites. You can click on the pencil tool directly to select it, or use the shortcut key if you set one. Then on the bottom left you will find colors. In this area of the interface, you can set your active color to whatever you want to start drawing with.


Once you have the pencil tool and the color you want both selected, make sure the brush size is set to 1px. 

Then go ahead and scribble something onto the canvas by left clicking and dragging your cursor around. If you want to erase pixels, the eraser tool is found just below the pencil tool and behaves very similarly. Once you're done, save your drawing by using the Save As command found under the File tab in the upper-left menu, and we'll call it a day.


Once you click Save As, you will see this window. Here you can create a pixel art folder with the folder button if you need a specific place to keep your pixel art files, set the file type, and name the file before saving it. The common file types for pixel art are "ase"/"aseprite" files, "png" files, and "gif" files. I think ase and aseprite files are the same and are used to save the file exactly as is. Png will combine all the layers into a single image so be careful if you're ever working with multiple layers, and gif is for animations. For something like this, we can probably just use png.


Okay well that was a long tutorial but hopefully I taught some useful beginner stuff in this one. Next time we'll try to draw something a little more interesting but thanks for checking out the tutorial and I'll see you in the next one.

Next Tutorial

Back to Homepage

Glad you like it! 👍

(1 edit)

Hey guys, I want to talk about skeletons today. I'm pretty sure you know what a skeleton is but it's a creature made up mainly of bones without much skin. In this tutorial, I'm going to be drawing a humanoid one. My favorite place to browse up fantasy skeletons is Pinterest but Google works too. I have a whole collection of reference images you can find on Pinterest here. Okay so first thing's first, I'm going to sketch a skeleton without all the extra stuff, just the bones. The goal is to create your average common fodder skeleton with a sword, shield, and loin cloth. I usually use a 32x32px canvas but I think I want a little more detail so I will try 48x48px.


Next thing is the pose, we want to improve the pose so it would be a good idea to look up reference and pick something. I think I want this one to raise his sword as if he were doing a battle cry so I will include a sketch of the sword here. I also changed up the facial expression here to make it look more aggressive.

Now we give him a shield. I see these guys often carrying around round shields so I will give him a wooden round shield.

For the loin cloth, we can just draw a mossy shape that dips down. It should probably be a very dark color. I think dark green should work for now at least but I might change it to brown.

I feel like he would look better with some armor pieces such as a helmet, pauldron, spaulder, or boots, so I will try stuff out. I think a nasal or cervelliere helmet would look nice as it wouldn't obscure the skeletons face entirely, but there are plenty of helmet types you can try out (close helmetbeak helmetbarbutegreat helmfrog helmkettle hat, and the Viking helmet). So here's him with some extra armor. It's pretty roughed out right now but I think I can make it work.

Arrows are a pretty nice touch, they can show that the skeleton has been through battle before. We can embed them into the shield and helmet. 

Ok so we have a pretty nice idea here, but now we have to polish it. This part can be kind of tricky but with time we can make it work. I think I got something going for the helmet. I felt like the helmet was obscuring his big expressive eye too much so I just altered the shape of it so that the big eye would fit. I also gave it chainmail on the side. There's quite bit of anti-aliasing going on here because at small resolutions I find it often necessary to do so to convey the details. Whenever you want to draw curves or imply very tiny details in pixel art, AA can be very useful.


I really like skeletons with curved swords. It could just be because I used to play a lot of the original Dark Souls. Here you can see that I gave him a sort of scimitar/falchion sword and I added a nice sparkle to the pointy end of it. The sparkle wouldn't make a whole lot of sense because the sword would probably have been long aged with the skeleton but in pixel art it's ok. I use a lot of anti-aliasing here to get the perfect curvature. 

Next up, the shield. More AA.


Ribs, be sure to directly search up ribs for good close up reference. In pixel art, we can't fit all the ribs, so we'll just try to show a few to get the idea across.

And finally the lower body. I changed the tone of his leg bones to be darker to look "swampier" as if they are more dirty and I like to skeleton knee caps to be quite pronounced so here's the final result.

Alright so thanks for reading and see you in the next tutorial!

Back to Homepage

Yep, think it's like $20 and it's all yours.

(2 edits)

Hey guys, let's try something different this time. I usually draw monsters but it would be very cool to start designing some environmental stuff too. I've been playing a lot of Bloodborne and I just really love the setting of Yharnam. It's this huge ominous neo-gothic looking city and it has a bunch of spooky candles so I thought it would be fun to start drawing some. The things we'll be drawing are candlesticks, candelabras, and chandeliers. So feel free to search those up, just make sure you type "gothic" in front to get better results. A candlestick is a utensil for holding a candle, a candelabra is a utensil for holding many candles (or lamps), a chandelier is basically a candelabra hanging from a ceiling. With that being said, it would probably be easiest to start with a candlestick. We just need to design a utensil that holds a candle but I will elaborate on a few things. They are typically made of some kind of metal. I guess it makes sense so that the utensil itself isn't a flammable hazard. I assume bottom is wide to create balance so it doesn't tip over and the top has a cup shape for inserting the candle. So let's try something simple. Make sure it's shiny!

That's pretty much all there is to it, but lets add details to anyway. I'll draw a larger version.

Now candelabras are where things get interesting. If you look closely at candlesticks and candelabras, they tend to have fancy curves and floral/rosette shapes and overall, most of them have this sort of upward trident silhouette to them. So we can incorportate those elements into our original candlestick and iterate from there! I think it's generally a good idea to keep the designs symmetrical on the y-axis too but feel free to prove me wrong.

So I think that's all I'm going to explain for those, I hope the iterations give you a good amount of possible ideas, but also test out different colors and candle thickness. Now let's draw some chandeliers. We can probably take these existing designs and turn them into chandeliers. Chandeliers hang from chains on the ceiling. The candles are arranged in circular "sets". I don't know what they're actually called, but I'm calling them sets. Generally speaking, the higher sets are thinner and the lower sets are wider, but not always. The sets can be rings or several curved candle holders. Some chandeliers will have beads or jewelry dangling from them. I'll draw some chandeliers just to explain what the heck I'm talking about. First we have what I call a simple "ring" chandelier. It is a ring of candles hanging by a chain which serves as one set of candles.

Now we have another ring chandelier, but this one has two sets. The top set is thinner and the bottom one is wider.


Now like I said, we don't have to keep following this pattern where the higher sets are smaller and the lower sets are wider. We can experiment.

Don't forget that you can also use fancy curved candle holders as well, chandeliers aren't always only made of rings. I personally love a combination of the two.

 

Then the last thing you'd want to do is jazz it up! Make it huge! Make it crazy! Take everything you've learned in this tutorial and just experiment with a ton of shapes! You can even add beads dangling from it.

Alright, that's all I got time for. I wanted to cover gothic gas lights as well but those will have to wait for next time but I hope you enjoyed this tutorial and see you in the next one! 👍

Back to Homepage

I have heard of Evil Dead, but haven't watched it. I'm pretty sure that's the movie where the hero chainsaws his own posessed hand right? 😆

No problem, hope you try out the program!

(3 edits)

Hey guys! Let's design a "Beholder". What's a Beholder? If you search up the definition of "behold", it literally means to see or observe, so a beholder is one who does just that. But in the D&D community, the design of beholders is much more exaggerated with a bunch of eyes. Based on Wikipedia, they are floating orbs of flesh with large mouths, they have a single central eye and many smaller eyestalks on top with powerful magical abilities. If you search on Google or Pinterest, you'll see what I'm talking about. 




So let's start. Just pick some colors and start by sketching a circle, a central eye, a mouth, and some eye stalks. We might need 64x64px for this one but we're not going to think too hard just yet.


Now the first thing we'd might want to refine is the face of this creature, not so much the eye stalks yet because I think the face takes priority. Let's start with the eye, I want to give him a reptilian "predator" looking eye so I will make his pupil shaped like a vertical oval. I also want to make it wetter looking to I will add a highlight to it.


It's not necessarily done, but it's good enough for now. Next, I want to work on his jaw more. I want his mouth to look more aggressive and scary. We can start by stretching his jaws apart even further like he's about to chomp but if we're going to do that, we should also make his eye look wider and more alert too. His teeth are too clean so I will give it some yellow, we can try giving him some drool and slobber, gums, etc. You can try drawing the uvula in the back of his throat but I tried it and it just looks like too much detail everywhere so I removed it.


Much more menacing already! Next thing I'd work on are the eye stalks. They are currently unpolished and I want them to look longer, snakier and have a unified focus on something such as a potential victim the beholder is going to eat.

Alright this is coming along nicely! Beholders are pretty magical, and they often have the ability to cast powerful beams of energy through their eyes, so I thought it would be cool to make his big eye look more magical.

Now it's just a matter of polishing. Here is where we work on the shading, the texturing, and decide to add any last minute details. I think I want this one to look more slimy, and brain-like such as the first reference image, because these guys are pretty intelligent if you read about on D&D sites. I will try adding bumpier, slimier texture to his skin so I will be using highlights.


And there we have it! Thanks for checking out the tutorial, I hope you enjoyed it and see you in the next one.

Back to Homepage

(1 edit)

Thanks to those who appreciate my art tutorials! I wanted to share another source of inspiration for my monster designs. It's the D&D Monster Manual! It contains various creature illustrations and includes info about them. I'll upload some screenshots of the manual below but feel free to check out the manual for more awesome content!

Image

Image

Image

Image

Back to Homepage

Aseprite!

(1 edit)

Hey guys, lets draw some zombies. What are zombies? Do I have to explain? You know what zombies are. They're undead humanoid creatures with rotting flesh. That's the very basic idea at least but we'll design a crazy one too. A good source of reference is Pinterest, you can use it to search up zombies or fantasy zombies. I'll upload some reference here.




These are some of the more basic designs of zombies. Going off these, we can sketch something. We can sketch a simple humanoid and give him a loincloth. I use 32x32px to keep things simple starting out.

But this alone, doesn't look like enough to communicate that he's a zombie. Probably the only things suggesting that he's a zombie here are the pale colors and his tired facial expression. There's some things we can do here: we can give him a zombie-er pose, we can make him deathly skinnier, we can add some wounds in his skin (but I think this sprite is a little too small for that, we'd have to make him bigger), etc. There's many little things we can do to emphasize that this is a zombie. Here is a skinnier one with a more zombie-like pose.

I want to add more details to this one so I will increase his sprite size by 150%. The result will look ugly at first but to me it's just part of the process. In Aseprite, you can modify the sprite size through the menu: Sprite-Sprite Size. From there you can modify the Width and Height of the sprite directly, or by percentage.




Now we have room for more details! We can add smears of blood here and there, some dead hair, a grey eyeball, etc. So let's give those a try.

Alright great! I think I'm satisfied with that one, but let's a larger one. First we'll need to expand the canvas. In Aseprite you can go to Sprite-Canvas Size and type in new values, or you directly drag the dimensions lines that appear and slide them over as much as you want. I will enter in the new width and height of 128x128px and anchor my original zombie to the bottom left of the canvas.


So now we have all this extra space to work with on the right. This should be large enough for the next zombie. We should get more reference for this one. If you search up "abomination zombie" on Pinterest, I think you'll find some interesting results, but at the same time you can get reference from anything. They don't need to only be large zombies. 


So these are some awesome references, but they are pretty advanced. For now I will try to keep it simple by iterating off our first zombie. I will sketch something like the first zombie but with a larger body and a lot of fat. 

Right now he doesn't look grotesque enough, he just looks like an old man. I want him to look more grotesque so I made his face look a lot more decayed, I added bumpy shapes on his skin, I added more blood and deeper wounds, his feet are no longer humanlike as they lack toes now, etc. Overall I think those changes makes him appear way more zombie-like. I also didn't like his original pose because his hands weren't readable enough so I changed it.

Great, but this doesn't showcase all the crazy stuff you do with these guys! So let's iterate yet again, but off of this larger zombie design instead and create another that really takes inspiration from some of the largest grotesque zombies there are. This time I want the zombie to be even bigger. This time we can give him bony spikes, blisters, and faces sticking out of his skin, and we can even try to make him look as if he is a summoned zombie belonging to a cult of necromancers by incorporating some rune symbol into his design. We can also modify the original colors just to have something a little different.

And that's it! But I do have other undead guys I've drawn in the past that might help out with generating ideas.



I even have this meme-worthy version of Mr. X from Resident Evil 2. This is supposed to be a super tyrant  version of Mr. X.

 So I hope I've covered enough about zombies so that you have enough ideas and inspiration to go crazy designing some of your own. I'd love to draw more, but that's all I have time for for now so thanks for reading and stay tuned for more tutorials in the near future!

Back to Homepage

Thank you very much!

(5 edits)

Hey guys, I wanted to revise my old crazy dog tutorial based on the crazy dogs from Elden Ring. They're these giant evil dogs but they have small t-rex arms. They look like this. 

To me they look closest to some sort of giant chihuahua due to the proportions, so that's what I'll try to achieve here. We need a sketch but first we need to decide on a pose. I want it to look super hungry for human flesh so it's going to be staring into the camera like it wants to eat you but I also want to show his back so that's why he's at an angle. His mouth is going to be wide open with his tongue dangling around and drooling. With that said, here's a sketch!

 

The dog has pretty dark fur but due to the red sky of their habitat, they appear to be redder. They're pretty unhealthy creatures so we should make them look skinny and starved by showing the spine and a few ribs bulging. I tested out a few drops of spit flying out of his mouth.

Keep experimenting until you get something decent. I gave him some stronger highlights to make his various shapes more visible. I wanted to emphasize the bone structure of his head here so I gave him strong brows and cheek bones.


I like the eye we have so far, it looks kind of infected and blind but in the game, there are some variants of these dogs that have red eyes and they're pretty spooky so I love them. Here is a quick edit with red glowing eyes.

The final result took on several subtle changes but I'll try to explain them. First thing you might notice is the sword in his back. I thought since there's an area in the game where knights are battling these creatures, it would be interesting to stick a sword in has back. He also has wild demon ears now that almost resemble demon horns. These changes are not accurate to the original dogs but we're just having fun here so it doesn't matter too much. I tweaked the brightness contrast in some areas a bit more. I really wanted to emphasize the details on his head and make it seem larger, I think the big ears help exaggerate that. I wanted his eyes to be more fearsome and I think the shadows around them help with that, the shadow on his main eye is supposed to represent a battle scar. I clustered up most of the ribs. I decided they were a little too noisy and cluttered, especially with the sword being there now, but we can still see his spine bones sticking out. The little droplets of spit flying out of his mouth looked too unnatural so I removed them. It would make more sense if he was barking but that's not the case here. So those are all the changes I can think of and here is the final sprite.

And here is an old animated scene I drew him in a long time ago. He appears mostly the same in scene but there's no sword or spit coming out of his mouth.

So that covers this doggo. I'll have to figure out what tutorial I'll write about next so keep checking by. Hopefully I will post it sometime this week but anyway, see you until then!

Back to Homepage

(4 edits)

Hey guys, I wanna talk about some slimes. We will be drawing some today but first we need to briefly discuss what a slime is. If you're a gamer, I'm sure you've seen them before. They're gooey creatures that just look like a round blob the floor but sometimes they hang from ceilings. The basic ones are usually green but then we have our elemental slimes which vary in color. Some of them have cute faces as well but for now we're starting simple with a simple green blob.

Next we probably want it to look a bit shinier, so we'll go for a highlight color.

A good skill to learn is drawing translucency. It means only some light can pass through something, such as this slime. I will admit, this is not a beginner concept and you don't need it if you're starting out, but the idea is to not only render the frontal lighting of the slime but also the back ever so slightly so that it looks see-through. 

That's how you draw a very basic slime, but let's try a Chu Chu from Zelda: Majora's Mask! It's more or less the same thing, but it has eye-stalks and a mouth. Try 32x32px.

Now if you play Zelda, you might be thinking... "Where's the magic jar? Why's he not see-through?". Both are good questions. This is only a 32x32px sprite and I've tried drawing the magic jar inside the Chu Chu but it just didn't work out for me. 

I don't think it's needed. We get it, it's a slime with a goofy face and it drops magic jars when defeated. If I was going to use it in a Zelda fan game, we could tell what the slime drops are just by looking at the color anyway: green drops magic jars and red drops hearts.

Moving on, let's try a frost slime. Let's take our original slime from the first example and change the color. If you're on Aseprite, you can go to Edit-Adjustments-Hue/Saturation then change the hue to some icy colors.



But those probably won't be the best colors so in the polishing stage I usually just get the magic wand tool and change the color groups individually. You can also set it to a shortcut key through the Aseprite preferences if you want.

Alright so it's blue now, but that alone doesn't communicate to us that this thing is made of ice. Sure it's a slime, but at the same time I want it to look like it has ice powers. Crystal shapes can be used to convey that it's made of ice so we can add them to the slime.

Cool stuff. Let's try another. How about a bloody slime with bone shards sticking out? It's a very similar process.

Then we have lava slimes where you just take some rocks, some magma, and jam them together.

Now I forgot to mention, but we also have these slime cube guys.

So those are some of the basics. I think the main things to practice here are the little dabs of highlights, and maybe achieving that see-through look some of the more liquidy slimes have. Once you get a hang of that, maybe you can try to draw the flans from Final Fantasy!

Anyway enough said. That's all I have for this tutorial. Good luck and see you in the next one!

Back to Homepage

(8 edits)

Hey guys, today I want to talk about wraiths... again. I actually talked about them before here, but I read over my post and thought maybe it was too confusing so I'm redoing the tutorial. So what is a wraith? They're basically the evil ghosts from dark fantasy you see appearing as magical undead creatures covered in tattered robes, often times floating around. Here are some of my favorite examples.

 



Let's try something simple for now. Let's draw a tattered robe humanoid figure except minus the legs. From prior experience I'm sure 32x32px is all we need to convey this.

So that's a start, now lets add a little lighting. Also pick a highlight color and shift it slightly towards green so you get this blue/green spooky color combination.

Now my favorite ghost face is literally "Ghostface" from the Scream movie series so I will add something similar for his face.

This is great, but wouldn't it be cool to give him some gear? How about some lights? We can give him candles or lanterns. When we do this, we will have to re-render the lighting so that the light is coming from our new light sources. 

Another thing we can try out are weapons. Some that come to mind are daggers or scythes but you can try swords or even axes if you want, it doesn't matter.

So those are some pretty cool iterations. I also have more that I have done in the past just to throw out ideas. They can have shields, spells, glowy hands, horns. Whatever you do, please, make them glow. Glows are awesome and catch viewers eyes in my opinion. Oh forgot to mention, these ones are standing rather than hovering and they're conjuring out of the ground so that's why you see fog here.

I also have these guys from the Devil May Cry series. I think they're known as Hell's Vanguard if I remember correctly.

And here are some animated cartoonish ones ones I've made for fun.

So yeah... have a go. If you want more ideas, I suggest browsing Pinterest for "Dark Fantasy Wraiths". You will find an endless list of illustrations there where you can pick and choose what random features to add. That's all I have to say for this tutorial so thanks for checking it out and I look forward to making more tutorials in the future. See ya later!

Back to Homepage