Marginalia
A collaborative writing surface where the AI co-editor docks beside the draft — rewrite, grammar, and brief stay in the margin so the article never disappears under a modal.
Click to expand

What am I looking at?
name mark built from css grid.
nested divs per glyph.
no font files. no svg. no canvas.
Design engineer building intelligent, high-detail web interfaces from ambiguous product direction.
I combine frontend systems depth, interaction judgement, visual sensitivity, and practical AI/web experience. I care about making adaptive websites feel clear, responsive, and alive.
Production & client work
Production interfaces, client delivery, and tools where rendering choices, interaction continuity, and performance trade-offs mattered.
A collaborative writing surface where the AI co-editor docks beside the draft — rewrite, grammar, and brief stay in the margin so the article never disappears under a modal.
Click to expand

A browser image editor for retro, high-saturation dithering — bright P3 dots on black, per-channel white-noise dithering, and a worker pipeline that keeps sliders responsive.
Click to expand
Production marketing and product web for GAIB and ARC League — brand-heavy motion, tab systems, and performance-conscious front ends.
Click to expand
Inbound-aircraft delay tracing with FlightAware — Suspense boundaries, server actions, and leg switching without full reloads.
Click to expand
Experiments
Smaller component studies and interaction experiments — separate from production work above.
Interactive London Underground station name puzzle solver using binary bitmask algorithms for efficient letter matching. Features quiz questions, word finding, and data visualization.
SVG filter can be used to make the edge of text feel burned. Features customizable filter effects, responsive design, and optimized rendering for creating dramatic visual text effects.
Text content that self adjust to available width, no javascript, pure css! Features responsive typography, automatic scaling, and optimized text rendering for different screen sizes.
An interactive slider with snap-to points, visual markers, direct numeric input, touch and mouse drag support, out-of-bounds indication, and double-click reset.