Lab
Experiments
Isolated sketches for refining interaction ideas before they ship.
Life clock
- v2Perspective Clock — ten UI directionsStatic studies for the rename and UI rework: the same frozen LIFE view rendered as ten different user experiences — annotated plate, almanac, transit line, mission console, orbital disc, line-printer report, metro map, calc worksheet, contact sheet, and typographic poster.→
- v1Life ClockA zoomable time instrument — one pixel per five seconds of the day, zooming out through week and year to a whole life measured against an estimated span. Spent time goes grey; what's left is in orange.→
Depth clock
- v4Depth dither clockA depth-map particle clock where each sample becomes animated ordered dither cells with preserved z-depth.→
- v3Depth clock uploadUpload an image, generate a Depth Anything V2 map through Comfy Cloud, and rebuild the point-cloud clock from the result.→
- v2Depth point-cloud clock particlesA cinematic depth-map particle clock with separate clock particles, fog bands, chromatic depth, and digit-triggered spatial ripples.→
- v1Depth point-cloud clockA depth-map particle field with foreground points pulled forward and a glass clock overlay.→
Gradient animation
- clock-1Clock 1A clean landscape glass clock composition without the title, controls, or frame counter.→
- v3Chromatic clockA recessed sage shader field with a large seven-segment glass clock over the lower-right corner.→
- v2Chromatic field v2A nested-ripple version with fewer origins and layered chromatic waves inside each other.→
- v1Chromatic fieldA customisable Three.js shader sketch with noisy layered gradients and irregular ripple fields.→
Pick a colour game
Radial color picker
- v9Life-size thumb cursor for desktop demoReplaces the mouse cursor with a PNG of a real thumb so it's easier to evaluate how much of the picker is obstructed by a finger.→
- v8Improved touch-interaction visibilitySwatches drift outward as the thumb approaches; ribbon thickens and lifts while it's under the thumb — so the layer you're aiming at never hides under your finger.→
- v7Third layer: tone plane (L × C)Thick arc beyond the ribbon. Hue locks on entry; tangential picks chroma, radial picks lightness.→
- v6Full 360° hue ribbonRibbon exposes the entire hue wheel including magenta/pink, decoupled from the swatch palette.→
- v5Eased swatch entry + ribbon outline previewSwatches scale and fade in on an ease-out. Hovering a swatch shows a white outline of the ribbon shape.→
- v4OKLCH ribbon + live FAB preview + tuning panelSmoother gradient in OKLCH. Thumb previews the hovered colour. Sliders for every parameter.→
- v3Muted ribbon + blur-in backdropRibbon tonality matched to swatch palette. Backdrop tints and blurs in on a soft ease.→
- v2Hue ribbonSecond layer is a continuous spectrum ribbon. Tighter spacing, soft vignette.→
- v1Discrete fine-hue dotsSix swatches fan out; pushing further reveals nine discrete hue variations.→