Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Pixel art: simple shapes for better designs

253 views

Published on

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.

Published in: Design
  • Be the first to comment

  • Be the first to like this

Pixel art: simple shapes for better designs

  1. 1. “Pixel Art: Simple Shapes for Better Designs” by Misbug
  2. 2. “Pixel Art: Simple Shapes for Better Designs” by Misbug
  3. 3. “Pixel Art: Simple Shapes for Better Designs” by Misbug
  4. 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. 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. 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. 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. 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. 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. 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. 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. 12. “Pixel Art: Simple Shapes for Better Designs” by Misbug WHY IS CLUSTER CONTROL SO IMPORTANT?
  13. 13. “Pixel Art: Simple Shapes for Better Designs” by Misbug LESSIS MORE
  14. 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. 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. 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. 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. 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. 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. 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. 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. 22. “Pixel Art: Simple Shapes for Better Designs” by Misbug JAGGED LINES Sequences and repetitions help to build smoother lines
  23. 23. “Pixel Art: Simple Shapes for Better Designs” by Misbug JAGGED LINES Sequences and repetitions help to build smoother lines
  24. 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. 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. 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.”

×