Kernel: a mascot who reacts to every guess

Bad Plot is a daily movie-guessing game I designed and built. You get one movie a day, described as badly as possible, and five guesses. Each wrong guess reveals the next line, which is still bad, just a little less bad. It's a game my friends and I already played out loud; the app makes it a daily habit.

A game like this is mostly a text box. Kernel is the part that isn't: a single piece of popcorn who sits in the front row, eats while you think, and has an opinion about every guess you make.

Before Kernel there was a clapperboard

The first version of Bad Plot had no character at all. It was a dark movie-marquee theme: near-black surfaces, a gold accent, a serif wordmark, and a brief that called for the voice of a bored film critic. It was handsome and a little cold. A second pass went the other way, red on white and very graphic. Neither gave the player anyone to play against.

Kernel arrived in a single day of rework, and the app icon tells the story of that day better than I can. The clapperboard monogram became his face within hours of him existing.

Five moods, one for each moment in the game

Kernel doesn't have a library of animations to show off. He has exactly as many moods as the game has moments: curious when the puzzle is fresh, thinking once you've guessed or taken a hint, unimpressed right after a wrong guess, delighted when you win, and asleep when you run out of guesses. Nothing plays unless something in the game caused it.

The small motions carry him

Most of what makes him feel alive is always running, whatever his mood. He bobs on a slow 2.4-second breath with a little squash and stretch. He blinks, twice in quick succession, every few seconds. While you're playing he lifts a piece of popcorn to his mouth and chews it. When his mood changes he compresses slightly and springs back, which is enough to make a change of face feel like a reaction and not a swap.

He's drawn as a handful of vector shapes (a body, a shadow, a highlight, a face) and animated in code with React Native Reanimated, so the same character runs on the iPhone app and the web version with no video files or sprite sheets.

Two bugs that taught me the most

The first: his popcorn box bobbed, rocked, and squashed along with him, which made him look like he was painted on a sticker. Separating the box so it sits still on the ground while he moves behind it was a small change that made him a body in a space.

The second: his win-screen rock had a hitch. Once per cycle the loop snapped back to its start and he twitched. The fix was to drive the rock from a phase that climbs steadily and feed it through a sine wave, so the jump back lands exactly where the wave already is. He now rocks for as long as you leave the screen open, and the seam is gone.

Color does the rest

Each screen is one flat field of color with a card floating on it, and the color is the game's state: a win screen is the green screen, a loss is the terracotta one. Kernel's mood and the color always change together, so the result lands before you've read a word. Dark mode keeps the same idea with deeper fields, and Kernel himself doesn't change at all.

Where he lives now

Once he existed, he took over. He's the app icon and the launch screen. He heads the privacy policy and support pages. He's on the card that appears when someone shares their score. And he has his own page, where you can try each mood and empty his popcorn box yourself.