Il brand in HTML: l'ascesa dei risultati basati sull'input

Come il lavoro creativo si sta spostando dai risultati tradizionali a risultati guidati da sistemi atomici.

La scaturiti da risultati atomici.

La scorsa settimana abbiamo inviato a un file zip contenente due cartelle: /human, /agent, e un readme.md. Dopo un mese di lavoro, all'interno della cartella agent, l'intero brand era codificato come istruzioni tramite file YAML, JSON, Markdown, HTML, CSS, SVG. Al ricevimento, hanno caricato il pacchetto in Cursor, digitato un prompt e hanno ottenuto una landing page quasi completa quel giorno stesso.

Nelle ultime settimane, il semplice file zip è diventato il deliverable che ci viene chiesto di produrre. Non un sito web, un prodotto software o un software, o una bibbia di campagna go-to-market. In altre parole, il nostro input è dove risiede il nostro valore e ciò che aiuta a determinare il risultato, non i nostri output.

Questo è piuttosto nuovo per noi e in parte è stato spinto da ciò che è possibile grazie a Claude Design. Il livello UI accessibile e i file organizzati che Design produce sono stati una svolta piuttosto grande da @littleplainsxo.

Vogliamo raccontarvi cosa stiamo vivendo in queste ultime settimane con alcuni dei founder in fase iniziale con cui stiamo lavorando su questo.

Parleremo anche di dove vediamo dove la creatività umana e il pensiero originale (il 'trucco magico') sono più prezioso, e perché questo è sempre più ciò per cui vogliamo essere pagati.

Il Valore del Progetto si Sta Spostando a Monte

Siamo nelle prime fasi in cui vediamo in prima persona che il lavoro creativo stesso sta cambiando, e con esso il valore, la tempistica e il modello di prezzo.

Qualche giorno fa, io e @alexleiphart eravamo in ufficio a cercare di spiegare questo cambiamento nel nostro modo di lavorare ad alcuni amici del settore in visita. Per illustrare ciò che stavamo affrontando, abbiamo disegnato un diagramma su una lavagna bianca: il valore di un progetto sull'asse verticale + il tempo del tempo del progetto su quello orizzontale.

Un disegno grezzo su lavagna bianca che mostra come il valore stia diventando più a monte / basato sull'input.

Negli incarichi di servizio tradizionali, il valore cresce lentamente e costantemente man mano che i deliverable si accumulano. Si paga per il tempo, si ricevono gli output, e il valore si costruisce durante l'incarico. Negli ultimi mesi, ciò che stiamo scoprendo assomiglia più a un imbuto sdraiato su un lato.

Per gli incarichi in fase iniziale, scopriamo che la più alta concentrazione di valore si trova all'inizio: la spinta da 0 a 1 di ricerca approfondita, sintesi esperta e le audaci decisioni di giudizio su come posizionare un'azienda come brand. Per chi è. Cosa dice. Come suona. Dove si colloca nel mercato. Quelle decisioni di giudizio sono ciò che separa un sistema che regge da uno che non regge. L'imbuto si restringe bruscamente da qui perché una volta che il pensiero è fatto, gli output seguono la logica del pensiero.

Nota: notate 'magic-trick.md' alla fine del diagramma. Ci torneremo.

Il Modello dell'Agenzia si Sta Spostando

Per la maggior parte della storia del lavoro (di tutte?) le agenzie, la consegna era statica. Un file di design, un PDF, una presentazione che il cliente avrebbe consultato, interpretato... e gradualmente si sarebbe allontanato man mano che venivano costruiti nuovi lavori, scritti, scritti nuovi testi e assunti nuovi fornitori e membri del team.

Negli ultimi decenni di lavoro creativo digitale, chiunque abbia incontrato un Brand_Guidelines_FINAL_v3-FINAL-FINAL.pdf conosce lo schema. Il brand esisteva nel mondo dopo la consegna nella forma che il team del cliente riusciva a mantenere.

Tuttavia, ciò che noi e altri in prima linea nel lavoro creativo agente abbiamo spedito recentemente è diverso nella forma e diverso nell'intento.

La forma di ogni kit che spediamo ora.

La cartella /human contiene le linee guida del brand in formato tradizionale (PDF, documenti Figma collegati, ecc.), ancora preziosi e ancora fondamentali per la stragrande maggioranza dei team.

La cartella /agent è il pezzo più interessante.

Basandosi sul lavoro nella cartella /human, i file YAML, JSON, Markdown, HTML, CSS e SVG sono strutturati in modo che qualsiasi strumento agente possa leggerli e costruire da essi. Il brand è ora codificato come istruzioni, non come documentazione, e basato sulle nostre decisioni a monte. Un agente che apre quella cartella ottiene un sistema olistico su cui può agire, con un POV incorporato.

La svolta degli ultimi mesi è che il kit è coerente dall'inizio alla fine, non solo recuperabile singolarmente.

Inserisci questo 'sistema atomico' in Claude Design, Code, Cursor (o molti, molti altri strumenti) e il DNA del brand può espandersi per scrivere, progettare, animare e spedire una landing page, una superficie UI o una campagna GTM ad alto livello di qualità, contesto, EQ e specificità tecnica perché il pensiero fondamentale è incorporato nella struttura dei file.

È lo stesso brand in due formati: uno che gli umani usano per capire il sistema, uno che gli agenti usano per estenderlo. La svolta dell'ultimo mese è che ora quel pacchetto di informazioni per gli agenti ha una direzione unificante di più alto livello più chiara, e ha i dettagli tecnici di basso livello per costruire verso di essa.

In Esempio:

Recentemente abbiamo aiutato a costruire il kit atomico per Type (vedi il sito reale appena lanciato!), uno strumento di lavoro multiplayer AI (grazie @fletchrichman).

Abbiamo inserito il pacchetto finale in Cursor e digitato un singolo prompt: "generami una landing page HTML basata sul sistema di design atomico e sulla strategia." Il modello ha esaminato atomi, molecole e organismi e ha prodotto una landing page completa con font corretti, stati hover funzionanti, moduli specifici, movimento che corrispondeva alle specifiche e elementi CSS dalle linee guida del brand incorporate. Ha anche seguito il posizionamento del brand, la strategia, il tono di voce e le linee guida per i testi di produzione. Era molto buono, ed è stato assistito da un team fondatore incredibile + un po' (vedi prossima sezione).

La cartella del movimento contiene un file JSON che specifica curve di easing e velocità di transizione specifiche per Type. Alla richiesta di visualizzarlo, Claude Design ha prodotto un componente interattivo che puoi cliccare e sentire il sistema di movimento piuttosto che leggerlo.

Per i team fondatori guidati dal design o dall'ingegneria (come Type), il ciclo funziona ancora più stretto. Hanno inserito il kit nel loro editor, cambiato un valore o due, salvato, e stavamo costruendo istantaneamente. Cambia un colore primario: aggiorna una variabile CSS. Cambia una curva di movimento: modifica il JSON. Ricarica in Claude Design e l'intera linea guida si rigenera rispetto ai nuovi valori. Il kit è modificabile in codice, in tempo reale, dalle persone più vicine al lavoro.

Lo stesso kit aperto in Cursor con Opus 4.7. Un prompt: costruiscimi una landing page HTML dal kit atomico.

magic_trick.md

Ecco perché di solito un prompt singolo non fornirà ciò di cui hai bisogno per spedire.

Tutto ciò che il kit agente produce tipicamente è una ricombinazione di ciò che viene inserito: il posizionamento, il tono, i componenti, il movimento. È ciò che il kit è costruito per fare. L'output sarà coerente, brandizzato, spedibile. Tenderà anche verso la mediana di ciò che gli input consentivano. Correttezza e originalità non sono la stessa cosa.

La maggior parte delle persone dimentica il piccolo rialzo alla fine del diagramma sulla lavagna bianca; il trucco magico.

Quando il livello di esecuzione è in gran parte agente, c'è un momento vicino alla fine di un incarico in cui le cose iniziano a convergere verso il centro, proprio quando hai bisogno che facciano il contrario. Quasi mai produce scoperte magiche (a volte mi manca la creatività delle allucinazioni AI).

Per uno studio premium che lavora con fondatori che fanno grandi scommesse, "la mediana" è esattamente ciò che la gente paga per evitare.

È qui che un umano deve tornare con un'idea. Un pensiero creativo originale, reale, che consuma glucosio-bruciante, eccentrico, strano, sudato che non avrebbe potuto essere previsto dagli input.

Il tipo di mossa che inclina il risultato: un concept per un film di lancio basato su una abbuffata di film noir dell'inverno scorso, un momento sublime del prodotto pensato durante una passeggiata, un'idea di campagna ammiccante alla sub-cultura basata su una notte molto tarda fuori, un radicale showstopper sopra la piega ispirato da una minuscola galleria d'arte in cui ci si è imbattuti durante un temporale in un paese straniero, un pezzo di copy per cartellone che colpisce più duramente di più di quanto il sistema avrebbe prodotto da solo.

Internamente lo abbiamo chiamato magic_trick.md, ed è solo per metà uno scherzo.

Il Valore del Vocabolario

Recentemente, Diplo è stato intervistato sull'AI. Nella sua risposta, ha parlato di come i migliori DJ del mondo siano spesso più vecchi di lui a causa del loro vocabolario; la loro conoscenza accumulata della musica.

Per lui, il suo eccellente vocabolario è derivato da anni di alzarsi alle cinque del mattino per frugare tra casse di dischi ai mercatini delle pulci, andare di casa in casa alla ricerca di vinili oscuri, leggere ogni traccia, conoscere ogni bassista su ogni disco.

Ciò che rende grande un DJ sono quegli anni di conoscenza accumulata e l'esperienza accumulata. Entrambi gli permettono di sapere quale disco tirare, in quale stanza, in quale notte. "È ciò che ci rende buoni. Il mio dono è che vengo dallo scavare vecchi dischi."

Un sistema agente ben prodotto è l'equivalente di un'enorme biblioteca di dischi perfettamente incrociata. Incredibile di per sé, e inutile senza capire l'energia di una folla, i feromoni di una stanza, e l'esperienza per fare ciò che nessuno si aspettava e tutti ricordano.

Se il kit atomico è la biblioteca, magic_trick.md è il set che un grande DJ mette insieme per una stanza specifica in una notte specifica. L'idea di ieri non è l'idea di oggi. La combinazione vincente per ogni importante output del brand è un kit agente ben prodotto e un'idea profonda da trucco magico.

Assicurati di lasciare spazio a quel pensiero originale a valle, o rischi di spedire qualcosa di corretto che nessuno ricorda.

Se hai solo l'idea audace e nessun sistema sottostante, spedirai qualcosa di memorabile che non sopravviverà oltre l'annuncio di lancio.

Pensiero sistemico e pensiero originale. Una mano lava l'altra.

HTML & .MD: Da Markdown a markup

Una cosa su cui vale la pena discutere (come ha fatto Nathaniel Whittemore due giorni fa sul suo eccellente podcast, AI Daily Brief) è che pensiamo che HTML sia sempre più il formato giusto per questo tipo di lavoro.

Un componente espresso in HTML strutturato è analizzabile da qualsiasi agente moderno. Un SVG ha la sua logica cotta nella geometria. Un file CSS codifica il linguaggio visivo a livello strutturale. Questi file sono istruzioni su cui un agente può agire direttamente. Un esportazione raster piatta — PNG, JPEG, PDF - può essere guardata ma non costruita.

Quando strutturiamo un sistema come HTML, CSS e SVG, stiamo costruendo per come gli agenti leggono e costruiscono, non solo per come gli umani vedono. Questa distinzione plasma quasi ogni decisione di output che prendiamo.

(Per una grande lettura tecnica su questo, vedi Using Claude Code: The Unreasonable Effectiveness of HTML di @thariq.)

Cosa Ha Cambiato per Noi

Il nostro concetto di kit atomico precede Claude Design. Spingendo in questa direzione dall'inizio di quest'anno, e il nostro saggio Building Brands for Humans and Agents ha esposto le ragioni per rifattorizzare il lavoro sul brand in formati leggibili dagli agenti.

Ciò che sembra significativamente diverso ora è che produrre uno di questi kit bene, alla velocità richiesta da uno sprint, è genuinamente fattibile, e più impattante.

Claude Design ci ha permesso di pensare a un sistema in modo più visivo, verbale, strategico e strutturale. Possiamo lavorare all'interno dello stesso strumento, producendo artefatti nei formati giusti, senza il passaggio di conversione manuale che consumava la seconda metà di ogni progetto. Il lavoro che richiedeva un impegno di 12 settimane nel 2025 può ora (a volte) adattarsi a uno sprint di 4 settimane senza comprimere il valore. Se fatto bene, il valore è effettivamente aumentato.

Il kit con cui un cliente se ne va è generativo, strutturato, a prova di futuro e vivo. I vecchi deliverable erano statici, richiedevano manutenzione manuale ed estremamente limitati nella loro capacità di implementazione immediata.

Cosa Stiamo Vendendo: Mondi Atomici

Quando un kit atomico è il deliverable, il kit non è un asset finito. È un sistema che produce asset finiti.

Questo cambia ciò che viene effettivamente venduto. Ciò che viene venduto è il pensiero codificato che fa sì che ogni futuro artefatto, pagina e prodotto sembri lo stesso brand.

Il kit è un'opera originale derivato dal pensiero originale. Ogni output a valle che un cliente genera da esso eredita quell'originalità.

Jack Dorsey e Roelof Botha hanno recentemente pubblicato "From Hierarchy to Intelligence," sostenendo che la prossima generazione di aziende sarà organizzata attorno a ciò che chiamano un "modello mondiale" - una comprensione continuamente aggiornata, leggibile dalla macchina, del business stesso, abbastanza ricca che l'AI possa agire direttamente su di essa. La loro scommessa è che la comprensione sia il fossato, e che la profondità di quella comprensione si accumula man mano che il sistema funziona.

La stessa cosa si applica al lavoro creativo che facciamo.

Un kit atomico è un modello mondiale del brand. Una comprensione strutturata, leggibile dalla macchina, di cosa sia il brand, per chi sia, come suona e come appare. La profondità di quella comprensione è ciò che lo rende prezioso, e ciò che lo rende durevole.

"Un kit atomico è un modello mondiale del brand."

Come Questo Lavoro Sarà Venduto (Presto?)

Il lavoro creativo tradizionale prezza tempo e materiali: definisci l'ambito, paga per l'output, vai avanti. Se il kit è il prodotto reale, il lavoro a monte è dove si concentra il valore, esattamente come mostra il diagramma sulla lavagna bianca. La relazione in corso assomiglia meno a una ridefinizione dell'ambito per il lavoro di produzione e più al mantenimento dell'accesso a un sistema vivente.

Abbiamo già iniziato a fare versioni di questo. Attraverso Dan Batten, abbiamo costruito un agente di ricerca approfondita personalizzato basato su nodi a cui il team di Little Plains ha accesso esclusivo. Diversi clienti ci hanno chiesto di usarlo. Se fossimo pronti, offriremmo accesso mensile a una tariffa fissa con l'intesa che lo manterremmo e miglioreremmo continuamente. Avrebbero sempre la versione corrente.

Qualcosa di strutturalmente simile potrebbe applicarsi a un sistema di brand. Rimarremmo in cucina a perfezionare la ricetta. I clienti costruiscono sempre dalla versione migliore. Costo iniziale inferiore, licenza continua, qualità continua.

Lo stesso principio si applica al nostro lavoro Flora. Costruiamo flussi di lavoro generativi originali per i clienti (un modo di produrre visivi, un pattern di generazione UI personalizzato, una pipeline di contenuti basata su nodi) e consegniamo quella tecnica come un asset che possono continuare a usare, non solo gli output. Man mano che queste tecniche sono diventate più sofisticate, stiamo esplorando la concessione in licenza dell'accesso e dell'uso.

Non siamo ancora arrivati a un modello di licenza completo per la creatività, ma siamo abbastanza vicini per iniziare a parlarne. Il futuro di come questo lavoro viene acquistato e venduto è più vicino ai prezzi del software che a quelli dell'agenzia. Per noi sarà probabilmente un ibrido: tempo e materiali definiti all'inizio, licenza continua per i sistemi che lasciamo.

Se credi di avere un pensiero originale e idee originali, questo dovrebbe sembrare un vantaggio.

Cerca di essere pagato per la tua mente, non per le tue mani.

Dove Siamo Ora

Abbiamo consegnato molteplici kit atomici nell'ultimo mese. I team fondatori stanno costruendo da essi in tempo reale, su scadenze di lancio reali, che è l'unico test che conta.

Ogni membro del nostro team a tempo pieno usa Claude Design quotidianamente. I nostri copywriter testano il copy all'interno di siti HTML piuttosto che in Google Docs, il che dà una lettura più pulita del conteggio dei caratteri, delle interruzioni di riga e di come la narrativa scorre realmente in situazione. I nostri designer stress-testano i componenti nello stesso ambiente in stesso ambiente in cui verranno distribuiti. Il lavoro è più onesto perché il mezzo è il mezzo.

In breve, il lavoro di definizione a monte; la strategia, la logica di posizionamento, i sistemi visivi e verbali che rendono un brand coerente sta diventando il prodotto reale. Il lavoro successivo è sempre più a valle.

Infine, il lavoro che ci è sempre importato di più (il pensiero creativo, originale) è la parte che potrebbe contare ancora di più in futuro.

Grazie per aver letto!

Se vuoi parlare di queste cose nerd, scrivici a: hello@littleplains.co.

• Emmett & Alex

Emmett Shine e Alex Leiphart sono soci di Little Plains, uno studio di New York che lavora con startup fantastiche su brand, prodotto e i sistemi che tengono insieme entrambi.*