Nocturne
A one-page concept site for a made-up design studio, built as a pure front-end craft piece. About 15 kB gzipped, and every effect in it is written by hand.
Concept build. Nobody commissioned this. I built it to show what the work looks like for this kind of business, and everything in it — the name, the prices, the photographs — is made up for that purpose.
The exercise
Take the kind of motion-heavy studio site that normally arrives with a scroll library, an animation library and three hundred kilobytes of runtime. Build it without any of them.
What is in it
A preloader. A trailing cursor. Masked line reveals. Sticky stacking cards. A manifesto that lights up as you scroll through it. A count-up timeline.
Light and dark themes that stick, and start out matching whatever the device asked for.
Why it matters
Nothing loaded at runtime, and roughly 15 kB gzipped.
Writing the effects by hand is the whole point. It is the difference between knowing which library does the thing and knowing what the thing is.