Skip to content

Mockups

Non-functional UI prototypes used to validate the interface specs and surface gaps before implementation. Not part of the build.

  • studio/index.html — the krites studio web UI. Open in a browser. Mock data, no backend. Desktop-first, plum / champagne-gold brand. Two levels:

  • a shoot Library (open / rename / remove, with per-shoot verdict tally and an "not yet culled" state), and

  • the Cull review — the heart: a grid of frames with verdict badges, star ratings and burst markers; a loupe with keep/maybe/reject + 1–5 rating and a "why rejected" reasons panel; filters by verdict and reason; a burst-compare overlay (pick the keeper); a cull-profile settings panel (threshold sliders, "save & re-resolve"); a cull-progress toast (the SSE run, cancellable); and a finish bar for Export keepers and Write XMP.

It is clickable: select frames, set verdicts/ratings by keyboard (P/X/U/1–5/arrows, ? for help), filter, run a mock cull, and open the compare/settings overlays. Develop and object-removal (Phase ⅔) are noted where they will live.

  • prodark/index.html — the "Pro Dark" Stage-2 redesign wireframe (the successor to the first-pass wireframe, and the design source for the redesign). Open in a browser. Aubergine chrome wrapping a cream cull canvas, muted-gold accent, verdict semantics kept separate from the accent. High-fidelity and operable: the justified-rows grid (the shipped default), keyboard culling (P/X/U/1–5/Enter), a per-frame inspector with AI cull scores, and a full-aubergine loupe (adjustments rail, colour-coded filmstrip, focus peaking O, face box). Frames are CSS gradient stand-ins (no backend). Reference renders: grid.png, loupe.png. Committed to main — the design source of truth for the redesign slices.

Built to find interface gaps before implementation: every studio feature the interface contract calls for should be visible and reachable here. The contracts themselves live in the project wiki.