Craft·6 min read

How We Built a Cassette Loading Screen

It counts to 48000 because that is what a 48K machine had. And while it performs, it is doing real work.

The cassette loading screen from the Tape Loader birthday game, with colour-barred borders and a byte counter reading part of 48000.

The first thing our sixtieth birthday game does is waste your time on purpose. A black screen, a border of scrolling colour bars, a counter climbing towards 48000, and a noise that anybody over fifty will recognise in under a second.

It is a joke, it is the emotional centre of the whole build, and it is also doing genuinely useful work. Here is how it is put together.

Why the wait was the memory

Games in the early eighties came on ordinary audio cassettes. The data was stored as sound, and loading a game meant playing the tape into the computer and letting it decode the noise back into a program.

That took minutes. Several of them, for a game that filled the machine. And there was nothing to do but stand there and hope, because if the tape had stretched, or the volume was slightly wrong, or somebody knocked the table, it would fail at the end and you would start again.

The shared memory of that generation is not any particular game. It is the waiting. Which makes it the correct thing to open a birthday game with, because it is the one experience everybody in the room over a certain age had, and it takes them straight there before any content has appeared.

The border was the data

The most recognisable part is the striped border, and what makes it worth reproducing carefully is that it was never decorative.

The machine changed the border colour as it read each pulse from the tape. The stripes were the data arriving, in real time, made visible. That is why they had that particular hectic rhythm, and it is why anybody who used one of those machines could tell at a glance whether a load was going well: steady stripes meant it was working, irregular ones meant trouble.

Ours draws that faithfully. A border seventy-two pixels deep on all four sides, filled with twelve-pixel bands cycling through eight colours, offset by a value that increases every frame so the pattern scrolls. The eight colours are the palette those machines actually had.

Nothing about it is data any more. But it moves the way the real thing moved, and that is what the eye is checking against.

The counter counts to a real number

The screen reads "Bytes: n / 48000".

Forty-eight thousand because the machine being remembered had forty-eight kilobytes of usable memory, so a game that filled it was about forty-eight thousand bytes. Anybody who owned one knows that number without being able to say why they know it.

Above it sits the header in the format tape loaders actually used: the program name, then a subtitle. Underneath, a progress bar made of seventy-two coloured segments filling left to right, again in the period palette.

The progress runs over two hundred frames, which is a little over three seconds. That is nothing like the real thing, which took minutes, and it is the right length, because the joke needs to land and then stop. A faithful reproduction would be a genuinely terrible piece of design.

The cassette loading screen from the Tape Loader birthday game, with colour-barred borders and the byte counter climbing.
Three seconds of this is affectionate. Three minutes would be hostile.

The screech has no audio file

The noise is generated, like every other sound in that build.

It is a square wave whose frequency wobbles, a carrier around eleven hundred hertz modulated by a slow oscillation, mixed roughly half and half with white noise, and pushed through a narrow bandpass filter centred at eighteen hundred hertz.

That is not a description of a recording. It is a description of a sound being manufactured from three components, and the reason it works is that the original was itself a machine-generated noise. There is no performance to capture and nothing organic to miss. Synthesis is not an approximation here, it is the same category of thing.

It starts when the loading screen starts and stops when the screen ends, which required one small piece of care: the sound is held in a variable so it can be stopped early if somebody skips, and stopping it is wrapped so that a browser that has already discarded it does not throw. The general approach is described in how a game makes sound without any sound files.

It is also the real loading screen

Here is the part that makes this more than set dressing.

The game embeds all of its artwork in the file, and those images take a moment to decode when the file opens. Something has to cover that moment. Most games use a spinner, or a progress bar, or nothing at all and a black screen.

Ours uses this. The loading screen tracks how many assets have actually finished decoding and displays it in small text under the theatre: "decoding 14/22", which changes to "assets ready" when they are done. And the transition to the title screen requires both conditions: the performance has finished, and the assets are genuinely ready.

So the joke is load-bearing. On a fast machine the three seconds of theatre is longer than the real decode and the wait is entirely for effect. On a slow phone the real decode is longer, and the screen simply keeps performing until the game is ready. The player experiences the same thing either way and never sees a spinner.

This is the sort of thing that only turns up when the period detail and the engineering happen to want the same screen. It was not planned. It became obvious once both existed.

The line that makes it a gift

Under the progress bar is a line in small grey text: press any key to skip the bit everyone remembers.

That sentence is the whole design of the screen. It tells you it is a joke, so nobody thinks the game is broken. It lets you out, so nobody is trapped. And the phrase "everyone remembers" says out loud what the screen is for, which is to be shared with the people in the room.

Almost nobody presses it the first time. That is not because the screen is short. It is because being told you may leave is what makes people want to stay.

What this means for a commission

Period detail has to be accurate to be affectionate. A vaguely retro loading screen is a decoration. One that counts to 48000 in the right palette is a reference, and the person it is for can tell the difference immediately.

And it has to be brief. Faithfulness to a three-minute wait would be faithfulness to the worst part.

Ask for the specifics. Which machine, which years, what was in the bedroom. Those details are what the build is made of, and they are covered further in gifts for people who grew up in arcades and in the game itself, which you can play in the arcade.

◆ Questions

Common questions

Why did old computers take so long to load games?+

Games were stored on ordinary audio cassettes and read as sound, at a few kilobytes per minute. A game filling a 48K machine took several minutes, and the striped border and screeching noise were the data itself being decoded in real time.

What was the striped border on a loading screen?+

A side effect turned into a signal. The machine changed the border colour as it read each pulse from the tape, so the stripes were literally the data arriving. If they stopped or went irregular, the load was failing.

Why 48000 bytes?+

Because the most common home computer of that era had 48 kilobytes of usable memory, so a full game was about 48000 bytes. The number is the joke and the period detail at the same time.

Is the loading screen just for show?+

No. It performs a nostalgic load and simultaneously waits for the game's real assets to finish decoding, and will not proceed until they have. The theatre and the actual work happen at once.

Can you skip it?+

Yes, and the line offering to let you says press any key to skip the bit everyone remembers. That framing is the entire point of the screen.

  • craft
  • behind the scenes
  • design
  • audio
◆ Keep reading

Related from the journal.