How To Work Out The Size of Sprites & Game World

When you are making a new pixel art game, how do you work out what size to make your sprites? How many pixels should you display on the screen at one time? It’s something I review every time I start a new game. Here are some quick tips to think about.

References

The first thing you should do, if you’re not sure about sprite sizes, is find references from other games. Is there a particular game, or genre, you want to emulate the look of? Do some google searches, look at other games. Are you hoping to catch the feeling of a SNES game? Or SEGA Mega Drive? Look at games from those systems. And don’t forget that part of creating a particular feeling is using the right colour palette, of which I have some you can use here.

The graphics of my game Puzzledorf were partly inspired by the block pushing puzzles from the early Gameboy Pokemon games, so I used old Pokemon sprites for inspiration, as well as top-down sprites from random RPG games I liked the look of.

The 3 blue characters are early concepts for Puzzledorf’s hero, although 1 is unfinished. Below is the final product in-game.

A lot of great, classic animators used references, as I talk about in my article, The Visual Design of Puzzledorf“. They key is they are “references” to get inspired by – not outright copying their designs.

And don’t just look at references for characters. Look at references for the environment too. Again, looking at Gameboy references was very helpful to compare the character to the environment, his size against a tree, for example. I didn’t quite use the same sizes as Pokemon on Gameboy, but there was definitely inspiration. I made sure to look at both Gameboy Advance as well as the classic Gameboy.

Screen Size

With screen size, you need to think about the device your game will be played on. I like to think in terms of the number of pixels on a HD screen. Full HD is:

1920 x 1080 pixels

In Puzzledorf, my sprites are:

12 x 12 pixels

Obviously a 12 x 12 sprite is gonna look tiny on a 1920 x 1080 screen. When you are resizing pixel art, it’s best to work in whole numbers. In other words, you can make a sprite 2x bigger, or 3x bigger, or 4x bigger, but not 1.5x bigger. If you made it 1.5x bigger, the pixels would get distorted, so you need to avoid decimals. You can read more about resizing pixel art here.

What I do then is work backwards from full HD and find a screen size where my sprites fill up the amount of screen space that I want. I will try out numbers that evenly divide into HD, in other words:

384 x 216 (1/5 HD)

480 x 270 (1/4 HD)

960 x 540 (1/2 HD)

1,440 x 810 (3/4 HD)

Typically I will work at 1/4 HD, or 480 x 270. I design the whole game at that size, and put it in to the engine at that size. I then let the games camera multiply everything by 4, so that it displays at full HD. If you set it up right, it will also look perfect at 4k, because that also divides evenly into HD.

This is how my game looks:

Before I make a final decision about sprite and screen sizes, I like to take a screenshot and look at it on a big screen TV. That way I know it doesn’t just look good on my PC monitor, which is a lot smaller than my PC, but I know that it will also look good when blown up.

A lot of TV’s will let you look at pictures on a USB stick. If you can’t swing that, you could just upload it as a video on Youtube on a private account and view that, and there are other ways.

Final Look

Don’t forget – your initial concepts may look fine on the big screen, but before you get too committed to an art style, make sure you look at some proper mock ups with graphics that look close to what the final product could look like. That way you know you’re really confident with those sprite sizes and art style. There’s nothing worse than being a long way into a project, only to want to redo all your art.

For the same reason, try and nail sprite sizes down early on so you don’t have to stress about redoing a lot of code / engine design later. Having said that, getting some fun prototypes going before you marry yourself to an art style is also a good way to make sure what you’re working on is fun before you waste time making a ton of art.

If you enjoyed reading, try my game Puzzledorf.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

Blog at WordPress.com.

Up ↑

%d bloggers like this: