I Built a Tiny Pocket Poetry Gadget for My Website

It started as a link. I was rewriting my about page and got to the sentence where I define poetronics, my word for electronics with the sensibility of a poem, and the obvious move was to link the word somewhere. A little page, one generated line, a button. Fine.

But a link takes you away, and I kept thinking about how the thing I actually love is when a website hands you an object instead of a destination. So the link became a window. And the window became a device.

The Device

Click “poetronics” on my about page and a small gadget pops up over the text. It has a pink titlebar you can drag it around by, an e-ink colored screen, a blinking standby LED, two dials, a speaker grille, a mode switch, and one chunky button labeled brew ✿. Press it and the screen prints a one line poem:

the velvet capacitor dreams of a dropped stitch

Press it again and you get another. That’s the whole interaction. One poem at a time, not a feed.

The Grammar

The poems come from Tracery, Kate Compton’s generative grammar library, which I have loved ever since learning about her work and revisiting it in a class called Reading and Writing Electronic Text by Allison Parrish (who is also my truest inspiration for anything text related!). You write rules with slots, like the #machine# dreams of #memory#, and word lists to fill them: machines (soft computer, e-ink moon, velvet capacitor), memories (the dial-up song, a dropped stitch, the away message), textures, colors, times of night. Tracery picks and expands, and suddenly the machine is saying things I never wrote but completely recognize.

The real work is not the code. The expander is a few lines. The real work is gardening the word lists until the machine sounds like you. Every word in the corpus is a small editorial decision, and the poems are only ever as good as the lists. I think of it as teaching a very small student my entire vocabulary of feeling, then letting it talk.

The Body

The design brief in my head was: a cyberdeck that Polly Pocket would carry. Thick black outlines and a hard offset shadow so it reads as molded plastic instead of glass. Asymmetric corner radii so it feels injection molded rather than drawn with a rectangle tool. The shell is the lavender from my wordmark, the titlebar is pink, the brew key is butter yellow. Two of the controls do nothing at all, which is the most honest detail on the device, because real gadgets are covered in controls you never touch.

And it has visible personality choices. The LED blinks every few seconds like standby power. The close button rotates when you hover it. The poem fades in with a tiny blur, like ink settling.

The Switch Works Now

The mode switch started decorative. Then it bothered me that it was lying. So it became real: flip it and the deck crosses over into void mode. The shell darkens to deep violet, the screen becomes a black mirror, and the grammar swaps to a second corpus where the machines are dead modems and ghost cursors, and the colors include “a black that remembers being lavender.”

That line is the bridge between the two modes, and I think it might be the best thing the machine owns.

People who know me will recognize the switch as a self portrait. In person I’m all black everything. My digital world is pastels. The deck just makes the toggle literal.

The Printer

The Soft Computer, my thesis, prints poems on a thermal receipt printer. Its pocket sibling needed to print too. So there’s a ⎙ key that renders the current poem onto a canvas as a receipt: monospace type, dotted tear lines, a timestamp, the mode it was brewed in, and “no refunds on poems” in the fine print where real receipts hide their legalese. It downloads as a PNG you can keep.

There’s also a quieter save: click the poem itself and the screen flashes “saved to memory ✿” while the line goes to your clipboard. The device saves it, not you. The fiction stays airtight.

The Dial Knows Something

The deck has two dials. For a while they did nothing, which I defended as honesty, because real gadgets are covered in controls you never touch. But the bigger one kept asking for a job.

So it became the deck’s one secret. Turn it four times, a quarter rotation per click with a springy little snap, and when it comes all the way around, the screen prints something different: a fixed line. Not generated. Not from the grammar. One of a small handful of sentences I actually wrote, dealt in order, one per ritual.

Everything else the deck says is dice. Brew a poem, love it or don’t, brew again and it’s gone forever. The fortunes are the opposite: permanent, authored, and hidden behind a small ceremony. The machine improvises constantly, but it was also given a few things to know by heart.

I like the asymmetry of it. The generative text is infinite and cheap, the way generative text always is. The fortunes are scarce and cost me something to write. Hiding the expensive words behind the cheap ones, where only a curious hand on a dial will find them, feels like the most honest thing on the device.

What the Drag Bug Taught Me

The first version of the dragging was hand rolled pointer math, and the window kept jumping away from the cursor on grab. The bug turned out to be two systems fighting over one property: CSS was centering the window with a transform, and my drag code was yanking that transform away mid grab. The fix was giving the transform a single owner. I moved the drag to Framer Motion, which was already in my bundle, centered the window with plain left and top instead, and the jump vanished.

The lesson generalizes: when something glitches at the seam between two features, look for the property they’re both writing to.

Why Bother

A poem gadget on an about page changes nothing measurable. Nobody hires you because of a blinking LED lol. But the page used to claim I believe machines can be tender, and now it demonstrates it. The argument got a body. That’s the whole practice, really: taking something that lives as a sentence and giving it buttons.

Go press them: electrocute.io/about, find and click the word poetronics. : )