I've been doing pixel art in the NES style for about 5 years now, I have over 500 hours in Aseprite on Steam, and my current indie game project, Lady Dracula, is all done in the style of NES (and Gameboy) graphics. The NES style seems to appeal to a lot of people, so I thought it'd be fun to go over the process of how I make pixel art in this style, while also having the perfect excuse to plug my game (did I mention it's called Lady Dracula?)
First, let's talk setup. Regarding software, I use Aseprite. It's 20 dollars on Steam. This might sound like a lot, but to me, it's been worth it. The reason I suggest Aseprite to people is because, unlike other image editing software like Paint, or Gimp, or Photoshop or whatever, Aseprite is built from the ground up specifically for the purpose of creating pixel art. All the pixels in your image are locked onto a grid, and the image isn't compressed or blurred like it would be in other software. It's image editing software by and for pixel artists, and I swear by it.
Another killer feature of Aseprite is its built-in retro console palettes. There's about 60 of these, including NES, Game Boy, Game Boy Color, Virtual Boy, and more obscure stuff like Commodore, Apple 2 and so on. In the above image, I've searched for the built-in NES palette. Not having to hunt these down saves a lot of time. Don't expect a palette preset for SNES or anything after, though, cause consoles at this point evolved beyond having limited palettes like this. For our purposes, though, it'll do fine.
So you've got Aseprite, and you've got the NES palette selected - great. Now is a good time for us to talk about the technical limitations of the NES that give it its distinct style.
First of all, the NES had a screen resolution of 256x240, so that's the screen size I shoot for in my NES-style games. The image on the screen is constructed from a grid of 16x16 tiles. Most sprites are limited to three colors, plus a fourth color for transparency, and most background tiles are limited to about four colors. In the above image, I've opened a new image, and set its dimensions to the appropriate size. You can adjust the canvas size again at any time by pressing C.
An additional limitation of the NES is that you could only have a handful of tile palettes on screen at a time. This is a rule I kind of skirt around, I try to keep the count of my palettes limited, but I find my graphics look authentic enough without splitting hairs about total number of palettes on screen at a time. This is up to you, though.
256x240 is a pretty huge resolution to work at for someone brand new to pixel art. Luckily, we're gonna construct our game screen primarily from reused tiles, most of which are gonna be either 16x16, 16x32, 32x32, numbers like that. Let me give some examples of images at these resolutions.
This brick tile is 16x16:
This player sprite is 16x32:
This grandfather clock sprite is 32x64:
I've blown these up 300% to be easily visible, so their actual resolutions are 3 times their pixel resolutions - so don't download them and insert them into your image, expecting it to work. You'll have a bad time. These are just examples of tiles of various sizes. Let's look at another full-screen example.
So, in this image of my game Lady Dracula, I've made a little battle arena for the player's boss-fight encounter with the vampire hunter Van Helsing. Again, my style is "mostly console accurate," but I cheat a little. Most of this image, ignoring the UI up top, is composed of about 8 tiles - three pink brick tiles (bright, medium and dark), two tiles making up the pink brick arches, a gray block tile, the red brick tile at the bottom, a blank black tile, and then two sprites for the two actors on screen. For the big stained glass window and the altar in the center, I cheated a bit. I still kept things to the appropriate number of colors, but I freestyled some and didn't worry so much about constructing things from tiles. This is just my personal style, it's enough accuracy for me, you may desire a style with more or less accuracy than this for your own projects.
So, the basic breakdown of this tileset goes like this: I have a tile for the floor / solid blocks, I have a tile for the "underground" below the floor, I have a tile for empty space (the blank black tile), and I have a couple tiles for the walls in the background. So, with a set of 10-15 or so basic tiles, you can make a pretty good looking NES-style scene. Here's another example:
In this scene, the player is crossing the bridge to Lady Dracula's castle, over a frozen lake. This one is a little more accurate to system limitations. Ignoring UI and entity sprites, this entire scene is composed of about 15 16x16 tiles. The moon is a tile, the trees are composed of 2 tiles, the water reflections are made up of 6 tiles, the mountain ranges are 3 tiles, and so on. When I "cheat" tile limitations like in the Van Helsing image, it's usually for boss fights, to create a particular setpiece or mood. I tend to stick more to limitations for scenes like this, where it's just a "regular level." Generally, it's a combination of both.
So, basically, you want to create your tiles in small, separate images (appropriately named and organized, to avoid future headaches), and then use these small tiles to construct the larger scene. If you're making a real game, you're ultimately going to import your tile sets into whatever engine you use, like Unity, or Godot, or whatever, and build the final level in there, with collision detection assigned to the appropriate tiles and so on. I personally like to do mockups first, though, especially for important scenes like story moments or boss fights, just to make sure everything looks the way I want it beforehand.
There's two major ways of doing mockups in this system - the smart way and the dumb way (I tend to do things the dumb way). The smart way, is building them using a separate, free software called Tiled, where you can import your entire tile set, and the image is all on a grid of tiles that can be changed easily on the fly. The dumb way is to just do everything in Aseprite and copy-paste and drag your tiles a million times (I might be guilty of this). Here's an example of me doing a mockup the dumb way, with my tiles on the right side and a divider between:
But again... you should probably use a combination of Aseprite (to make tiles), and Tiled, to place your tiles on a grid. You can download Tiled here, it's free: https://www.mapeditor.org/
So we've gone over basic setup, the limitations of the NES, and how to make graphics in a NES-looking style. I want to briefly go over the basics of how to make good pixel art in general.
First of all, you should read this post. It's the "pixel art bible," and any aspiring pixel artist should read it, regardless of what style they're after: https://pixeljoint.com/forum/forum_posts.asp?TID=11299
But here's a few basics: Limit color count, choose a lighting direction, keep your resolutions as low as possible, and like with any art, USE A REFERENCE when possible, like for materials like bricks or wood, or for real-life objects like horses, for example.
One of the big hurdles to starting with pixel art, is knowing what colors to use in your palette. This is why I recommend NES, or even Gameboy, palettes to beginners - it takes the burden of color selection mostly off your hands. The Gameboy palette is particularly easy to work with, because you don't really have color options at all, just different levels of brightness. I like working with the Gameboy palette a lot, actually, and the Underworld level in my game, Lady Dracula, is all Gameboy style:
Finally, it takes time. You will be bad at first, I was too, this is normal.
My first-ever pixel art looked like this:
After about 50 hours of practice, my art looked like this:
Another 50 hours or so of practice, and I could do this:
Lately, it looks like this:
My point is.... stick with it.
Thanks for reading.
Sarah / Goth Donut Games
