Writing
Notes on interface craft, motion, and the details that make software feel right.
Change blindness in interfaces
Cover the moment a change happens and people stop seeing it, sometimes for thirty seconds, on a panel they are staring directly at.
Fitts and Hick, measured on you
Both laws get quoted in design writing as vibes. Both are fitted equations with coefficients, and you can measure your own in about two minutes.
The near plane, not the far one
Z-fighting gets blamed on the far plane every time. Depth precision is distributed hyperbolically, so moving near from 0.1 to 1 buys more than cutting far by a factor of ten.
The latency cliff
Your API is fine at 70% utilization and unusable at 90%, and nothing in between changed. Waiting time scales with the reciprocal of the free capacity.
Two doctors both went off call
Each transaction read a valid state and made a legal decision. The combination broke a rule neither of them could see.
Paging over a moving list
LIMIT and OFFSET are correct only if nothing writes to the table while someone is reading it, which is a condition your app does not meet.
What counts as one character
JavaScript will tell you a three-person family emoji is eight characters long, and your 280-character limit believes it.
Hit testing without a DOM
The interface on this site is a picture painted on a curved mesh. Working out what you clicked takes six coordinate transforms and a formula that has to exist twice.
What scroll actually does
Building a UI with no DOM meant writing scroll from scratch. What looks like one behavior is six separate systems, all of which you inherited for free.
How many dropped frames you can see
60fps is a budget, not a quality bar. This post runs an adaptive staircase on you and reports your own detection threshold in milliseconds.
The input data your browser threw away
Pointer events arrive once per frame. Your trackpad samples several times faster than that, and the extra samples are still attached if you ask for them.
The phase before a character exists
For Japanese, Chinese, and Korean input, a keystroke isn't a character yet. Everything you wired to onChange is reacting to a draft.
Mirroring your UI is not RTL support
Setting dir="rtl" flips the layout. It says nothing about what the Unicode Bidirectional Algorithm is going to do to your phone numbers.
Why your shadows look fake
Most CSS shadows are dark blurry rectangles. Real shadows have layers, direction, and falloff.
Your animation is layout thrashing and you don't know it
Not all CSS properties are equal. Some animations run on the GPU at 60fps with zero layout cost. Others force the browser to recalculate the entire page every single frame.
Your pixel-perfect UI is lying to you
Why mathematically centered elements look off-center to the human eye, and the sub-pixel corrections that separate polished interfaces from amateur ones.
Easing curves are a design language
You wouldn't pick a typeface at random. So why are you using ease-in-out for every animation?
Wordle 45-Minutes Challenge
Building the full Wordle game in React under time pressure, and what happens when you stop overthinking architecture.
Dynamic viewports with iframes
How to make an iframe behave like a real browser preview, not a cropped screenshot.