gilded-que is a reusable core CRUD (create, read, update, delete) foundation intended to be the starting point for multiple projects. The product intent is a working, honest data-management base — a scaffold a developer can clone or adopt so that each new project begins from a functioning record lifecycle rather than from an empty repository.
The audience is the Project Starter (Developer): a technical user who values density, tabular numerals, keyboard-first flows, and surfaces whose behavior is legible from the source. The product is not a marketing SaaS dashboard; it is a tool meant to be read, reused, and extended.
The current delivery is a first-party web application with application-owned identity, a public landing entry, self-service enrollment and returning verification, and a protected record lifecycle (browse, create, update, delete) over durable, per-user records.
gilded-que currently delivers one cohesive capability: a durable, per-user core CRUD over records, wrapped in the minimum identity continuity needed for a developer to return to their own data across sessions.
Actors
Accepted behavior
Ownership
All current human-facing behavior is owned by first-party custom pages. Identity is application-owned. No provider-owned or external destinations are part of the current scope.
Narrow exclusions
gilded-que is delivered as a first-party web application. The public Landing page is anonymously reachable and explains what the CRUD foundation is and what it contains. Because the product produces durable, per-user records that a developer must be able to resume across sessions, the application owns identity: a first-time visitor establishes identity through Sign Up, and a returning visitor verifies identity through Login. Both entry surfaces are anonymously reachable; the protected record surfaces are not.
The protected working area consists of three cohesive destinations: Records (the independently revisitable browse owner), New Record (the focused create owner), and Record Details (the focused update/delete owner). These are separated because their working contexts, authoritative state, and completion outcomes differ: browsing a list, committing a new record, and mutating an existing record each have distinct entry points, distinct success states, and distinct failure/recovery paths.
Everything else — persistence, identity verification, record mutation — is backend execution supporting these human-facing surfaces. Nothing in the current scope is provider-owned, external, or headless.
Future ideas are explicitly out of current scope and are recorded in Section 11 rather than implemented here.
0 records numeral and a tangerine text link to New Record.0 records numeral and a tangerine text link to New Record; 1.2s tangerine caret blink in the prompt.FR-1 — Public entry to the CRUD foundation (explicit) As a Project Starter (Developer), I should be able to reach an anonymous public entry that explains the reusable core CRUD foundation for starting multiple projects, so that I can understand what the base provides before establishing identity.
FR-2 — Self-service first-use enrollment (required_inference) As a Project Starter (Developer), I should be able to establish my own identity through self-service enrollment, so that the records I create are durably and privately bound to me.
FR-3 — Returning verification (required_inference) As a Project Starter (Developer), I should be able to verify my existing identity, so that I can resume work on my durable records in a later session.
FR-4 — Read: browse existing records (explicit) As a Project Starter (Developer), I should be able to view the list of existing records, so that I can see what data the foundation already holds.
FR-5 — Create: add a new record (explicit) As a Project Starter (Developer), I should be able to add a new record, so that the foundation holds data I can then read, update, and delete.
FR-6 — Update: modify an existing record (explicit) As a Project Starter (Developer), I should be able to update an existing record, so that the foundation's data stays correct as a project evolves.
FR-7 — Delete: remove an existing record (explicit) As a Project Starter (Developer), I should be able to delete an existing record, so that the foundation does not accumulate data a project no longer needs.
FR-8 — Durable, identity-bound record ownership (required_inference) As a Project Starter (Developer), I should have my records persist durably and remain bound to my identity, so that the foundation is a reliable starting point across sessions and across the multiple projects I begin from it.
Product context. The Project Starter is a developer who begins multiple projects and wants each one to start from a working data-management foundation rather than an empty repository. They adopt gilded-que as a reusable core CRUD base: a record lifecycle that already creates, reads, updates, and deletes durable data, so that the first hours of a new project go into the project's actual problem instead of into scaffolding a CRUD layer.
Primary goal. To have a core CRUD foundation that is genuinely reusable as the starting point for several projects — one whose behavior is legible enough to read, trust, and extend.
Distinct accepted responsibilities. The Project Starter is the sole active human actor and performs the complete record lifecycle: they establish their own identity on first use, verify it on return, browse the record list, create new records, update existing records, and delete records they no longer need. They also decide when the foundation is complete enough to serve as the base for a new project.
Relevant inputs and decisions. They supply identity information at enrollment and verification, and field values when creating or updating a record. Their decisions are: whether to enroll or verify, which record to open, what values a record should hold, and whether a record should be removed.
Interactions with other accepted participants. The Project Starter interacts only with the application itself. There is no second human participant, no collaborator, and no external counterparty in the current scope. The backend and identity service act on the Project Starter's behalf but are not participants with their own goals.
Observable success. The Project Starter can return in a later session, verify identity, and find their records exactly as they left them; they can complete a full create → read → update → delete cycle without leaving the protected area; and the base is coherent enough that they would begin another project from it.
Constraints carried from source. The audience is technical and values density, tabular numerals, keyboard-first flows, and honest surfaces. The product is explicitly not a marketing SaaS dashboard.
0 records numeral and a tangerine text link to New Record; a 1.2s tangerine caret blinks in the prompt. The Project Starter follows the link to Flow 4.Muse and headline. Rasmus Andersson — Systematic product craft with an opinion: a warm paper ground, ink type, and one hot tangerine signal for the CRUD foundation.
The product is literally a foundation for other projects, so its own visual language is a foundation too: a visible scale, a warm off-white paper ground instead of bootstrap white, ink text, and one hot non-blue accent used as a signal color for state, focus, and primary actions. The register is not "marketing SaaS" but "a tool I will actually read the source of" — precise, opinionated, warm in material, cold in logic.
Palette (light mode)
| Role | Hex | Usage |
|---|---|---|
| Background | #F6F3EE | Warm paper ground carrying the page |
| Surface | #FFFFFF | Cards and inputs |
| Text | #141517 | Ink type |
| Primary | #141517 | Primary button fill |
| Accent | #E8562A | Focus rings, primary CTA, active nav underline, destructive hover, record-count numeral |
| Muted | #8A857D | Labels, captions, metadata |
| Border | #E4DFD6 | Hairline 1px borders on every surface |
| Row hover | #F1EDE6 | Row hover background shift |
Proportion: ~70% paper, ~22% white surface, ~6% ink fill, ~2% tangerine. No blues, no indigos, no gradients.
Typography
clamp(36px, 8vw, 66px) for the landing headline; page titles clamp(26px, 4vw, 37px); section headings 21px; body 16px with 1.55 line-height for long-form and 1.35 for dense table rows; table and label text 13px; monospace numerals at 13px with tabular-nums.Shape language
#E4DFD6) on every surface.0 1px 0 rgba(20,21,23,0.04) on sticky headers.Layout
0 records numeral and a tangerine text link — no illustration.Imagery
No photography, no illustration, no 3D. The interface is the imagery: schematic diagrams of the data model (a simple box-and-line diagram of Record → Field → Value rendered in ink hairlines with tangerine connectors), a code sample panel showing the create/read/update/delete calls in a dark ink block with the tangerine accent on the active line, and monospace numerals used as ornament throughout. The landing page uses one dark ink code panel as its only non-UI visual element.
The landing first screen is a split editorial composition, not a centered SaaS hero.
clamp(36px, 8vw, 66px) reading "A core CRUD foundation you can actually read." stacked over three lines, with a 15px Inter Tight subline beneath it and a single tangerine-filled primary button ("Open the records") pinned directly under the subline, left-aligned.#141517) code panel bleeding to the right viewport edge, showing a monospace CRUD snippet with the active line highlighted in tangerine (#E8562A), and a small tangerine tabular numeral 04 in its top-right corner.Nothing is centered; nothing floats; the ground is warm paper, not white. The composition recomposes only accepted content — the product purpose, the CRUD capability summary, the data-model schematic, and the two identity entry points — and introduces no new behavior, page, or destination.
Interaction Model: Static Motion Tempo: restrained Hero Dimensionality: flat
Landing Hero Motion Brief
04 in its top-right corner.04 numeral settles into place — the foundation presenting itself as readable, working code. No scroll-linked effect, no parallax, no looping motion beyond the empty-state caret.cubic-bezier(0.2, 0, 0, 1). Focus rings animate in 80ms. Row hover shifts background to #F1EDE6 in 120ms. Page transitions are a 160ms opacity fade with no movement. The only looping motion is a 1.2s tangerine caret blink in the empty-state prompt and a 200ms count-up on the records total when the list resolves. No bounce, no particles, no parallax, no scroll-linked effects.04 in the corner; below the fold, the ruled strip of four monospace stats.NFR-1 — Durable persistence (required_inference) Records must persist durably and remain bound to the identity that created them, so that the foundation is a reliable starting point across sessions and across the multiple projects begun from it. Rationale: the accepted product intent is a reusable base for multiple projects; a base that loses data between sessions cannot serve that intent.
NFR-2 — Identity continuity without differentiated permissions (required_inference) Identity establishes ownership continuity only. No role-based visibility, permission tiers, or differentiated control over shared state is introduced. Rationale: the source establishes a single active human persona who owns their own records; no shared-state control requirement exists.
NFR-3 — Responsive integrity (explicit, from creative direction)
Readable text and controls stay whole at every viewport: headlines, wordmarks, labels, numbers, card text, and controls stay entirely inside the viewport and their container at 375px, 768px, and 1280px, wrapping or scaling (for example font-size: clamp(...) with its mobile size) to fit, and no other element covers any part of them. Imagery, decoration, and motion may be cropped, bled off an edge, or overlapped exactly as the creative direction asks, as long as they cover no readable text or control.
NFR-4 — Reduced motion (explicit, from creative direction)
With prefers-reduced-motion, provide a usable static arrangement: transitions resolve instantly, the empty-state caret is static, and the records count renders at its final value. Every item remains fully readable.
NFR-5 — Motion budget (explicit, from creative direction)
UI-layer transitions stay within 120–200ms with cubic-bezier(0.2, 0, 0, 1). No bounce, spring, particle, parallax, or scroll-linked motion. The only looping motion is the 1.2s tangerine caret blink in the empty-state prompt.
NFR-6 — Accessible contrast and focus (required_inference)
Ink (#141517) on paper (#F6F3EE) and on white (#FFFFFF) meets accessible contrast for body and heading text; muted (#8A857D) is reserved for labels, captions, and metadata. Focus rings use the tangerine accent (#E8562A) and animate in 80ms. Rationale: the direction specifies a focus-ring treatment and a muted role; making them usable requires contrast and visible focus.
NFR-7 — Keyboard-first operation (explicit, from creative direction) The left rail carries a keyboard-shortcut cheat sheet as first-class content, and inline row actions are revealed on hover or focus, so the record lifecycle is operable without a pointer.
No source-specified technology choices conflict with these; the stack is the minimal set needed to deliver the accepted behavior.
Assumptions
Constraints
Future (explicitly out of current scope)
tabular-nums used as ornament on record ids, counts, and stat blocks.No completed page designs yet.
Completed design pages will appear here when they are ready to preview.
No completed page designs yet.
Completed design pages will appear here when they are ready to preview.
No comments yet. Be the first!