Upcoming Events
Microsoft Gamefest Europe
8/6 @ London, United Kingdom

Ludum Dare 48hr Game Development Competition
8/8 - 8/10  

Sandbox: An ACM Video Game Symposium
8/10 - 8/11 @ Los Angeles, CA

Edinburgh Interactive Festival
8/10 - 8/12 @ Edinburgh, United Kingdom

More events...


Quick Stats
7480 people currently visiting GDNet.
2199 articles in the reference section.

Help us fight cancer!
Join SETI Team GDNet!



Link to us

  search:   

Creating Minimal Pixel Art with Photoshop (Part 1)



Contents
  Introduction
  Notes on Pixel Art
  Using Adobe Photoshop to Make Pixel Art
  Exercise #1: Simple Drawing
  Exercise #2: Selections
  Exercise #3: Advanced Selections
  Conclusion

  Printable version
  Discuss this article

The Series
  Part 1
  Part 2
  Part 3

"When the small predominates, it gets through successfully.."
- I Ching, The Predominance of the Small



 

Above: an actual single pixel (look close):

Below: image of what a pixel looks like up close (made up of 36864 actual pixels):



 

Hello, my name is Rich and I make pixel art. I create graphics and animations for the retro-style games of Pixeljam.com, and also create other forms of pixel art that I may mention later on. This is a tutorial on drawing with pixels… of sorts. I don't really know what it is exactly, but what I do know is that I'm going to create, display and talk about making minimal pixel art, as well as provide some info about using Adobe Photoshop to help you make your own pixel art.

So, why Pixels? Well, I don't know why for anyone else, but I personally love playing with pixels. Big, blocky, colorful, fun, versatile; pixels are beautiful things. I grew up with the Atari 2600, Intellivision, Commodore 64, Nintendo (NES) & Sega Genesis, and so, pixels are embedded deep in my psyche. It always feels good to me to look at pixelly things of all resolutions and styles. The work I do is currently in the 8-bit style range, but I may eventually make games in the 16-bit Sega Genesis/Super Nintendo style, as well as a game in isometric pixel style. For the purposes of this tutorial, I'm going to stick to minimal pixel art styles. It's what I love and is what I'm most familiar working and playing with at present. You can take what you learn here though and make whatever you like. The fundamentals of working with pixels will be the same.

What I'm referring to as "minimal" pixel style is the art of using as few pixels as possible to create something, which inherently looks like old computer and video game graphics. The first example of this would be a game like Pong: Two rectangles, a square and large blocky numbers to keep score. Completely simple yet fun was had around the world, and the now thriving video game industry was born.

Before I start writing a bunch of words on how to do this or that, or specifics on Photoshop tools or techniques, I'd like to go right into showing some big pixels up close & in action! For your reference on the beginnings of this style, here are some re-creations of several of my favorite Atari 2600 graphics (also known as "sprites"):



 

Ahhh… nice, right? I love seeing these broad areas of color & funky shapes attempting to look like something particular. It's somehow very gratifying for me to see. The examples here come from Combat, Space Invaders, Adventure, Berzerk and Circus Atari. These are enlarged, of course, from their original sizes.

Below are some examples of my own minimal pixel art as flowers I've made for Pixeljam Games ranging from very simple and blocky to more organic and curvy.



 

Above: 100% scale. 1x1 - Pixels in their natural size

Below: 300% scale. 3x1 - The final resolution these were intended to be seen at



 

And here they are below, nice and large. This is how I like my pixels. I've also set them up as large time-lapse Gif animations to demonstrate roughly the process involved in making these. Just click each one to see it draw out.







Notes on Pixel Art