Chapter 1: Introduction
Isometric Pixel Art
Isometric pixel art is a style of digital art that originated from limited video game display capabilities, but truly found its voice with the underground art scene, as many art forms tend to. This art style is strongly typified by old games like Q-Bert or Zaxxon, some of the first mass-market games to use this perspective. While most isometric pixel art is cartoonish in nature, some artists can achieve impressive near-photorealistic effects in their art.
1.1: Some isometric games: Q-Bert, Zaxxon, Diablo.
Beyond the look, isometric assets work well in game development on a practical level. The fixed, vanishing-point-free view keeps every part of the screen equally readable, so players don't have to fight perspective to understand what they're looking at. Character sprite work is also simpler: symmetry can be exploited to flip sprites at runtime, and assets do not need to scale down when further from the "camera". The overhead angle opens up a lot of environmental storytelling that side-scrollers and pure top-down views simply can't fit.
Tools required (software)
Contrary to what you might think, amazing pixel masterpieces can (and frequently are) created using simple software as simple as Microsoft Paint. While simple tools can work, these days there's a wide range of programs designed with pixel art specifically in mind; a luxury that didn't exist a decade ago:
- Aseprite - $14.99 - all platforms, absolutely worth the price if you're serious at all about pixel art
- Grafx2 - free and open source 256-color drawing program inspired by Deluxe Paint for the Amiga
- LibreSprite - free and open-source - all platforms, a fork of Aseprite that's similar but behind in features
- Piskel - free sprite editor available through your browser
- Pixen - free, $9.99 to unlock all features - macOS and iOS only
- Pixquare - $19.99 - iPhone and iPad only, under active development
No matter what software you use, most basic pixel art techniques will be accessible. I'll start with some basic techniques, and more advanced chapters will use more features like layers. Proper use of layers and transparency can produce effects that are extremely difficult and tedious to create with hand-blending alone. It's certainly not impossible, but if you're at that stage, then you likely have no need for this guide.
Let's create some pixel art!
Ideas/research
Chances are you've got an idea of what you want to do already, but try and keep some constraints in mind. Because of the nature of isometric art, most pieces will be from a partially-overhead view, and there will be no perspective distortion or natural horizon. What this means is that while everything has the illusion of perspective, depth cues are produced by the surrounding elements. Without them, we end up with "illusions," or figures that are ambiguous and can be interpreted to exist in multiple depths or layouts.
1.2: Without depth cues, we end up with ambiguous figures.
Once you've got your idea, it's sometimes still good to research it before sketching it out. This can be a good way to get examples of hidden details in a scene, building elements, or encounter new concepts. For example, if you are creating a building with deco elements, you might want to look for references like the Chrysler building, and other significant deco structures. Some buildings have a fire escape system, and others have distinctive patterns.