---
type: memory
subtype: forensische-meting
domain: jonathan-looman
project: visuele-richting
datum: 2026-09-17
auteur: claude (forensic pass, playwright-cli op de live sites, viewport 1440x900)
status: METING, voedt richting-v3
bron: board.rss (pin-id → Siteinspire-titel), live sites via playwright computed styles, board/pin-*.jpg voor wat niet meer live is
lezer: Jonathan + de bouwer van richting-v3. Elk getal draagt GEMETEN of GESCHAT; GESCHAT = afgelezen uit de 736px-thumbnail, als percentage van breedte/hoogte (schaalvrij).
---

# De sites achter de pins, gemeten

Methode: pin-hash in `urls.txt` → Siteinspire-titel in `board.rss` → URL via zoeken → `playwright-cli` op 1440x900: computed style van h1/body/nav, @font-face-bronnen, bounding boxes, achtergrondkleur per punt, grid-kolommen, transitions/libs, screenshot op scroll 0, 900, 1800. Twee sites zijn sinds de pin herbouwd (Seachange, Aaron Poe); Wayback-snapshots van beide zijn lege JS-schillen, dus daar alleen thumbnail-schattingen. Reflaunt en Harley zijn geen websitepins (Behance-case, Instagram-carrousel); de bijbehorende live sites zijn wel gemeten.

Pin → site:

| Pin | Site | URL | Status |
|---|---|---|---|
| 05 | Duties | https://www.duties.xyz | live, koptekst gewijzigd sinds pin |
| 06 | Quatrième Étage | https://quatriemeetage.studio | live, herbouwd sep 2026, zelfde structuur als pin |
| 08 | Seachange | https://www.seachange.studio | holding page; pin-ontwerp weg |
| 10 | Ang Studio (BANILA) | https://ang-studio.com | live, identiek aan pin |
| 12 | Rhythm Dialogues | https://rhythmdialogues.ca | live, structuur van pin plus nieuwe kop |
| 16 | Aaron Poe & Co | https://aaronpoeandco.com | herbouwd ("PoeStudio", Readymag, donker); pin-ontwerp weg |
| 17 | NOA (Blok Design) | https://noordinaryaccessories.com | live, identiek aan pin |
| 25 | Jackson Alexander (Jackson Todd) | https://jacksonalexander.com.au | live, identiek aan pin (Q2 → Q4) |
| 23 | Reflaunt (Bravo Creative, Behance 2020) | https://www.behance.net/gallery/104796857/Reflaunt ; live https://www.reflaunt.com | case, geen site; live site gemeten |
| 07 | Harley Meds (Instagram-carrousel) | https://www.harleymeds.com | site live, gemeten |

## 1. Duties (pin-05)

Framer-site, Oslo. Kop luidt nu "BRANDS AND WEBSITES FOR BRAVE COMPANIES" (pin: "BUILDING BOLD BRANDS…"); de klok rechtsonder is live ("17:27, OSLO / OFF-DUTY" bij meting, pin "10:18 / ON-DUTY").

| As | Waarde | Bron |
|---|---|---|
| Kopletter | AS Therma Bold Condensed 700, woff2 via framerusercontent | GEMETEN @font-face |
| Kopgrootte | 160px, letter-spacing -10.8px (-0.068em), line-height 128px (0.80), uppercase, kleur #252525 | GEMETEN |
| Leesletter | PP Neue Montreal SemiBold 600, 18px / 20.7 (1.15); koppen PP Neue Montreal Regular 28px | GEMETEN |
| Meta | PP Neue Montreal Mono Medium 500, 12px, caps, in de hoeken op y=696 | GEMETEN |
| Ratio kop/lees | 160/18 = 8.9x; kop/meta 13.3x | GEMETEN |
| Grond | #f1f0ee rgb(241,240,238), warm-neutraal (R-B = 3) | GEMETEN |
| Schaal | h1-box 1420px (99vw) maar de regels breken op 720px = 50vw; twee regels, 256px hoog; kaphoogte ~105px | GEMETEN box; kaphoogte GESCHAT |
| Bleed | geen; 10px marge links | GEMETEN |
| Leegte | h1-onderkant 266px → metarij 696px = 430px leegte = 48vh; haarlijn ~736px; beeldband vanaf 746px (83vh), 611px hoog, tegels 483 + 927px met 10px gutter | GEMETEN (haarlijn GESCHAT) |
| Grid | geen container (max 1880px = effectief volle breedte), marge 10px, 4- en 8-kolomsgrids met 10px gutter; tekstkolom diensten x=368 w=480 (25.6vw in, 33vw breed) | GEMETEN |
| Beweging | nul bij laden (eerste frame = eindframe), nul CSS-animaties, nul transitions; alleen een zwevende MENU-pil onderaan midden (~320x48) en de tikkende klok | GEMETEN (pil GESCHAT) |

**De ene zet:** een 160px condensed-caps kop op line-height 0.80 en -0.068em, die alleen de linkerhelft (50vw) gebruikt, gevolgd door 48vh niets vóór het eerste beeld.

## 2. Quatrième Étage (pin-06)

Toulouse/Parijs, herbouwd (Siteinspire 11 sep 2026), pin-structuur intact.

| As | Waarde | Bron |
|---|---|---|
| Letter | ABC Monument Grotesk (self-hosted woff2) 400, 14px, letter-spacing -0.35px (-0.025em), line-height 10.15px (0.725), uppercase, inkt #0b0a0a | GEMETEN |
| Bijschrift | ABC Monument Grotesk Mono 10px / 15, caps; projectnaam op 100%, omschrijving op opacity 0.25, "( ART DIRECTION / … )" op 100% | GEMETEN |
| Grootste type | 14px. Er staat geen groot type op de pagina; ratio kop/lees = 1.0 | GEMETEN |
| Grond | #ffffff; vaste kopstroken #fbfafa (24px hoog, 240px en 120px breed) | GEMETEN |
| Beeld | 600px breed (41.7vw), hoogtes 600 / 800 / 750 / 782; twee kolommen op x=60 en x=780, gutter 120px, buitenmarge 60px; beide kolommen beginnen op y=64, lopen uit fase door ongelijke hoogtes | GEMETEN |
| Kopgrid | 6 kolommen van 16.66vw: logo kol 1 (x=10), WORK/STUDIO kol 4 (x=720), INFO kol 5 (x=960), haken op 1398 en 1426; "© 2026" op x=720,y=207 | GEMETEN |
| Beweging | geen animaties, geen hover-regels in de stylesheets; alleen een draaiende pijlknop rechtsonder | GEMETEN |
| Lengte | 13.744px, 57 beelden | GEMETEN |

**De ene zet:** al het type is 14px of 10px caps-grotesk; de hiërarchie komt volledig uit 600px-beelden en de 0.25-opacity van de bijschrifttoon.

## 3. Seachange (pin-08)

Live is een holding page ("While we're finishing our new site"): Nimbus Sans 16px 600 caps als nav (AUCKLAND / SEACHANGE / SYDNEY), Rhymes Text Light 29px/36 als intro, video 953x536 gecentreerd, zwarte pilknoppen 37px hoog. Het gepinde ontwerp bestaat niet meer; Wayback 2025-12 is een Webflow-schil zonder CSS. Alles hieronder is uit pin-08.

| As | Waarde | Bron |
|---|---|---|
| Nav als kop | "seachange / work / info" in een grotesk, x-hoogte ~4.9% van de breedte → bij 1440 ≈ 30px x-hoogte ≈ 56-60px letter | GESCHAT |
| Positie | woorden op 2.4%, 52% en 76.5% van de breedte, y op 5% van de hoogte | GESCHAT |
| Grond | #f0f0f0 rgb(240,240,240), neutraal | GEMETEN op thumbnail |
| Leegte | van y=10% tot 49% van de hoogte = 39vh niets | GESCHAT |
| Beeldband | begint op 49vh, twee tegels van 45% en 48% van de breedte, gutter 3.5%, afgesneden door de vouw; links posterraster, rechts roze fotostudio | GESCHAT |

**De ene zet:** de navigatie ís de kop: drie woorden op ~58px als enig type, en het werk begint pas onder de helft van het scherm.

## 4. Ang Studio (pin-10)

Bilbao, gebouwd door BANILA Studio; GSAP + ScrollTrigger + Lenis.

| As | Waarde | Bron |
|---|---|---|
| Letter | FK Grotesk Neue 400/500 (self-hosted woff) 16px, letter-spacing -0.384px (-0.024em); Tiempos Fine Light Italic 300 als tweede label onder elk nav-item (span op y=18 en y=38: hover-wissel grotesk → cursief-schreef) | GEMETEN |
| Tagline | "Better brands" FK 500 18px / "for better reasons" Tiempos 300 18px, gecentreerd x=660,y=428 | GEMETEN |
| Woordmerk | `<img class="main__logo--black">` 1040x196 op x=200,y=352: 72.2vw breed, 21.8vh hoog; kaphoogte ~145px; vast gepositioneerd (zelfde box op scroll 0 en 900) | GEMETEN (kaphoogte GESCHAT) |
| Ratio | woordmerk-kap/lees ≈ 9x; tekst-op-tekst 18/16 = 1.1 | GESCHAT / GEMETEN |
| Grond | #ffffff; inkt #000; nav computed wit maar rendert donker: blend mode, niet gemeten welke | GEMETEN |
| Beeldkolommen | 4 kolommen van 280x350 (19.4vw, 4:5) op x=64, 408, 752, 1096: pitch 344, gutter 64, buitenmarge 64; onderliggend 16-kolomsgrid gap 16 op 1392px | GEMETEN |
| Stapeling | alle vier de kolommen vóór het woordmerk; het woord staat op een vaste laag erachter | GEMETEN op twee scrollstanden |
| Beweging | scroll-gedreven, niet autonoom (posities identiek 3s later); kolom 1 pitch 828px, kolom 2 pitch 414px → twee snelheden; transitions clip-path 0.8s, transform 0.64/0.8/1s, opacity 0.4s met class `page--in` → onthulling bij laden (CSS-bewijs; eerste frame niet gevangen) | GEMETEN |

**De ene zet:** een 72vw-woordmerk vastgepind in het midden van de viewport, met vier beeldkolommen die er in twee snelheden (828 vs 414px pitch) overheen schuiven.

## 5. Rhythm Dialogues (pin-12)

Toronto, Nuxt. De drie banden uit de pin staan er nog; midden en rechts dragen nu een full-bleed video/foto met een gestreepte kop erover.

| As | Waarde | Bron |
|---|---|---|
| Leesletter | Neue Haas Grotesk Display Pro 55 Roman ("Sans Regular") 15px / 19.5 (1.3); 65 Medium ("Sans Bold") voor intro en h1 (h1 = de sitenaam, 15px) | GEMETEN |
| Displayletter | "NHaasDialoguesDSPro": eigen snede van Neue Haas Grotesk Display waarvan de stroken uit korte streepjes bestaan (raster zichtbaar); 180.8px, letter-spacing +0.48px, line-height 162.72 (0.9); elke letter een eigen div | GEMETEN |
| Ratio | 180.8/15 = 12x | GEMETEN |
| Kleur | geel aside #f5ec51 rgb(245,236,81) (pin: 246,237,84); mauve #806f7a rgb(128,111,122) (pin: 127,111,122); roze #eacbdf rgb(234,203,223); body #212220; inkt #212220. Kopkleur = exact de aside-geel | GEMETEN |
| Banden | aside `position: fixed`, 284px = 19.7vw (pin: 145/736 = 19.7%, identiek); inhoudskolom x=84..1440 (1356px) scrollt onder de vaste kop; kop 950px breed = 66vw op x=284..1234 | GEMETEN |
| Woordmerk | "HYTH / R DIA-M / LOGUES" linksonder in de aside, letters verschoven over drie regels, ~20px gespatieerde caps | GESCHAT |
| Beweging | kop vast terwijl foto's eronder scrollen; "Get involved"-paneel schuift van links in (staat op x=-1000); video speelt; transitions 0.3s; geen GSAP | GEMETEN |

**De ene zet:** een 181px kop met streepjesstroken, vastgepind, in exact de geel van het zijpaneel, zodat paneelkleur en type één systeem zijn terwijl foto's eronderdoor schuiven.

## 6. Aaron Poe & Co (pin-16)

Live is "PoeStudio" (Readymag): grond #121212, gecentreerde mono-caps 14px, roze pillogo, één scherm hoog. Het gepinde ontwerp is weg; Wayback 2024-11 en 2026-02 laden geen inhoud. Alles hieronder uit pin-16.

| As | Waarde | Bron |
|---|---|---|
| Naam | "aaronpoe" van x=0.7% tot 99.6% van de breedte, lowercase zware grotesk (Neue Haas Grotesk Display Black-achtig; niet te verifiëren, live laadt nu Familjen Grotesk 400); x-hoogte ~10% van de breedte → bij 1440 ≈ 147px x-hoogte ≈ 280px letter; bovenkant door de viewportrand afgesneden, descender van de p op 28% van de hoogte | GESCHAT |
| Metarij | ©2025, CREATIVE DIRECTOR, BRAND BUILDER, ABOUT, CONTACT; mono caps ~7px in thumb ≈ 12-13px bij 1440; op 22% van de hoogte, verdeeld over de volle breedte | GESCHAT |
| Intro | vette grotesk, ~26px thumb ≈ 50px bij 1440, line-height ~1.25, volle breedte, 5 regels, onderstreepte kernwoorden | GESCHAT |
| Grond | #edeee8 rgb(237,238,232), warm-neutraal met groenzweem (G > R > B) | GEMETEN op thumbnail |
| Leegte | onder de intro van 71% tot 100% van de hoogte = 29vh | GESCHAT |

**De ene zet:** de naam zo groot dat hij tegelijk masthead, hero en logo is, rand tot rand zonder marge.

## 7. NOA (pin-17)

Blok Design, Nuxt. Identiek aan de pin.

| As | Waarde | Bron |
|---|---|---|
| Leesletter | OT Alpha Regular ("Alpha") 15px / 21 (1.4); nav 15px op x=12, 726, 845, 1370 | GEMETEN |
| Displaytekst | Documan Light 58px / 63.8 (1.1), perzik #eed0cc op de groene grond, volle breedte 1416px (12px marges), pas op y=5507 | GEMETEN |
| Woordmerk | SVG (viewBox 614x206) gerenderd 835x281 op x=12,y=57: 58vw breed, 31vh hoog, zwart, z-index 2; kaphoogte ~270px ≈ 18x leesletter | GEMETEN (kap GESCHAT) |
| Ratio tekst | 58/15 = 3.9x | GEMETEN |
| Kleur | navstrook #eed0cc rgb(238,208,204), 45px hoog; hero-groen #27b36f rgb(39,179,111); inkt zwart; grond daaronder wit. Pin: (38,179,111) en (238,211,204), identiek. Warm perzik naast koel groen | GEMETEN |
| Hero | exact 1440x900 (100vh), naad op x=726 (50.4%): groen links, foto 714px rechts; het woordmerk loopt 121px (8.4vw) over de naad heen en begint 12px van de linkerrand, 12px onder de navstrook | GEMETEN |
| Grid | 12 kolommen, 12px gutter, 12px marge; productgrid 345px en 583px beelden, bijschrift 15px eronder | GEMETEN grid; beeldmaten GESCHAT |
| Beweging | alleen transition transform 0.2s; geen libs; geen laadbeweging waargenomen | GEMETEN |

**De ene zet:** een 58vw-woordmerk dat met zijn laatste letter 121px over de kleur/foto-naad heen loopt, zodat twee halve schermen één object worden.

## 8. Jackson Alexander (pin-25)

Australië, praktijk van Jackson Todd; ontwikkeld door Carl Beaverson. Identiek aan de pin.

| As | Waarde | Bron |
|---|---|---|
| Kop | Suisse Int'l Regular 400, 38px, letter-spacing -0.5px (-0.013em), line-height 41.8 (1.1), kleur #4f4f4f rgb(79,79,79) (géén zwart); de naam als `<strong>` in dezelfde kleur op opacity 0.3; blok 800px breed (55.6vw) op x=20, drie regels, y=316..445 | GEMETEN |
| Overig type | nav 14px 500; secundair 20px; sectietitels 30px; pillabels SuisseIntl-Book 13-14px; body 14px | GEMETEN |
| Ratio | 38/14 = 2.7x (38/20 = 1.9x) | GEMETEN |
| Grond | #f8f8f8 rgb(248,248,248), neutraal; pin identiek (248,248,248) | GEMETEN |
| Leegte | nav y=20; onder de nav 278px niets (31vh) tot de kop; 19px onder de kop; beeldband vanaf y=464 (52vh), full-bleed 1440x902 video (object-fit cover), 436px zichtbaar boven de vouw | GEMETEN |
| Schaal | grootste type is 2.6% van de breedte in kaphoogte; de zin beslaat 55vw | GEMETEN |
| Grid | geen container (1920 nominaal), marge 20px; projecten 3 kolommen gap 20 op 1400 → tegels 453px | GEMETEN |
| Beweging | preloader bij laden: zes beeldstroken (320-620px breed) gestapeld in het midden, navlabels op halve hoogte (y=450), waaieren uit, nav stijgt naar y=20, inhoud fade-in (transitions opacity 0.65/0.5s, height 0.65s); vaste pillen onderaan: sectienav "01 Introduction 02 03 04 05" links en avatar + "Get in touch" rechts, 48px hoog, doorschijnend, actief item wisselt bij scrollen (02 Projects op scroll 900); video speelt | GEMETEN (eerste frame vastgelegd) |

**De ene zet:** een 38px-zin in middelgrijs met de naam op 30% opacity, op 31vh leegte, afgesneden door een full-bleed video die op 52vh begint.

## 9. Reflaunt (pin-23)

De pin is de Behance-case van Bravo Creative (2020), geen site. De live reflaunt.com is inmiddels een ander merk maar houdt de schreef-op-grijs vast.

| As | Waarde | Bron |
|---|---|---|
| Live kop | Butler 500, 60px, line-height 60 (1.0), uppercase, 528px breed (37vw) op x=96; body HK Grotesk 500 16/22; nav 18px 700 caps; container 1280; hero gesplitst op x=720 met foto rechts (760px hoog) | GEMETEN |
| Ratio live | 60/16 = 3.75x | GEMETEN |
| Grond | live #f0f0f0 rgb(240,240,240); pin-thumbnail (240,240,240): dezelfde grijs vijf jaar later | GEMETEN |
| Pin | schreef "Connecting Industry Collaborators" ~4% van de breedte in kaphoogte, kleine caps-eyebrow ervoor, carrousel met bijschrift ín het beeld, oranje #ff3d0d rgb(255,61,13) als kleurvlak | GESCHAT / kleur GEMETEN op thumbnail |

**De ene zet (pin):** schreefkop met caps-eyebrow en een carrousel met tekst in het beeld: de enige schreefgeleide en enige carrousel op het board.

## 10. Harley Meds (pin-07)

De pin is een Instagram-carrousel; de site is Webflow met GSAP, Lenis, barba, Swiper.

| As | Waarde | Bron |
|---|---|---|
| Kop | Manrope 700, 92px, letter-spacing -1.84px (-0.02em), line-height 101.2 (1.1), kleur #52e48d; 512px breed (36vw), vier regels, x=72,y=232 | GEMETEN |
| Overig type | subregel Manrope 600 26px; body 16/20.8; nav 16px 600 | GEMETEN |
| Ratio | 92/16 = 5.75x | GEMETEN |
| Kleur | hero-grond #0c1f15 rgb(12,31,21); accent #3ddc6f rgb(61,220,111); lichtgroen #9cffc4; crème tekst #fef9e8. Pin-grond (38,49,32) is lichter dan de site | GEMETEN |
| Pillen | eyebrow "MEN'S & WOMEN'S HORMONE THERAPY" 331x43, border 1px solid rgb(47,106,69), radius 1584px, padding 10px 20px, 16px; stapcirkels 64px met 3px rand; CTA 290x48, 2px solid #9cffc4. Het verbonden icoon-hals-pil-device uit de pin staat ook op de site ("⚡-TRT"-tag in de productkaart, ~100x28) | GEMETEN; TRT-tag GESCHAT |
| Grid | container 1400 en 1000, 2 kolommen gap 48 | GEMETEN |
| Beweging | hero gepind: op scroll 900 staat de h1 nog onder de video-band die eroverheen schuift; transition transform 4s (trage drift); Lenis smooth scroll; barba-paginaovergangen; Swiper | GEMETEN |

**De ene zet:** het omlijnde pilvormige label met een via een hals verbonden icoonbolletje, in één groen op bijna-zwart.

## Niet-sitepins, herkomst

- **pin-09 Lemon/Ginger:** Pinterest-bron = instagram.com, handle door Pinterest gestript; ontwerper niet gevonden. Twee posters, beeld uit streepjes en punten (dither uit tekens), label in een grotesk op ~5% van de posterbreedte.
- **pin-15 geperforeerde letter over weide:** Pinterest kent geen bron; leest het als "Re…". Niet geïdentificeerd; verwante tag "riso typography".
- **pin-19 A/B/C op drie resoluties:** Pinterest og:description "Instagram photo by The Brand Identity" → oorspronkelijk van @the.brand.identity, herpind via een payhip-blog over pixelfonts. Letter niet geïdentificeerd; de afgeronde pixelvormen liggen in de lijn van CoType (Gridular / Aeonik Fono; pin-24 op het board is CoType's Aeonik Fono-post).
- **pin-21 "Headings":** Spencer | A Pixelated Font, Loryn Ipsum, Creative Market (productbeeld letterlijk).
- **pin-04:** Mondwest & NeueBit "Free To Try" (Pangram Pangram, Behance).

## Wat deze sites gemeen hebben, gemeten

Alleen patronen op drie of meer sites; de getallen per site staan erbij.

**1. Twee families, geen middenweg.** Óf één reusachtig woord/regel op 50-99vw, óf één zin op 14-38px. Reus: Duties 160px op 50vw (GEMETEN), Ang woordmerk 72vw (GEMETEN), NOA woordmerk 58vw (GEMETEN), Rhythm 181px op 66vw (GEMETEN), Aaron Poe ~280px op 99vw (GESCHAT). Zin: QE 14px, Jackson 38px, Seachange ~58px (GESCHAT), Reflaunt live 60px. Niets tussen 60 en 92px behalve Harley (92) die buiten de kern staat.

**2. Ratio grootste element / leesletter in de reus-familie: 9-18x.** Duties 8.9x (160/18), Ang ~9x (GESCHAT), Rhythm 12x (181/15), NOA ~18x (woordmerk, GESCHAT; tekst-op-tekst 3.9x). In de zin-familie 1.0-3.75x: QE 1.0, Jackson 2.7, Reflaunt 3.75.

**3. Groot type staat strak: line-height 0.8-1.1, tracking negatief.** Duties -0.068em / 0.80; Harley -0.02em / 1.1; Jackson -0.013em / 1.1; Reflaunt 0 / 1.0; Rhythm +0.003em / 0.9 (streepjesletter heeft lucht nodig). Klein type ook negatief: QE -0.025em op 14px, Ang -0.024em op 16px, Duties mono 0.

**4. De lichte grond zit tussen 240 en 255, en is neutraal tot licht warm.** Duties #f1f0ee (R-B 3), Jackson #f8f8f8 (0), Reflaunt #f0f0f0 (0), Seachange-pin #f0f0f0, Aaron-pin #edeee8 (groenzweem), QE #fff / #fbfafa, Ang #fff. Géén enkele grond is koeler dan neutraal (B > R komt niet voor). Gekleurde grond op drie sites (NOA groen + perzik, Rhythm geel + mauve + roze, Harley donkergroen).

**5. Inkt is niet zwart.** Duties #252525, Jackson #4f4f4f, Rhythm #212220, QE #0b0a0a. Alleen NOA en Ang gebruiken #000, allebei op wit.

**6. Onderkant van de schaal: 10-16px, vaak mono of caps, in de hoeken.** Duties 12px mono caps op y=696 in vier hoeken; QE 14px caps + 10px mono; Jackson 14px op y=20 in drie posities; NOA 15px op x=12/726/845/1370; Ang 16px; Aaron-pin ~12px mono caps (GESCHAT).

**7. Leegte boven de vouw hoort bij de zin-familie: 29-48vh.** Duties 48vh (430px tussen kop en metarij), Seachange-pin 39vh (GESCHAT), Jackson 31vh (278px boven de kop), Aaron-pin 29vh (GESCHAT). De reus-familie zonder zin heeft nul leegte: QE beelden op y=64, Ang kolommen op y=0, NOA woordmerk op y=57.

**8. Het beeld snijdt de vouw.** Duties band op 83vh (611px hoog, 154px zichtbaar), Jackson band op 52vh (436px zichtbaar), Seachange-pin op 49vh (GESCHAT), QE beelden afgesneden op 664 en 864, Ang kolommen boven én onder afgesneden, NOA foto exact 100vh. Zes van acht.

**9. Geen container, wel marge van 10-24px.** Duties 10px (1880 nominaal), NOA 12px (12-kolomsgrid gap 12), Rhythm 12px, Jackson 20px (1920 nominaal), Ang 24/64px, QE 60px. Alleen Harley (1400/1000) en Reflaunt (1280) boxen zichzelf. Gutters: 10, 12, 12, 16, 20, 64, 120.

**10. Een vaste laag op zes van acht.** Ang woordmerk vast achter de kolommen; Rhythm aside + kop vast; Jackson pillen onderaan vast (48px); Duties MENU-pil vast; Harley hero gepind; QE kopstroken vast (24px). NOA en Reflaunt niet.

**11. Beweging bij laden op drie van acht, en dan echt.** Jackson preloader (stroken waaieren uit, nav stijgt van y=450 naar 20), Ang `page--in` clip-path 0.8s, Harley GSAP/Lenis/barba. Nul bij Duties (eerste frame = eindframe), QE, NOA, Rhythm. Scrollgedreven beweging op vier: Ang twee-snelheden-kolommen, Rhythm foto's onder vaste kop, Harley gepinde hero, Jackson actieve pil.

**12. Beeldkolommen zijn ongelijk of uit fase.** Duties 483 + 927 (1:1.92), QE 600 + 600 maar hoogtes 600/800/750/782 uit fase, NOA 726 + 714 met woordmerk over de naad, Rhythm 284 + 1156 (fixed + scroll), Jackson 800px tekst boven full-bleed 1440.

## Wat mijn v2 anders deed

richting-v2.html gemeten met hetzelfde script op 1440x900 (NeueBit is een fallback; de displaymaten in px kloppen, de breedtes niet).

| As | v2 GEMETEN | Sites | Kloof |
|---|---|---|---|
| Kop | Neue Haas Grotesk Text 500, 46px, -0.92px (-0.02em), lh 51.5 (1.12), 767px breed (53vw), 2 regels op y=200, tweede regel gedimd #85878a | zin-familie 14-38px, reus-familie 160-181px | v2 valt precies tussen Jackson (38) en niets; ratio 46/17 = 2.7x is exact Jacksons 2.7x, maar Jackson wint het scherm met leegte + full-bleed band, niet met de kop |
| Grootste element | NeueBit-placeholder 120px jaartallen (901px = 63vw in fallbackmetriek), 72px h2's | reus-sites 58-99vw op één woord, vast of over een naad | v2 heeft geen element dat de viewport claimt; het grootste staat op y=1405, niet boven de vouw |
| Leesletter | 17px / 26.35 (1.55) | 14, 15, 15, 16, 16, 18; lh 1.15-1.4 | v2 is groter dan zes van zeven en opener; Jackson (14/normal) en Duties (18/1.15) zijn de randen |
| Meta | 12.5px mono op y=75, drie items | 12px mono (Duties), 14px (Jackson) op y=20 | maat klopt; v2's nav zit 55px lager dan Jackson |
| Grond | #f0f1f1 rgb(240,241,241), B ≥ R (koel-neutraal, per spec regel 7) | 240-255, nooit koeler dan neutraal | de enige koele grond in de reeks; Duties (warm) en Jackson (neutraal) zijn de bewezen keuzes |
| Inkt | #151614 (21,22,20) | #252525, #4f4f4f, #212220 | past; Jacksons #4f4f4f is de onbenutte optie |
| Leegte | kop-onderkant ~305px → beelden op y=796: 491px = 55vh | 31-48vh | v2 heeft méér leegte dan Duties, maar de band begint op 88vh (Duties 83, Jackson 52): 104px beeld zichtbaar tegen 154 en 436 |
| Beeldband | 563 + 789px binnen 32px marges (1376 totaal), 24px gutter | Duties 1420 (10px marge, 10px gutter), Jackson 1440 full-bleed | v2's band is 64px smaller dan Duties en 64px smaller dan Jackson, en de tegels zijn 1:1.4 waar Duties 1:1.92 is |
| Container / marge | max 1440 gecentreerd, marge 32px | geen container op 6 van 8; marge 10-24 | bij 1440 zie je de container niet, erboven wel; de 32px marge is 8-22px ruimer dan alle kernsites |
| Vaste laag | nul | 6 van 8 | v2 heeft niets dat blijft staan terwijl de rest scrollt |
| Beweging | transition background-color 0.12s | 3 van 8 laadbeweging, 4 van 8 scrollgedreven, 4 van 8 nul | v2 zit bij de nul-groep (Duties, QE, NOA); dat is een geldige keuze, maar dan moet de stilstand van Duties komen: 160px en 48vh, niet 46px |
| Woordmerk | SVG-merkteken 312px in de voetsectie | NOA 58vw over de naad, Ang 72vw vast, Rhythm woordmerk in de aside | v2 gebruikt het merkteken als afsluiter, de sites als opener |

## De drie scherpste zetten om over te nemen

**1. Duties: de zin op 160px, line-height 0.80, links de helft.** Zet de ene hero-zin in de displayletter op ≥ 11vw (160px bij 1440), line-height 0.80, tracking -0.05 tot -0.07em, max-width 50vw, twee regels; metarij op ~77vh; haarlijn; beeldband vanaf 83vh met tegels 1:1.9 en 10px gutter tot 10px van de rand. Het is Jonathans regel 4 ("één zin als kop") en regel 5 ("leegte 20-40vh") op 3.5x de maat van v2; de leegte wordt dan 48vh en is zichtbaar bedoeld. Nul beweging blijft geldig: Duties heeft ook nul.

**2. NOA: het merkteken 58vw groot en 8vw over de naad.** Zet "jonathan looman" of het JL-merk als SVG op 58vw breed, 12px van de linkerrand, 12px onder de metastrook, en laat het 8vw (≈121px) over de naad tussen kleurvlak en eerste beeld heen lopen; hero exact 100vh, naad op 50%. Ang bevestigt de zet met 72vw en een vaste laag achter twee-snelheden-kolommen. Het rasterdevice (perforatie, tekens) hoort in precies die overlap, waar het merk het beeld raakt.

**3. Rhythm Dialogues: de kop in de accentkleur, uit streepjes, vastgepind op 12x de leesletter.** Eén kop op 12x body (181px bij 15px), line-height 0.9, in exact de accentgeel (Rhythm #f5ec51; v2 heeft #ecf53c, groener), stroken opgebouwd uit streepjes of pixels, `position: fixed` in de viewport terwijl projectbeelden eronderdoor scrollen; het zijpaneel in dezelfde geel op 19.7vw. Dit is "raster wordt beeld" (Jonathans regel 10) op een live site, met kleur en type als één systeem in plaats van geel als losse markeerstift.

Dichtst bij v2 staat Jackson; de kloof daar is klein en goedkoop: nav naar y=20, kop op #4f4f4f met de naam op opacity 0.3, 31vh leegte, band full-bleed op 52vh in plaats van 88vh, en twee vaste 48px-pillen onderaan. Wie de reus-familie niet wil, neemt dat.
