What I directed, what the machine built

This week I rebuilt the hero of my About page and the headline of my home page with Claude and the Elementor MCP. The code took minutes. The decisions took many rounds, and the decisions are the work.

The tool is fast. Direction is the job.

When nearly everyone has the same tools, speed becomes common. What a client pays for is a person who knows what to ask for and what to send back.

How the effect found its shape

The first version arrived with a glitch effect that cut the letters into horizontal slices. On its own it looked exciting. In context, on the page, it looked messy and pulled attention away from the words, so I removed it. I centered the title, swapped “and” for “&”, and brought the type down 18% so the words could breathe.

The next version had a glass bubble that followed the cursor and magnified the letters. The prism colors inside it were beautiful. The bubble itself felt like an object sitting on top of the title, so I kept the prism and let the bubble go. Then came the feel. The reaction trailed behind my hand, and I asked for it to move as I move. It was also too loud, so I turned it down by 30%, and later by another 30% on the home page, where the headline sits over video.

The phone needed its own answers. The title became four lines of whole words with 32 pixels of margin on each side. A tap sends a ripple through the letters. Then we added the detail I enjoy most: tilt or move your phone and the title leans with it, with a soft edge of red, green and blue.

The last touch was a thin line under “Scroll Down” that starts slow and ends fast.

Each of these took one sentence to ask for. Knowing which sentence to write took twenty years.

Then I added sound

My tagline promises sound, so the page had to make one. Every tap or click on the About title plays a low boom with three echoes that fade out.

The idea came from drum pads. I asked the machine to divide the screen into nine cells, three columns by three rows, and to give each cell its own pitch. The lowest sits at 95 Hz in the top left and the pitches climb toward the bottom right.

All of it is generated live in the browser, with zero audio files to load. Each boom is a sine wave that drops in pitch while its volume fades, the same way a synthesizer builds a kick drum.

Then it became an instrument

When the page loads, a soft pass of light crosses the screen. It reveals nine outlines for a second and leaves. That is the hint: there is something here to play.

Switch on Show pads and the nine pads stay. The page locks to full screen, and the menu and the title step aside. On a desktop the pads take the left half of the screen and the controls sit on the right. On a phone everything stacks into one screen.

Edit pads turns each pad into a channel. Choose from ten sounds: the boom, kick, snare, hi-hat, open hat, clap, rim, tom, cowbell and shaker. Set its volume. Move its pitch up or down an octave. On a phone, one strip edits the pad you tap.

Loop opens a step sequencer modeled on Ableton Push. Tap a pad and its 32 steps appear: two bars of sixteenth notes. Tap a step to place a hit. Accent makes a hit louder. Mute silences a hit and keeps it in place.

You can also play it live. Press the red circle, and every hit snaps to the nearest sixteenth note, so loose hands still make a tight loop. Set the tempo anywhere from 60 to 180 BPM.

Fixing a part is simple. Undo removes the last hit. Clear pad wipes the selected pad. Clear all starts over.

Share puts the whole beat inside a link: every sound, volume, pitch, hit and the tempo. Whoever opens it taps Play and hears exactly what you made. Export saves the loop as an audio file.

Every one of these began as a sentence from me, and most came from playing it on my phone and noticing what felt wrong.

Taste is the premium

AI gave me the first draft of everything: the shader, the layout, the code. Every first draft was competent and generic. The version on my site today exists because I kept saying what felt wrong and why. That is creative direction, and it is the same service I give my clients, with or without a machine in the room.

See it move

Move your cursor across the title on my About page and the headline on my home page. On a phone, tap the text, then tilt the screen. Click or tap the About title to hear it.

The story of that first experiment is in A 404 page that moves like water.