Head MakerA stranger hands over their face in about forty seconds.

Head Maker across four steps: the photo drop, the cutout frame, the placed face landmarks, and the finished living head.
Role
Designer & builder
Team
Solo
Built with
Canvas, vanilla JavaScript
Output
A playable head, or a transparent PNG
Year
2026
Overview

Head Maker turns a photograph into a character: cut out the head, place the eyes, and it comes alive and joins the games on this site. The whole thing happens inside the browser tab, and the photo never leaves the device.

Problem

This is the one screen that asks for something people are careful with.

A face is not a file. Everything else here can be browsed with no commitment, and this page opens by asking a visitor for a photograph of themselves. Every decision on it shortens the distance between arriving and seeing something recognisably you, and puts the privacy promise in the interface rather than in a policy.

The first step of Head Maker: a large drop zone for a photo, with the line about the photo never leaving the device.
The promise sits under the drop zone, where the decision is being made.
Structure

Four steps, named for what you get rather than what you do.

Photo, Cutout, Face, Alive. Not Upload, Crop, Configure, Export. Each label is the thing you have at the end of it, so the row reads as a story with an ending instead of a form with four pages. The buttons agree: Cut it out, then Bring it to life.

Step one of Head Maker, the empty photo frame.Step two, the photo inside the cutout oval.Step three, the face landmarks placed on the cut head.Step four, the finished head with living eyes and a contact shadow.
The same face through all four steps. Nothing is asked for twice.
Nothing starts empty

The landmarks are placed for you, and you nudge them.

A blank canvas is a request for work. Eyes, brows, nose and mouth arrive already positioned, and the instruction is to drag one if it looks wrong. Almost nobody moves more than a single dot, which is the point: the step exists so the result is yours, not so you have to earn it.

The Face step of Head Maker, with eye, brow, nose and mouth markers already placed and a short instruction beside them.
Four landmark kinds, colour keyed, already where they should be.
Craft

Half of every head I baked was the wall behind me.

The cut used to be an oval, and a real head is narrower than an oval everywhere below the cheekbones. The room came with the face, and on the dark Play page that read as a bright band tracing the silhouette. It lifts a real background matte first now, then unmixes the edge, so a hair thinner than a pixel takes part of the alpha instead of a white ghost of itself.

When it is not sure

It refuses rather than guesses.

The first version that worked on the numbers gave me back a bald head with a face on it. It had decided hair was background, because hair is the most uniform thing at the top of a portrait, and every number improved while it did that. A region has to own two corners of the frame now, and anything unresolved comes back as the plain oval rather than a confident wrong answer.

The Cutout step of Head Maker, with zoom and straighten controls beside the framed photo.
Two controls at this step. Everything else is the tool’s job.
Payoff

The reward is not a download.

The head walks off this page and into the games. It gets a face rig, blinks, eye tracking, physics and a contact shadow, because unlike almost anything else on this site it is standing on something. The transparent PNG is there too, but what people come back for is watching their own face lose a football match.

The final step of Head Maker: the living head with a name field, save options and a row of previously made heads.
Naming is optional. Keeping it is one tap, and it is already saved.
Outcome

It stopped being an article and became a tool.

The first version explained itself. It had prose, a heading and a scroll, which is what you build when you are not sure anyone will follow. It is one screen now, picture on the left and decision on the right. Every sentence left on it is either an instruction or the promise about the photograph.

Head Maker at 390 and at 320 pixels wide, the picture above the controls at both.
390 and 320. The steps keep their order at both, so the story does not change with the screen.