Craft·5 min read

Why Game Artwork Gets Drawn Twice

The first version of every level we build is coloured rectangles. That is not a shortcut, it is the only order that works.

The title screen of the B Bear platformer, with the painted bear standing against a hand-drawn backdrop.

The first playable version of every game we build looks like a wireframe. Grey rectangles for platforms, a plain box where the character will be, a small circle for anything you can pick up. It is genuinely playable and it is entirely ugly.

That is not a stage we rush through to get to the good bit. It is the only order in which the work can be done, and building the other way round is one of the most common ways an amateur game goes wrong.

The dependency nobody expects

Here is the chain, and it only runs in one direction.

How far a character can jump is decided by its jump strength, its gravity, its running speed and its acceleration. Those four numbers are tuned by playing, until jumping feels right rather than floaty or heavy. That tuning is described in what makes a jump feel right.

Where a platform can be placed is decided by how far the character can jump. A gap slightly wider than the arc is impassable. A gap slightly narrower than the arc is trivial. The interesting distances are the ones near the limit, and you cannot know where those are until the arc is settled.

What the level looks like is decided by where the platforms are.

So: movement, then layout, then art. Every stage depends on the one before it, and none of them can be usefully done out of order.

What happens if you go backwards

Start with the painting instead, which is the tempting order because the painting is the exciting part.

Somebody produces a beautiful street scene. Platforms are then placed where the artwork suggests they should go: on that ledge, that windowsill, that awning. The character is dropped in and the gaps do not match the jump.

Now there are two options and both are bad.

Redraw the scene so the ledges are where the jump can reach. Expensive, demoralising, and it will happen again on the next scene.

Or change the jump so it reaches the ledges. This is what actually happens, almost every time, because it is one number and it takes ten seconds. And it is much worse, because the jump was tuned to feel right and now it has been detuned to solve a layout problem. The game gets slightly worse everywhere in order to fix one screen. Do that six times across six scenes and you have a game where jumping feels vague, and nobody involved can point at when it went wrong.

The blockout exists to make sure that conversation never starts.

The blockout does not get thrown away

The thing that surprises people is that the rectangles stay.

In the finished game, the platform geometry is still a list of rectangles. The painting is drawn on top of it. Nothing in the collision code has any idea what the game looks like, which is exactly the arrangement described in how a game knows you hit the ground.

So the blockout is not a draft of the artwork. It is a different thing entirely that happens to be visible early because there is nothing yet to cover it. Calling it "drawing it twice" is the wrong frame: the geometry is drawn once, the picture is drawn once, and they are separate deliverables that meet at the end.

Our engine template makes that literal. If a sprite fails to load, the character falls back to a plain white rectangle and the game carries on being completely playable. That fallback is not an error state, it is the blockout showing through.

The title screen of the B Bear platformer, with the painted bear standing against a hand-drawn backdrop.
The bear is a picture drawn at a fixed size over a rectangle. The rectangle is what the game reasons about.

Why this is worth more in a commission than in a normal game

For a studio building its own game, this is good practice. For a commission it is close to essential, and the reason is that the artwork depends on somebody else.

A commission's art comes from photographs the customer supplies. Those photographs arrive when they arrive. A brief changes, a better picture turns up, somebody decides the dog should be in it after all. If the game cannot be built until the final art exists, every one of those changes stops the build.

Because the geometry and the picture are separate, they do not. The level is laid out, tuned and tested with placeholders while the artwork is still being produced or still being chosen. The painting arrives and drops into a game that is already known to work.

It also means a late change is cheap. Replacing a character sprite is replacing one file. Nothing about how the game plays moves, because nothing about how the game plays was ever expressed in the picture.

The same principle in the other builds

This is not only a platformer idea.

In our chess game the board, the rules and the engine were complete and correct long before a piece had a face. The fight animations sit on top of a game that was already a working game without them.

In the painted adventure, each room carries a small block of numbers describing where the walkable floor is, chosen to suit the painting. The painting and the geometry are separate right down to the level data, which is what makes three different ways of presenting a scene possible.

The pattern is the same every time: build the thing that has to be right, then dress it.

What this means for a commission

You will see something playable before you see something pretty. That is deliberate, and it is the point at which changing your mind is cheapest.

Late artwork is not a crisis. The build does not wait on it. What the build waits on is the brief, which is a much smaller thing to get out of you.

And "it plays well" is decided before "it looks good". Which is the right way round, because a game that looks wonderful and plays badly gets opened once, and the whole point of a commissioned game is that it gets opened again.

◆ Questions

Common questions

Why do games use placeholder art?+

Because the layout of a level has to be decided against how the character moves, and how the character moves is tuned before anything is drawn. Building against finished art means either the art gets redrawn or the movement gets bent to fit it, and the second is the one that quietly happens.

What is a blockout in game development?+

A version of a level built entirely from plain shapes: rectangles for platforms, a box for the character, a circle for anything collectable. It is playable, it is tunable, and it contains no art at all.

Isn't drawing everything twice wasteful?+

Nothing is drawn twice. The blockout is not artwork, it is geometry, and it stays in the finished game as the collision layer underneath the painting. What would be wasteful is painting a scene and then discovering the jump does not reach.

Can the artwork change after a game is built?+

Yes, and that is the point of the separation. The picture is drawn over the geometry, so replacing a sprite or a background does not touch the physics. It is how a build survives late changes to a character's look.

How does this affect a commission's timeline?+

It means the game is playable before the artwork exists, so problems with how it plays are found early and cheaply, and the painting happens against a level that is already known to work.

  • craft
  • art
  • process
  • behind the scenes
◆ Keep reading

Related from the journal.