The pleasure principle
Every speaker's face is a hard-edged lightbox, and the light is where the site is written. Magritte's man whose head is a light, rebuilt with real people on black: the body is the frame, the lamp is the page, and asking the mind rewrites what the lamp says.
The story
Magritte painted Edward James in 1937 with his head replaced by a light; Man Ray's photograph was the source. Both ancestors of "Free Your Mind" are bodies on a flat field, and the surrealist head is a light or a window, not a cloud. So the first screen is one real person from the ETS26 lineup, cut out of their studio photograph and standing on the bottom edge of a pure black screen, and where the face should be there is a lightbox: pure white, a 2 px aluminium bezel, hung from a rail on two stems above the head, nothing soft anywhere. Inside the light, in black, the summit's sign fills the box edge to edge: FREE YOUR MIND. Under the sign, a rule to write on, with someone else's question already in it in grey ("who speaks tuesday?"). The facts live in the corners (ETS27 top-left, Austin top-right, tickets bottom-right, the person bottom-left, both lower corners 96 px clear of the bottom edge) and the dates stand beside the body as hairline Didone numerals, the hero's second voice. The lamp strikes on like a fluorescent tube when the page loads, stutters twice, and holds. Nothing else moves until you do; even the caret stays solid until the visitor moves.
The standard route is the lineup walked speaker by speaker: the arrow keys and "walk the lineup" change the person with a one-frame camera flash. The light never moves. Every portrait is scaled so that its eyebrow line, chin and centre line sit in the same place, so the walk is the same lamp over a different body each time. The walk is the thirteen portraits that hold at poster scale (the photograph reaches the bottom edge and is not enlarged more than 1.6 times); anyone else clicked in the lineup gets the light alone, hanging on its rail on the black with their name written in it. The interactive route is the rule inside the lamp: whatever you type is written in the light in the sign's own face, Enter on an empty rule asks the grey question, and the mind flashes, walks to the person who answers (ask about Tuesday and it walks to Nancy Bui-Thompson, who opens the day) and writes the answer in their light, numbered, the heading repeating exactly the words that were typed, with its source as a footnote. A long answer keeps its first rows on the poster and points to the rest in the agenda below.
Section 01 on the page is one such answer already written: "who speaks tuesday?", set as the heading in Nancy Bui-Thompson's light, her red top and arms visible under and beside the 760 px light, the photograph's foot standing on the next section's rule. The left column carries only the number and the provenance (asked 14 Oct, answered from the 13 Oct agenda snapshot).
Further down the tempo changes on purpose: a breath screen with the theme as a hairline italic sentence and three short columns for the visitor (the summit, who comes, two ways in); the lineup as a field of 77 lights, every face under the same light and every light carrying its name (featured speakers larger, portraits still to come as signs), ending on a full row with one long light for the visitor: the 78th light is yours; the agenda as four hairline date numerals with the day's shape as a list where every speaker-led session gets a small white light as its bullet, keyed in the label row; tickets as two hairline prices and one lit sign that says GET A PASS, hung like the cover lamp; the place as one word, Austin, with "venue announced soon"; and a lab-notebook footer: snapshot 2026-10-13, 77 speakers, 50 sessions, sample data.
Typography
- Playfair (the 2023 variable family, not Playfair Display), Google Fonts, upright and italic, axes opsz 5–1200, wdth 87.5–112.5, wght 300–900. Used only for numerals and one italic sentence: the dates "3–6" at 224 px, the answer index "01" at 210 px, the four agenda days at 300 px, the two prices at 150 px, "Austin" at 240 px, "Free your mind." in italic at 164 px (72 px on the phone, on two lines). Set at opsz 700, wght 300, leading 0.82. The seed asked for opsz 1200; at these sizes 1200 puts the hairlines below one device pixel and the "4"'s diagonal breaks into dots on a 1× screen, while 700 keeps the Didone contrast with a continuous 1 px hairline. On a 2× screen the whole site could move back to 1200.
- Mona Sans, Google Fonts, axes wdth 75–125, wght 200–900. Three settings and nothing in between: the sign at wght 900, font-stretch 75 % (compressed), uppercase: 192 px on the cover (0.3 of the body, so FREE YOUR spans the light), 56 px for a question in the light, 44 px on the ticket sign, 28 px for the ETS27 wordmark and the featured names in the field, 17 px for the names of portraits still to come; reading text at 17 px, wght 400; the mind's "say" line at wght 300, font-stretch 118 %; labels at 12 px, wght 500, tracked 0.085 em, uppercase. The ordinary names in the field are 12 px wght 600 at the foot of each light.
- Three sizes carry the page: display 150–300 px, text 17 px, labels 12 px. No monospace anywhere; the source footnotes are 12 px Mona Sans with a dagger.
Colour world
- Black
#000000: the room. Not near-black; the lamp needs a true dark to be a lamp. The portraits are cut out and flattened onto this same black, so no studio backdrop survives anywhere. - White
#FFFFFF: only ever the light. Every white rectangle on the page is a lamp (the cover lightbox, the 77 lights and the visitor's 78th in the lineup, the bullets in the agenda, the ticket sign, the strip light in the margin). - Ink in the light
#000000, someone else's question#6F6F6F; ink on the black#D4D4D4(text) and#8D8D8D(labels); hairlines#1E1E1E; faint#4D4D4D. - Aluminium
#8F8F8F: one grey for the 2 px bezel (1 px on the small lights), the two 2 px stems and the 4 px rail, which is exactly the width of its light. - No accent colour at all. The colour on the page is the colour of real people: skin, hair, a red top, a pink blouse, a floral dress, a navy jacket. The photographs are never converted to black and white.
Layout grammar
- The cover is a 1440×900 poster: corners carry the facts; the centre-right holds exactly one thing, the body with the light over its face; the hairline dates sit in the left field at the height of the lamp. Nothing is centre-stacked.
- The lamp is wider than the body (760 px over a 640 px body) so it reads as an object in front of the person, not a region of the photograph. Its top sits at the hairline (10 % of the body) and its bottom at the collar (69 % of the body at least, more when the writing needs it). The portraits are normalised to that geometry once, from Apple Vision face landmarks, so the lamp lands on the face for every portrait without being moved.
- Sections after the cover alternate tempo: portrait screen, breath screen, field, numerals and list, prices and sign, one word, footer. Each section after 01 opens with a hairline rule and a two-sided label row (what it is on the left, its provenance on the right).
- The lineup is an 11-column grid with featured speakers spanning 2×2 and
grid-auto-flow: dense. Every window has the same light in the same place (left and right 9 %, top 14 %, 58 % tall), so the field reads as a wall of lit windows rather than a roster. A body is shown only when its photograph reaches the foot of the window (enlarged by at most 12 % to get there); one that would stop a sliver under the light is blacked out under the light, so no plinth of shirt floats in the field. Hover (or a tap on the phone) switches a light off and shows the face and the organisation; a click (or a second tap) walks the cover to that person. The cells left over at the end are one long light: the 78th light is yours, and it opens the composer. - The phone (390 px) stacks the same objects: a top strip with the facts (ETS27 larger than the city, "14th edition" only), the hairline dates at 132 px, the portrait full-bleed with the lamp in the flow so a long answer grows the figure instead of covering the caption, the caption, a tickets line, the 01 answer, the breath screen, then the sections in one column (lineup at 4 columns with every name in its light, agenda numerals at 150 px). The parked assistant becomes a one-line strip along the bottom edge, and the footer keeps room for it.
Motion and life
- Strike-on: the cover lamp flickers like a tube on first power (CSS steps, 1.25 s, three stutters) and then holds. Reduced motion skips it.
- The flash: every change of person is one frame of white (a fixed overlay, 120 ms,
steps), Magritte's light reused as a camera flash. Thinking is a flash and a walk, never a shimmer or a dot row. - Writing in the light: typing echoes in the lamp in the sign's face, sized to the length of the line; Enter writes the answer. The caret holds solid until the visitor's first move (pointer, key, wheel or touch), then blinks on a 1.1 s step.
- Agenda numerals come into focus as you scroll: a registered
--opszproperty animates from 5 to 700 withanimation-timeline: view()over the first 28 % of the day's entry, so a sturdy numeral thins into a hairline as the day arrives; before and after that the numeral is the settled white hairline (no grey numeral is ever left standing). Firefox and reduced motion get the final state. - Hover in the field: a light switches off (transparent, white hairline) and the person appears.
- No scroll-fade filters, no parallax, no cursor follower, no smooth-scroll library, no WebGL. The page is DOM, CSS and about 14 KB of JS; the only "shader" is a lightbox.
The fork and the mind
- The fork is a verb printed twice with different weights. "Write in the light" is the rule inside the lamp, in the brightest object on the page, with another visitor's question waiting in it: the adventure. "Walk the lineup ← →" is a 12 px label on the black under the caption: the page read in order. No cards and no suggestion chips.
- The standard route is the lineup walked speaker by speaker (arrow keys, the walk verb, or a click on any light in the field), with the agenda, tickets and place as ordinary scrolled sections below the cover. Every unit of the site is a lamp on a body or a lamp alone: a session's bullet, the ticket sign, a person without a portrait, the visitor's own light.
- The interactive route is the same lamp rewritten. The question stays as the heading of the answer, in exactly the words that were typed, numbered (01, 02…); the say line is about 45 words in Mona Sans wide-light; the components inherit the page's own type (time column, bold names, organisations); the source is a dagger footnote. The mockup's mind is a small router over the snapshot (days, prices, place, keynotes, the opening, theme, any speaker's name) so the live page answers for real; it says plainly when the snapshot has no answer. One question, one wording in every state: the grey question in the cover rule, the heading in 01 and the strip light all say "who speaks tuesday?".
- The omnipresent assistant on the standard route is a strip light parked in the left margin once you scroll past the cover: 22 px wide, WRITE IN THE LIGHT set vertically in it, hung on its own small rail. It lives entirely in the 60 px gutter, so it never covers a light, a session or the footer. Hover or focus shows the moderated question other visitors asked on this page, rotating; a click scrolls to the cover with that question already written in the light. Never a pill, never an avatar, never bottom-right.
Build
build/people.pydocuments and reruns the portrait pipeline: the 59 ETS26 photographs are cut out locally (bg-remove, BiRefNet, no generative edit), face landmarks come from Apple Vision (build/faces.py), and each portrait is scaled and moved so the eyebrow line, chin and centre line land at fixed fractions, its alpha hardened to a crisp silhouette and flattened onto black. Outputs:people/walk/*.webp(the 13 cover portraits),people/answer.webp(section 01) andpeople/tiles.webp, one 8 × 8 sprite for the whole field so the page makes nine requests, not sixty. Sam Chang's "photograph" was a lettered placeholder, so his is a name-only light; Greg Brown's circular headshot is cut to its inscribed square before anything else.build/build.pywritesindex.htmlfrombuild/template.html, the sample data andbuild/people.json.
What to build next
- Replace the keyword router with the real mind (the mechanics team's
sayanduiarrays) and let it choose which speaker's light to write in; keep the flash-then-walk choreography and the numbered sections. - Portraits at poster scale for the 45 people whose photographs are tight headshots or small files: a half-length photograph each would put everybody on the walk, and their bodies back in the field.
- Same-document view transitions on the walk, now that the lamp never moves: only the body should change, with the flash kept.
- Speaker pages as a single lamp each; session pages as the lamp of their moderator; the agenda bullets clickable to those lamps.
- The parked assistant's questions from real visitor logs; the "lit at 60 Hz" footer line as a real ERCOT frequency readout if the mechanics team wants one live number on the page.
Risks
- The lamp becomes a glow. The cure is already in the CSS: pure white, 2 px bezel, a rail on two stems, no shadow, no blur, no gradient anywhere on the page; keep it that way when adding states.
- The lineup field could still be read as a headshot grid. It survives because no face and no studio backdrop is visible at rest, every light is the same window in the same place, the featured lights are 2×2, and the names are written in the light rather than captioned under it; do not add captions under tiles or equalise the sizes.
- Cut-outs keep the photographer's crop: where a photograph cuts the shoulders, the body has a straight edge (Hugh Forrest's shirt under the cover light, the field's windows). On the cover it sits inside the light's width; in 01 Nancy Bui-Thompson is placed so the cropped arm continues the light's left edge. A new portrait should be checked on the cover before it joins the walk.
- Portraits are ETS26 stand-ins labelled sample data in four places; none is confirmed for ETS27.
- Hairlines at wght 300 need a 2× screen to be the seed's opsz 1200; at 1× the site runs at opsz 700. Keep one setting across all numerals or the voices split.
- The strike-on flicker and the flash are stark; both respect
prefers-reduced-motion, and the flash should stay at one frame, never a fade.