Make Your Own UI Examples

Activity Progress:

You have two options: use an existing game with a screenshot or just draw the entire screen.

To use an existing game, Google “Video Game Screenshot” and try to choose one that’s not showing a UI. Pick one and right click it. Save the image to your Desktop.

Here’s an example.

Then go to and upload your image. If you don’t have an image, just go to Piskel.

Import the file into Piskel like this then create a new layer on top:

To complete this assignment, draw at least 4 UI elements and there have to be two types from the “4 types of UI.”

As a review, that is Diegetic, Non-diegetic, Meta, and Spatial. Go back to that activity if you forget what they are.

Here’s my example. Don’t just redo what I give here or it won’t get approved. Can you spot the different types of UI?

Once finished, upload your assignment for review below: