The design direction, and the all-black rebuild that comes next (09/08)

The site went up on 5 September wearing the skin of an off-the-shelf template. The words are BR3AK's. The layout, the palette and the rhythm are the template's. The work of the last few days was to fix the design direction, then measure how far the site sits from it.

Anchor first, then argue

Design discussions stall on "do you like it". So the first step was not colour and not type. It was naming three reference brands, so that every later decision has something to be checked against:

Reference	What it contributes	Which layer
JULIUS	Dark, industrial, architectural cutting	Base: palette and structural grid
Issey Miyake	A piece of cloth, infinite possibilities	Middle: product logic — the origin of RE-FORM
Gentle Monster	Futurism and experimental art	Surface: how it is presented and experienced

Each reference governs a different layer, which is why they stack instead of fight: an industrial dark base, a material-first core, an experimental shell.

The Miyake axis matters more than it looks. RE-FORM is not "add mechanisms". Its ancestor is the idea that one piece of material can exist in more than one way. That definition governs the product and also what the photography has to capture.

Three mismatches, measured

With the anchor set, everything on the site got measured.

One: three incompatible image languages. Average saturation of all 32 assets in public/images/ (0 = pure greyscale, 255 = fully saturated):

Language	Saturation	Examples
Greyscale cut-out product photography	2–5	the whole *-cutout series
Pure black and white	0	about-hero-bw
Neon / 3D renders	92–144	core-01 (92), core-03 (138), void-detail (144)

On one page, hovering three rows produces three different worlds. This is the most damaging item on the list.

Two: the ground and the signal colour both came with the template. --paper #f3efe5 is a warm cream — editorial vocabulary. --red #f33a2f is a print red. None of the three references speaks either language: JULIUS is almost entirely achromatic, and Gentle Monster works with light rather than printed colour.

Three: the template's decorative colours are still in the stylesheet. Acid yellow appears 10 times, blue 8 times, mostly as ornamental dots that have nothing to do with BR3AK.

What this version already changed

• The About page was rebuilt: a twelve-column asymmetric grid, a sticky numbered label in the left column, hairline rules between sections. The copy stays in MDX; the layout splits it on the --- rules, and both languages share one layout.
• A full-bleed black and white key visual, 2880×1234, edge to edge.
• The footer went black, with navigation pushed right.
• The name was settled: the logotype stays lowercase br3ak as a drawn mark; in text it is always BR3AK. The 3 sits mid-word, so title case reads as a typo.
• Mobile navigation was repaired. Below 850px the template hides the middle navigation and ships no hamburger — leaving the footer as the only way into any page.

Next: all black, and a new layout

The direction is decided: drop the current, too-neutral look; the whole site goes to a black ground and the layout gets redesigned.

The order is deliberate:

1. Invert the ground. Dark becomes the default; light is reserved for material and structure close-ups — the museum white box. Largest visual return.
2. Settle the signal colour. Whether the red stays is still open.
3. Converge the imagery. Neon renders and illustration step back. Two categories that do not exist yet get shot: the volume and folds of cloth (Miyake axis), and seams, closures and load paths (JULIUS axis).
4. Build the installation layer. The Gentle Monster axis is currently empty. Scrolling and a hover card are not an experience — there is no oversized object, no light, no full-screen material.

Inner pages first, home page last. About and Journal use layouts written for this site, so turning them dark is a handful of rules. The home page is still the template's alternation of cream and black, and that should not be dyed dark by patch — it should be redesigned. Forcing a dark coat onto a template yields a dark template, not BR3AK.

Still undecided

The signal colour. Removing red for a single cold light lands closest to JULIUS × Gentle Monster; keeping the red but demoting it to hover preserves the recognition the site already has. That decision touches every section, so it stays blank rather than half-made.

The specification now lives in docs/DESIGN.md, in the same repository as the code, and anyone — or any agent — has to read it before touching the visuals. Definition, the rules derived from the three axes, the allowed and disallowed image languages, and the mismatches listed above are all in there, including the parts that are still open.

Where something is undecided, it says undecided rather than carrying an estimate dressed as a spec. That is part of building in public too.