Vi lagde et bildespråk for artiklene. Det tok seks forsøk.

Hver artikkel trenger et bilde. Vi ville verken kjøpe dem, tegne tjue av dem for hånd, eller la en bildegenerator finne på noe nytt hver gang. Så vi bygde et språk i stedet: former og farger som betyr noe, og en regel for hvem som får hvilken.

Problemet er kjedelig og helt vanlig. Tjue artikler trenger tjue bilder, det kommer flere hver måned, og de må se ut som de hører til samme sted. Kjøper du dem, ser sida ut som alle andre. Lar du en bildemaskin lage dem, må noen velge hver eneste gang — og valget er smak, ikke system.

Vi ville ha noe tredje: et bilde som følger av hva artikkelen er. Ikke pynt lagt oppå, men en form som sier hvilket spor du står i.

Bildet skulle si hvor du er

Sida har seks spor. Begynn her, Bygg noe, Skriv bedre, Nettside, Bedrift, Kreativt. Det er den eneste inndelinga som betyr noe for en leser, så det var den bildene skulle uttrykke.

To beslutninger avgjorde resten. Formen bærer sporet — hvert spor fikk sitt eget formspråk, og et bilde skulle kunne kjennes igjen på formen alene. Fargen bærer også sporet, men bare som forsterkning, aldri som det eneste skillet.

Alt annet — hvor mange former, hvor store, hvor mye tekstur — var det som tok seks forsøk å finne ut av.

Seks versjoner på to dager

Versjon én het «dynamiske vinkler». Linjer og bølger i alle retninger, perspektivgitter, kryssende kurver. Overskriften på arbeidsdokumentet lovte «ubegrenset kreativitet». Det så ut som støy.

Versjon to het Refined Pattern System, og den er den viktigste i historien — ikke fordi den vant til slutt, men fordi den er den eneste som sto ute lenge. Store fylte former, kuttet av kortkanten, med et fint linjelag oppå og sporets farge gjennom begge deler. Den lå på forsida fra mai til september. Alt du så av artikkelbilder her i sommer, var denne.

Slik ser den ut, ett bilde per spor. De er bleke med vilje — de var laget for å ligge under en overskrift, ikke for å ses alene:

Den gjør noe versjon seks ikke gjør: den har dybde. Bakgrunnsflaten er kuttet av kanten, så bildet virker større enn kortet. Mønsterlaget gir tekstur uten å ta oppmerksomhet. På et stort kort er den vakrere enn den som vant.

Svakheten er også synlig når man ser de seks ved siden av hverandre: sporene ligner hverandre for mye. Formen er nesten den samme, og bare fargen skiller. Da bryter regelen om at formen skal bære sporet.

Versjon tre var første gang Bauhaus ble nevnt. To til fire store former i øvre høyre hjørne, en gradient som holdt nedre venstre hjørne rolig så tittelen kunne stå der. Hver variant refererte til en faktisk komposisjon — Lissitzky, Mondrian, Kandinsky.

Versjon fire gikk motsatt vei: én kjempeform som stakk ut av kortet, pluss et algoritmisk lag oppå. Phyllotaxis, Fibonacci-sirkler, sekskantpakking.

Versjon fem var den rikeste. Atten algoritmiske byggeklosser, tretti varianter, hele flaten i bruk. Flow fields ved siden av fraktaltrær, Truchet-fliser ved siden av Sierpinski-tepper. På kontaktarket var den vakker.

På forsida var den ubrukelig. Ved 176 piksler så alle tretti ut som hverandre, og tittelen druknet i detaljene.

Versjon seks er den som står. Flate former, fem farger, ingen gradient, ingen tekstur. Tretti komposisjoner først, utvidet til 108 i august så det skulle være nok å velge i når artiklene blir flere.

Den vant på det ene kriteriet vi hadde satt opp først: du skal se hvilket spor du står i, på formen alene. Sett de seks familiene ved siden av hverandre, og de ligner ikke på hverandre. Det klarte ingen av de fem foran.

Hvorfor 108 ferdige, og ikke en generator

Alle de fem første versjonene var generatorer. De regnet ut et bilde i det du åpnet sida. Versjon seks er en katalog: 108 ferdige komposisjoner som ligger i en fil, og et kort slår opp sitt eget.

Det var det største valget i hele historien, og det gikk imot magefølelsen. En generator er morsommere å bygge og virker mer moderne. Fire grunner gjorde likevel katalogen til det riktige.

Et bilde må kunne godkjennes. Du kan ikke godkjenne en generator. Du kan bare godkjenne det den lagde i dag, og håpe den lager noe like bra i morgen. 108 komposisjoner kan et menneske faktisk se gjennom og si ja til. Det er forskjellen på å stå inne for bildene og å stole på en maskin som lager dem mens ingen ser.

Koden endrer historien bakover. En generator med frø gir samme bilde hver gang — helt til du rører reglene. Så bytter alle bildene seg, også i artikler som ble skrevet i mai, også i skjermbildene av dem. En katalog er låst. Bildet i en artikkel fra i vår er det samme bildet i dag.

Variasjonen var usynlig der den skulle telle. Versjon fem hadde atten byggeklosser og tretti varianter. Ved 176 piksler så de like ut. Vi betalte for en rikdom i dataene som ingen kunne se på skjermen.

Ingenting skal tegnes i nettleseren. Katalogen er ren SVG som bygges inn på serveren. Ingen skript, ingenting som blinker mens det regnes ut, ingenting som forsvinner om noe feiler. Kortet er ferdig når sida er ferdig.

Generatoren forsvant ikke. Den ble måten vi fant de 108 på. Vi lot den lage i hundrevis, og valgte ut. Arbeidet var aldri å tegne — det var å velge.

Seks familier, seks lærere

Alle artiklene har en kategori i frontmatter. Det er seks av dem, og hver har fått en lærer fra Bauhaus-tida å låne form fra.

Slik ser den første komposisjonen i hver familie ut:

Navnene er lån, ikke kopier. Ingen av de 108 er en tegning av et bestemt verk. De er øvelser i det formspråket, slik en musikkstudent øver i en toneart.

Regelen: fem farger, aldri flere

Papir, blekk, rødt, gult og blått. Hver komposisjon bruker to eller tre av dem. Aldri gradient. Aldri skygge. Aldri en sjette farge fordi det «trengtes akkurat her».

Det er regelen som gjorde at 108 komposisjoner fra fire forskjellige arbeidsøkter ser ut som ett system. Ta vekk regelen, og du har 108 forskjellige ideer om hva som er pent.

Hvordan et kort velger sitt bilde

Kategorien i artikkelens frontmatter velger familien. Et tall regnet ut fra tittelen velger nummeret, fra én til atten. Samme tittel gir samme tall, så kortet ser likt ut i dag, i morgen og på en annen maskin.

En stund lå det en bryter på artikkeloversikten der man kunne veksle mellom systemene. Den er tatt bort. Å vise fram fem forkastede versjoner ved siden av den vi valgte, er en utstilling om oss, ikke en hjelp til den som leter etter noe å lese. Versjonene ligger i repoet for den som vil grave.

Vil du se hvordan resten av sida ble til, ligger det i slik bygde vi denne nettsiden. Og vil du ha det motsatte av en katalog — en maskin som lager nye bilder hver gang — har vi bygd den også, i generativ kunst med kode.

Slik bruker du dette i praksis

Dette er beslutningene som ble tatt, i rekkefølge. De er våre, ikke regler — men rekkefølgen er det eneste som gjorde jobben overkommelig.

1. Fargene først, før noe ble tegnet. Fem holdt. Skrevet ned med hex-kode, så det ikke ble «omtrent den røde».
2. Seks grunnformer: sirkel, rektangel, linje, bue, polygon, halvsirkel. Alt skulle bestå av disse.
3. Seks kategorier, ett formspråk per kategori. Forsøkene med tre formspråk per kategori ble uleselige.
4. Ti komposisjoner per kategori som SVG på 400 ganger 400. Sju strøket, tre beholdt.
5. Tittelen lagt oppå hver av dem i 176 piksler bredde. Den som ikke lot seg lese, røk.
6. Resten nummerert og fila låst. Det er katalogen. Nye kort trekker fra den, de tegner ikke sine egne.

Generatoren kan lage uendelig. Katalogen er de du tør å signere.