# Design Principles

The site should feel quiet, intentional, and structurally legible. Do less; make the few choices visible.

## Purpose

The design exists to support careful reading, make structure legible, and let arguments accumulate over time. The site is a public body of thinking, not a product. The visual language should make that clear without saying so.

The site should feel more like a well-kept archive than a product-marketing page.

## Posture

Decoration should be inseparable from function or absent. The right number of features is the smallest one that works. Add only what fails to work without.

Restraint should not remove character. The site should feel composed and alive, not generic or emotionally flattened.

## Visual direction

- Preserve the restrained editorial structure: narrow templates, generous spacing, simple lists, direct navigation.
- Typography is the primary design material, and layout should support reading rhythm before visual novelty.
- Inter for interface text. EB Garamond for editorial title moments.
- Keep colour minimal: paper, ink, muted text, fine rules.
- Treat dark mode as a first-class reading mode, not a separate design language.
- Prefer visible structure over decorative flourish.

## Image direction

Use images when they reveal the actual thing:

- Product surfaces, maps, diagrams, documents, prototypes, screenshots with confidential data removed.
- Archival images when writing about history.
- Real landscapes, ocean, walking, maps, or tools when they carry the mood of the piece.

Avoid stock-like atmosphere, ornamental gradients, blurred hero images, and decorative abstract shapes.

## Interface patterns

- Navigation should orient without shouting.
- Footer actions read as plain links unless a control truly needs more affordance.
- Raw routes and `llms.txt` are part of the publishing system, not implementation leftovers.
- Lists stay scannable: title first, metadata second.
- Article pages prioritise title, metadata, optional image, then prose.
- Work pages explain systems shaped, artefacts created, and what changed. They are not screenshot walls.
- Docs pages stay plain, readable, and useful to both people and reading systems.

## Agent readability as a design concern

The same restraint that helps human readers helps agents. Plain markup, semantic structure, and stable layouts allow search engines, archives, and reading systems to use the site without special handling. This is a design decision, not only a technical one.

Design changes should preserve plain-text legibility. If a change degrades how the site reads when stripped of styling, the change is wrong even if it looks right.

## Avoid

- Marketing-page composition, hero theatrics, cards for ordinary content, ornamental gradients.
- New colour families without a strong reason.
- Dense controls, badges, pills, app-like chrome in editorial areas.
- New component patterns when existing CSS classes can carry the change.
- Layout changes that make raw routes, Markdown content, or generated pages harder to reason about.
- Portfolio templates that make the work feel generic.
- Adding a feature to solve what is actually a content problem.

## Implementation

- Keep CSS close to existing selectors and tokens in `app/globals.css`.
- Semantic HTML first, then style.
- Preserve accessible names and current-page semantics.
- Check mobile wrapping when changing navigation, footer links, headings, metadata rows, or list rows.

## Aesthetic test

Before accepting a design change, ask:

- Does this preserve a sense that a person made careful decisions here?
- Does this make the system clearer?
- Does it make the writing easier to read?
- Does it create a stronger sense of craft without demanding attention?
- Would it still feel good in five years?
- Will it still work when the archive is twice the size it is now?
- Does it feel particular to this site, or like a template?