Pixel art always relates into players’ minds to nostalgia and retro-vibed video games, but the potential of this medium assumed a new form during the last decade creating a new way game artists can express visual languages and game design approaches. Starting from the pixel, the ways it can be shaped to and the study of Japanese sprite artists work, pixel art can be a powerful device for designers to add to their visual tool belt during game development process.

1. “Pixel Art: Simple Shapes for Better Designs” by Misbug

2. “Pixel Art: Simple Shapes for Better Designs” by Misbug

3. “Pixel Art: Simple Shapes for Better Designs” by Misbug

4. “Pixel Art: Simple Shapes for Better Designs” by Misbug
DESIGN A LANGUAGE
Designing a visual language is a bit like creating a verbal language,
but instead of words and letters we use shapes and colours

5. “Pixel Art: Simple Shapes for Better Designs” by Misbug
DESIGN A LANGUAGE
Designing a visual language is a bit like creating a verbal language,
but instead of words and letters we use shapes and colours

6. “Pixel Art: Simple Shapes for Better Designs” by Misbug
DESIGN A LANGUAGE
In a visual language basic shapes are the principal bricks
graphic designers use to build sentences
Hey wait a second… This is a huge PIXEL!

7. “Pixel Art: Simple Shapes for Better Designs” by Misbug
Old Cathodic Ray Tube (CRT) screens where displaying
blurry pixels that didn’t look like squares in the general
composition.
Crash 'n' the Boys: Street Challenge - Technos Japan (NES - 1992)

8. “Pixel Art: Simple Shapes for Better Designs” by Misbug
High Definition technology shows nowadays the real
nature of pixels, giving them back their design function
Crash 'n' the Boys: Street Challenge - Technos Japan (NES - 1992)

9. “Pixel Art: Simple Shapes for Better Designs” by Misbug
CLUSTERS
Pixels alone are insufficient to produce information.
In order to do so pixels need to be displayed in clusters of
pixels of the same colour and function
Crash 'n' the Boys: Street Challenge - Technos Japan (NES - 1992)

10. “Pixel Art: Simple Shapes for Better Designs” by Misbug
CLUSTERS
Pixel artist duty is to make right decisions on how to
shape individual units in a cluster in order to produce the
correct information

11. “Pixel Art: Simple Shapes for Better Designs” by Misbug
CLUSTERS
On more complex pixel art illustrations anti-aliasing
has to be considered part of a cluster
Disgaea: Hour of Darkness (Playstation - 2003)

12. “Pixel Art: Simple Shapes for Better Designs” by Misbug
WHY IS CLUSTER CONTROL
SO IMPORTANT?

13. “Pixel Art: Simple Shapes for Better Designs” by Misbug
LESSIS
MORE

14. “Pixel Art: Simple Shapes for Better Designs” by Misbug
LESS IS MORE
• Banding
• Bad Anti-Aliasing
• Pillow Shading
• Jagged Lines
Bad Dithering, Sel-Out, Eyeburn
Clusters need to avoid features that prevent readability

15. “Pixel Art: Simple Shapes for Better Designs” by Misbug
BANDING
Banding occurs when two clusters of pixels perfectly align
marking the pixel grid in an unpleasant way
Pokémon Diamond / Pearl (Nintendo DS - 2006)

16. “Pixel Art: Simple Shapes for Better Designs” by Misbug
BANDING
Banding occurs when two clusters of pixels perfectly align
marking the pixel grid in an unpleasant way

17. “Pixel Art: Simple Shapes for Better Designs” by Misbug
BANDING
Banding occurs when two clusters of pixels perfectly align
marking the pixel grid in an unpleasant way

18. “Pixel Art: Simple Shapes for Better Designs” by Misbug
BAD ANTI-ALIASING
Anti-Aliasing facilitates transitions between clusters but it
has to be a subtle part of the cluster
and not a middle-way cluster
Dragon Ball Z: Harukanaru Goku Densetsu (Nintendo DS - 2007)

19. “Pixel Art: Simple Shapes for Better Designs” by Misbug
BAD ANTI-ALIASING
Anti-Aliasing facilitates transitions between clusters but it
has to be a subtle part of the cluster
and not a middle-way cluster

20. “Pixel Art: Simple Shapes for Better Designs” by Misbug
PILLOW SHADING
Pillow shading is a bad way of scaling colours during
shading and of course a not a good way for producing
useful clusters
Mario & Luigi: Bowser's Inside Story (Nintendo DS - 2009)

21. “Pixel Art: Simple Shapes for Better Designs” by Misbug
JAGGED LINES
Uneven distribution of pixels on a cluster defining a line
can create jagged lines
Castlevania: Symphony of the Night (Playstation - 1997)

22. “Pixel Art: Simple Shapes for Better Designs” by Misbug
JAGGED LINES
Sequences and repetitions help to build smoother lines

23. “Pixel Art: Simple Shapes for Better Designs” by Misbug
JAGGED LINES
Sequences and repetitions help to build smoother lines

24. “Pixel Art: Simple Shapes for Better Designs” by Misbug
WHY THE FUSS?
• Better approach at pixel art
• General improvement in building
a visual language
• Tool for better parsing portfolios
• Better production management

25. “Pixel Art: Simple Shapes for Better Designs” by Misbug
“Like everyone else you
want to learn the way to
win, but never to accept
the way to lose. To learn
defeat is to be liberated
from it.”
Bruce Lee

26. “Pixel Art: Simple Shapes for Better Designs” by Misbug
Bruce Lee
“Comfort zones make you
dull. Always try something
new, and don’t be worried
about taking false steps,
because mistakes bring
new things to life.”