← All courses

Game UI & HUD Pixel Art

Draw hearts, coins, bars and panels that read instantly in the heat of play.

Intermediate 5 lessons ~18 min Graded certificate Free
Start the course — it's free Free pixel editor

What you'll be able to do

  • Draw UI that reads in a split second without fighting your game art
  • Make tiny icons (hearts, coins, keys) that are recognisable at actual size
  • Give a flat icon depth with a dark rim and a single highlight
  • Build health and resource bars that read at a glance
  • Understand nine-slice panels so one frame scales to any size
  • Keep a whole HUD cohesive with one palette, one light, one scale

Lessons

  1. 1 What game UI has to do Read instantly, stay out of the way, and belong to the same world.
  2. 2 Readable icons An icon is a silhouette first. Draw the heart, then judge it small.
  3. 3 Giving an icon depth A dark rim and one highlight turn a flat shape into a solid object.
  4. 4 Bars, meters and panels Health bars read at a glance; nine-slice frames scale to any size.
  5. 5 A cohesive HUD One palette, one light, one scale — then publish a piece of it.
  6. Graded quiz + certificate 7 questions. Pass to earn a shareable certificate.