Skip to content

Tagged

Design

13 posts on design.

The loading experience is the product

A scrub film on my products page is 8,310,726 bytes. Its poster frame is 42,046 bytes, and the poster is the only one of the two most visitors ever see. What the research on skeletons and spinners actually says, what the Core Web Vitals actually measure, and the layout shift my own reveal animation was covering for.

Grace Tarnasky's site, from launch-ready to public

Her palette arrived as a document she had written herself, the headline on the home page is her own sentence, and the fork carried three themes before the quiet one won. Here is what the site is made of, and what ten gated days bought before anybody outside her family could see it.

The tool bench a one-person studio builds for itself

A private bench of ten apps, no accounts, no servers, nobody to support. Here is what is on it, how the slide proofer works out where a platform will crop before the file leaves my hands, and what happened when I ran a slide I had already posted through my own guides.

Wireframes that survive contact with the build

Most wireframes get approved and then quietly lose the argument to the browser, because they encoded no constraint the build could not ignore. Here is what mine have to carry: the empty state, the error state, the too-long state, the width the layout really changes at, and a short list of things I refuse to decide.

Color for screens that aren't yours

I ran my own studio palette through the WCAG 2.2 contrast formula as a set instead of one pair at a time, and found two shipping failures, including the link color in every post on this site. The math, the fix in OkLCh that shipped the same morning, the one ground still short, and the tests that catch it next time.

Designing without slop: the rules I gave my AI

Every AI design tool lands in the same place: purple gradients, Inter set large, a centered hero over three feature cards. My answer was not to complain about it but to write a law an agent can be held to. Here is that law, with the real values behind it.

One button, no reading, no login: designing panic.btn

There is no account to make, no menu to open and no paragraph to read. Press the one shape on the screen and it becomes a breathing pacer, vibrating on each phase change so the pace can be followed with your eyes shut. This is what that press does, where a counselor's vocabulary shows up in the interface, and where the app stops.

iLovable: a box of therapy tools that stays on the phone

A parts map, a CBT chain, a mood check-in and a day count, in an app that downloads at 13.5 MB and sends nothing to me. The exercises came off paper I handed people in a counseling room for ten years. Most of the design work was deciding what the screen would refuse to do.

The scroll-scrub stack: what actually makes it smooth

A scrubbed film either reads as liquid or as a slideshow being dragged, and I finally measured where the difference lives. It is the encode. One clip, three encodes, sixty seeks each: a median of 3 ms against 15 ms against 32 ms, with the whole frame budget sitting at 16.7. Here is the loop, the encode, the dead zones, and the one line that makes iPhones cooperate.

Mobile-first, one thumb

Mobile first design, as I actually build it: finger-sized targets, Pointer Events instead of mouse events, and nothing important hidden behind a hover. Then the morning my own audit failed a component that was the right size all along, because the test drove a narrow desktop window and called it a phone.

A social composer that exports in the browser

The Ulric Composer designs Instagram posts and reels and renders the finished file in the page: a real PNG off a 2D canvas, a reel recorded frame by frame, no server round trip. How the export works, what WebKit refuses to paint, and the one number the browser and ffmpeg both have to agree on.

Three small iOS apps, and what each of them taught me

Three small iOS apps, one of them 340 times the size of the smallest, and all three declare the same thing on the store: data not collected. The spread between those numbers is the price of keeping a promise on the device, and it is the most useful thing I took out of building them.

Scroll-scrubbed video, the cheapest premium feel on the web

I taught the studio toolchain the Apple-style scroll-scrub technique, then built eight live demos from five-second phone clips to prove it. What makes a scrubbed page feel premium, the plumbing nobody mentions, and where the technique actually earns its keep.

← All insights