← Forsiden

Demo

Automatisk AI-mærkning af produktbilleder

Herunder er en helt almindelig produktoversigt. Otte billeder. Fire af dem indeholder AI-genereret materiale — men det kan man ikke se på dem.

Tryk på knappen. Et script læser hver enkelt billedfil, finder dem der selv oplyser at de er AI, og sætter en synlig mærkning på dem. Uden at røre sidens HTML eller CSS — der er ingen skabeloner at lave om, og ingen risiko for at der falder noget fra hinanden undervejs.

Hvad der lige skete

Scriptet hentede de første 256 KB af hver billedfil — metadata ligger forrest, så resten er ikke nødvendig — og læste efter to ting: IPTC/XMP-feltet DigitalSourceType og et C2PA-manifest.

Fire filer oplyser selv, hvad de er. To siger trainedAlgorithmicMedia — altså genereret af en model. To siger compositeWithTrainedAlgorithmicMedia — sammensat, med AI-genererede elementer i. De får derfor hver sin tekst, fordi det ikke er den samme påstand.

Sådan kommer det på

<script src="/ailabel.js" defer></script>

Én linje i sidens skabelon. Nye billeder får mærkningen automatisk, i samme øjeblik de lægges op — der er ingen liste at vedligeholde og ingen, der skal huske noget.

Og her er hvorfor det ikke er hele opgaven

Scriptet mærker de billeder, hvor mærkningen stadig er i filen. Det er dér, det bliver ubehageligt:

De fleste systemer sletter metadata, når de skalerer et billede ned. WordPress, Shopify og Next.js' billedpipeline gør det som standard. Originalen bærer mærkatet — den fil, jeres kunder faktisk får serveret, gør ikke. Ingen har besluttet det. Det sker bare.

Forskellen kan kun ses ved at hente originalen og den serverede udgave af det samme billede og sammenligne dem. Bærer originalen et mærkat, som kopien har mistet, er det bevist. Bærer originalen heller ikke noget, ved man stadig ingenting — og så skal der ikke påstås noget.

Det er den del, jeg laver. Demoen herover viser princippet på otte billeder, jeg selv har lavet. På en rigtig shop er opgaven en anden: at finde ud af hvilken af de to situationer I er i, skrive de manglende mærkater ind i de filer der mangler dem, lukke hullet i pipelinen så det ikke sker igen, og sætte mærkningen ind i jeres egne skabeloner — så nye billeder får den af sig selv.

Gennemgangen er gratis, og I får den uanset om der er noget at finde. Implementeringen er arbejdet.

Det ærlige forbehold

• Ligger billederne på et CDN, skal det tillade læsning (CORS). Ellers kan scriptet ikke se filen — og så mærker det ingenting frem for at gætte. Det står i konsollen, når det sker.
• På meget store kataloger hører det her hjemme i byggetrinnet, ikke i browseren. Samme logik, kørt én gang når billedet lægges op, i stedet for hos hver besøgende. Det er den rigtige løsning ved tusindvis af billeder — denne demo viser princippet.
• Teksten og placeringen er en beslutning, ikke en teknikalitet. Hvad der skal stå, og hvilke billeder det gælder, er det, der reelt skal tages stilling til. Selve koden er den lette del.