Cadence

Cadence

Cadence

Digital Product

Motion

Cadence grain studio interface

Context

Cadence is Yash's own product, not client work: one platform, three (later five) small creative tools under the line "small instruments for designers." It started as a rebuild of an existing gradient-loader tool and grew, in the same session, into a shared platform combining a loader generator, an image-dithering studio, and a motion-showcase studio.

Problem

A single-file v1 shipped fast but read as an amateur pass: gradients were blurry by default, labels sat unreadably on top of gradient swatches, the theme switch was a text button that said "Theme," spacing and hierarchy were inconsistent, and the creative filters felt thin next to the reference tools being copied.

Approach

Studied each reference product (gradient-spin, Ditther, Animos, pryzm.design) before building, so the clone matched real behavior instead of guessing from the name. Shipped v1 as a single self-contained HTML artifact with a shared OKLCH color engine and a small module-registration contract so all studios plug into one shell. After direct design criticism, rebuilt the whole thing as a Next.js/TypeScript app on shadcn/ui with the specific corrections promoted into a standing design-rules file: crisp no-glow defaults, labels off the swatches, an icon-based theme toggle, sans body type with mono reserved for values, glass surfaces, and deeper per-studio feature sets. Two new studios (a WebGL background editor and a logo-from-circles tool) were added the same day, and a real performance bug in the dithering renderer was diagnosed and fixed under load.

Outcome

Two working builds exist: a v1 three-studio artifact (still live and fetchable) and a v2 five-studio Next.js app in a local repo, ported the same day after the design corrections were applied. A concrete performance fix in the grain studio's LED renderer, measured in our own build session, cut paint time from 1302ms to 242ms by batching canvas draws instead of per-cell blur. Some later visual polish (a grain-editor redesign, dark-mode-first pass) was noted as done-but-not-yet-visually-verified in the working session notes, and the production Vercel deployment is currently behind Vercel's own authentication wall rather than open to the public.

Next project