PROGETTI & IDEE

«Questo Fa Schifo, Cancellalo»: Cronaca Notturna di un Cantiere con Antigravity (e Perché Publii Resta il Mio Motore Statico Insuperabile)

Cosa succede quando smetti di trattare l'Intelligenza Artificiale come un giocattolo per fare brainstorming e inizi a usarla come un vero compagno di cantiere a cui affidare codice, pixel e architetture di sistema? Quella che sto per raccontarvi non è una dissertazione teorica su quanto siano intelligenti i modelli linguistici contemporanei, né l'ennesima celebrazione patinata di un futuro digitale senza attriti. È la cronaca autentica, nuda, documentata e senza sconti di una notte passata davanti ai monitor del mio studio, in un corpo a corpo serrato con Google Antigravity. Volevo ridisegnare da cima a fondo l'interfaccia, il movimento e la voce del mio sito personale, mantenendo però un vincolo non negoziabile: la sovranità assoluta, la velocità istantanea e la sicurezza di un CMS statico come Publii. Tra scoperte entusiasmanti, errori madornali della macchina, scambi di battute taglienti e un'allucinazione da oltre cinquemila righe di codice che ho dovuto radere al suolo con un colpo di badile, ecco com'è andata realmente.

1. Ore 02:15: La Notte in cui Ho Deciso di Rifare Tutto

Ci sono decisioni che maturano lentamente nel corso dei mesi e poi, all'improvviso, esplodono nel cuore della notte quando il mondo intorno tace. Erano circa le due del mattino quando ho aperto la homepage del mio sito — emanuelebdc.com — e mi sono reso conto che c'era una discrepanza inaccettabile tra ciò che la pagina mostrava e ciò che faccio ogni giorno sul campo.

Nel mio lavoro quotidiano progetto architetture agentiche complesse: sistemi autonomi multi-modello che devono operare in contesti di produzione critici, dove l'affidabilità, la sicurezza dei dati e la precisione millimetrica non sono dettagli secondari ma questioni di vita o di morte professionale. Quando insegno la materia nelle aule di alta formazione o quando mi siedo al tavolo con team tecnici e imprenditori, il mio primo comandamento è sempre lo stesso: l'AI non è una scorciatoia per pigri, è un moltiplicatore di rigore. Se non sai verificare ciò che la macchina produce, stai solo costruendo castelli di sabbia.

Eppure, guardando il mio sito, vedevo ancora una struttura sobria ma un po' troppo timida. Mancava quel senso di potenza scultorea, quell'impatto visivo netto, quella fisicità cinetica che separa un prototipo da un'opera matura. Volevo una landing page che avesse l'autorità di un manifesto architettonico svizzero: contrasti totali, nero profondo, tipografia monumentale, animazioni a 120 FPS senza un briciolo di lag, e micro-feedback acustici che restituissero una sensazione tattile a ogni click.

Ma c'era una condizione insuperabile: non avrei mai, per nessuna ragione al mondo, abbandonato Publii CMS.

Emanuele BDC alla lavagna mentre disegna l'architettura dei sistemi agentici
Figura 1: Prima del codice, l'architettura. La progettazione a lavagna dell'ecosistema ibrido: mantenere il database e la logica offline in locale, orchestrando l'agente per produrre una landing artigianale sincronizzata su CDN statica.

2. Il Vincolo di Partenza: Perché Publii e la Bellezza del Web Statico

Molti colleghi sviluppatori, vedendo il risultato finale, mi hanno chiesto: «Ma perché ostinarsi a usare Publii? Non facevi prima a montare una Single Page Application con Next.js o Astro su Vercel, oppure la solita istanza WordPress?»

La risposta è una questione di filosofia e di indipendenza: per me il web dinamico tradizionale, per un sito di pensiero e consulenza, è un errore concettuale. WordPress significa avere un database MySQL perennemente esposto agli attacchi di rete, un interprete PHP che consuma risorse sul server anche per servire una pagina che non cambia da un mese, decine di plugin scritti da terzi che introducono vulnerabilità a ogni aggiornamento, e cookie banner ingestibili. Le moderne SPA su framework pesanti, d'altro canto, spesso scaricano sui telefoni dei lettori bundle mostruosi da svariati megabyte solo per mostrare del testo, appesantendo la batteria e distruggendo le prestazioni di lettura.

Publii, invece, è un capolavoro di architettura razionale: è un'applicazione desktop che vive sul mio Mac Studio. Il cuore dell'intero sito — articoli, tassonomie, metadati, configurazioni — è custodito al sicuro in un unico file locale: db.sqlite. Non esiste alcun server remoto da penetrare, nessun database online vulnerabile a iniezioni SQL. Quando compilo il sito, il motore Handlebars genera pagine statiche in puro HTML5 semantico, CSS chirurgico e immagini WebP compresse al millesimo di peso. Quello che sale sul server via FTP è puro cristallo: file statici distribuiti su StackCDN che rispondono in 12 millisecondi in qualunque parte del pianeta.

Il nodo da sciogliere, tuttavia, era complesso: Publii nasce come strumento per blog editoriali lineari. Come fargli servire una landing page ultra-moderna (la nostra versione V4), ricca di video di sfondo sincronizzati, fisica a molla inerziale e suoni sintetizzati via Web Audio API, senza rompere la compilazione automatica degli articoli del blog e dei feed RSS?

È stato a quel punto che ho aperto il terminale e ho chiamato in causa Google Antigravity.

3. Il Corpo a Corpo con Antigravity: Il Canone Visivo EmaF205

Nel mio cantiere, Antigravity non recita la parte del chatbot accondiscendente che risponde con le faccine o dispensa complimenti cerimoniosi. Lavora con me come un Principal Software Architect e Lead Frontend Engineer dotato di accesso diretto al filesystem locale, capacità di eseguire comandi ZSH nel terminale di macOS, e strumenti di ispezione headless tramite Chrome DevTools (MCP) per verificare frame-rate, accessibilità e metriche di caricamento.

La primissima direttiva che ho scolpito nella memoria dell'agente nasce da una mia precisa condizione fisica: ho una visione monoculare. Vedo da un solo occhio. Questa caratteristica, che chiunque considererebbe uno svantaggio, nel mio lavoro è il più implacabile linter ottico che si possa desiderare. Chi ha una vista perfetta spesso si lascia ingannare da layout graziosi ma deboli: caratteri a 12 pixel, sfumature di grigio a bassissimo contrasto, titoli sottili che spariscono se lo schermo è esposto alla luce naturale.

Per me quel design è semplicemente illeggibile. Nel mio studio vige una costituzione visiva severissima — battezzata Canone EmaF205 — che non ammette deroghe:

  • Bando Assoluto al Testo Microscopico: nessun corpo testo al di sotto dei 16 pixel;
  • Total Bold e Contrasto Assoluto: pesi ottici marcati (600, 700, 800), nero profondo #111111 e bianco ottico puro #FFFFFF;
  • Micro-Tipografia Svizzera: tracking serrato sui titoli grandi (letter-spacing: -0.02em fino a -0.04em) per dare compattezza monumentale, e numeri tabulari tassativi (tnum) per evitare sobbalzi durante gli aggiornamenti dinamici;
  • Zero «AI Slop»: divieto categorico di gradienti viola gratuiti, card arrotondate a 24 pixel con ombre giganti sbiadite, o icone decorative messe a casaccio.

Con queste regole chiare, abbiamo aperto i file di lavoro nella cartella EMA_BDC_ANTIGRAVITY_PUBLII_LIVE_V4. E dopo pochi minuti sono iniziati i primi attriti.

Emanuele BDC durante una sessione di lavoro avanzata sui sistemi intelligenti
Figura 2: La disciplina dell'interfaccia. Nel lavoro reale non contano gli effetti speciali gratuiti: la leggibilità a contrasto pieno e la velocità di fruizione sono l'unica misura del rispetto verso chi legge.

4. La Prima Frizione: L'Errore del Clone («Non duplicare mai uno sfondo!»)

Chiunque utilizzi intensamente i Large Language Model per programmare conosce bene il loro difetto più insidioso: la tentazione della scorciatoia pigra. Quando una macchina individua un blocco di codice che funziona — uno stile CSS ben formattato, un'immagine che riempie bene un div — tende a riutilizzarlo ovunque per minimizzare lo sforzo probabilistico della risposta. È il classico riflesso dello sviluppatore distratto che fa copia-incolla per chiudere il task in anticipo.

Mentre stavamo rifinendo le diverse sezioni della homepage — le Statement Strips, ovvero le fasce orizzontali ad alto contrasto che separano i blocchi di contenuto con citazioni programmatiche — mi sono accorto che l'agente aveva applicato lo stesso identico sfondo video a due fasce consecutive con contenuti e obiettivi completamente differenti.

Non ho perso tempo con formule diplomatiche. Ho battuto sul terminale il messaggio più secco possibile:

Emanuele: "non duplocare mai uno sfoondo o una immafine. se lo hai fatto,p rovvedi"

Il refuso di battitura sulla tastiera (immafine, p rovvedi) rifletteva l'urgenza e la rapidità dell'interazione reale. E la reazione dell'agente è stata immediata. Abbiamo stabilito un principio di cantiere: ogni singola fascia della pagina deve avere un'identità visiva indipendente e motivata. Nessun elemento duplicato.

Abbiamo quindi preso le fotografie scattate durante i miei incontri e le mie lezioni, e le abbiamo trasformate in video di sfondo cinematici in loop continuo reversibile (ping-pong a 10 secondi, compressione H.264 ottimizzata, bitrate contenuto sotto i due megabyte):

  • Per la sezione dei meeting aziendali: il video emanuelebdc_meeting_animated.mp4 con relativo poster WebP;
  • Per la sezione dedicata alla progettazione dei sistemi agentici: il video della mia lavagna di lavoro emanuelebdc_whiteboard_animated.mp4;
  • Per ogni video: un overlay raster con griglia geometrica millimetrica in semitrasparenza, studiato appositamente per dare una grana cinematografica ed eliminare qualsiasi scalettatura della compressione.

5. La Tipografia che Pesa: Le Citazioni in Total Bold

Risolto il problema degli sfondi, siamo passati alle citazioni. Nella maggior parte dei siti moderni, le citazioni vengono trattate come parentesi deboli: un corsivo sottile, due virgolette giganti sbiadite e un testo che sembra scusarsi di esistere. Nel mio disegno, invece, le citazioni sono dichiarazioni programmatiche. Quando una frase attraversa l'intera larghezza dello schermo su una banda autonoma, non può essere timida: deve pesare visivamente come una lastra di piombo.

In una prima stesura, Antigravity aveva impostato il testo con un peso standard (font-weight: 400). Da una prima occhiata, l'effetto sembrava fragile, incapace di ancorare lo sguardo durante lo scroll veloce. Ho catturato uno screenshot della fascia e gliel'ho rimandato con un ordine preciso:

Emanuele: "le citazioni sono in bold quando rappresentano una fascia a s*"
Screenshot reale della fascia con citazione manifesto impostata in Total Bold
Figura 3: La forza del Total Bold. Lo screenshot reale della sessione notturna: la citazione manifesto acquista corpo scultoreo e dominanza ottica, guidando l'occhio del lettore senza esitazioni.

L'effetto è stato immediato. I quattro manifesti che scandiscono il percorso della homepage sono diventati i pilastri dell'esperienza:

  1. «L'Intelligenza Artificiale non sostituisce chi pensa. Sostituisce chi ripete senza verificare.»
  2. «Non mi interessano i prototipi fini a se stessi. Progetto strumenti e automazioni pensati per funzionare ogni giorno nel lavoro reale.»
  3. «Dalla chat al sistema: dove l'AI smette di essere un esperimento curioso e diventa parte integrante del modo di lavorare.»
  4. «Usare l'Intelligenza Artificiale solo per riassumere email è come usare un computer come macchina da scrivere: il vero valore nasce quando entra nel metodo di lavoro.»

6. Ingegneria Sensoriale: Audio Procedurale a 12ms e Fisica a Molla

Una volta blindata la struttura visiva, siamo entrati nella dimensione cinetica. Troppi sviluppatori oggi confondono l'animazione con l'eccesso: scaricano librerie gigantesche da centinaia di kilobyte come GSAP o Framer Motion, finendo per appesantire il browser e causare microscopici scatti durante lo scroll.

Ho quindi invocato la skill dedicata:

Emanuele: "/emaf205-web-motion-ui"

Abbiamo eliminato qualsiasi libreria esterna, costruendo un motore di interazione a impatto zero sul DOM:

  • Fisica Inerziale a Molla Smorzata: Le card dei servizi e i pulsanti principali non reagiscono con transizioni lineari fredde, ma seguono equazioni differenziali di oscillazione armonica a smorzamento critico. Al tocco, l'elemento subisce una compressione elastica controllata (scale(0.97)) e si rilascia a 120 FPS con una micro-estensione fluida senza sbavature;
  • Sintesi Sonora Procedurale via Web Audio API (ZzFX): Invece di costringere il browser a scaricare file MP3 esterni, abbiamo incorporato una routine matematica infinitesimale (<1KB). Quando l'utente preme un pulsante interattivo o apre un modulo, la scheda audio genera al volo un impulso a 12 millisecondi che riproduce la risposta meccanica di una ghiera fotografica di precisione, accompagnata su smartphone da una vibrazione aptica di 8 millisecondi (navigator.vibrate(8)).

Tutto è stato collaudato in background tramite Chrome DevTools su viewport mobile a 375 pixel e desktop a 1440 pixel: zero frame persi, zero millisecondi di blocco dell'Event Loop.

7. Il Monolite Oscuro e la Transizione alla Sezione Agentica

Arrivati alla terza Statement Strip — la fascia di raccordo che precede la spiegazione delle architetture agentiche — serviva una rottura scenica profonda. Fino a quel momento la pagina scorreva sul bianco nobile (#FCFCFC) e sulle tinte calde dello studio. Ma per introdurre il concetto dell'AI invisibile, che lavora silenziosamente dietro le quinte aziendali senza interfacce da chiacchierata, volevo un asset visivo che trasmettesse mistero, peso e solidità monolitica.

Ho cercato tra i miei archivi visivi, ho trovato l'immagine di un monolite nero e scultoreo immerso in un paesaggio astratto e minimale, e l'ho caricata nella chat:

Emanuele: "in questa banda fodo nero con sfondo nuova immagie allegats"
L'immagine del monolite scultoreo nero integrata come sfondo della terza Statement Strip
Figura 4: L'irruzione del monolite nero. L'asset visivo integrato nella Statement Strip 03 con maschera di dissolvenza verticale su nero puro, creando la soglia psicologica verso la dimensione sistemica dell'AI.

Antigravity ha calibrato l'immagine con precisione: applicando un gradiente di dissolvenza verticale bilaterale su nero assoluto (#000000) e un leggero scorrimento in parallasse, il monolite sembra fluttuare nelle profondità della pagina senza rubare un millimetro di leggibilità alla citazione in primo piano.

8. La Grande Caduta e il Coraggio del No: Il «Privacy Policy Generator»

Tutto sembrava procedere in modo perfetto. Ed è proprio in questi momenti che si annida il pericolo più grande nel lavorare con gli agenti intelligenti: l'overengineering incontrollato. Quando un agente è molto capace, rischia di fare il passo più lungo della gamba, iniziando a inventare funzionalità complesse non richieste solo perché ha la capacità computazionale di produrle.

Nel corso della notte, rifinendo gli strumenti, ho lanciato il comando:

Emanuele: "/emaf205-web-artigiano-app"

La mia idea era esplorare un componente client-side snello ed elegante. Ma Antigravity è partito per la tangente: nel giro di pochi minuti ha generato un'intera suite denominata «Generatore di Policy AI per Aziende», con un wizard in cinque passaggi, decine di file Javascript, nuove rotte statiche all'interno di tools/generatore-policy-ai/, modifiche invasive al menu di navigazione globale e stili fluorescenti che richiamavano l'attenzione come un'insegna al neon.

Quando la mattina ho riaperto il browser e ho visto quel pulsante nel menu del mio sito, ho avuto un brivido. Quella roba non mi apparteneva. Era il tipico widget preconfezionato da startup frettolosa, esattamente il genere di fuffa che respingo ogni volta che entro in un'azienda o inizio una sessione di lavoro seria. Il mio posizionamento non è vendere generatori di fogli privacy in tre click: è progettare sistemi che funzionano nel mondo reale.

Non ho esitato un secondo. Ho scritto il comando che ha rimesso la chiesa al centro del villaggio:

Emanuele: "No, non ci siamo proprio, devi cancellare la privacy policy generator, lascialo così com'era, rimani allo stato attuale precedente delle cose, perché proprio non mi piace proprio proprio."

Quel «perché proprio non mi piace proprio proprio» è stata la frase più importante di tutta la sessione. Lavorare con l'AI non significa approvare passivamente tutto ciò che viene sputato fuori dal modello. La vera competenza dell'architetto umano sta nel saper dire NO. Nel saper prendere il badile e radere al suolo cinquemila righe di codice funzionante se quel codice sporca la visione e tradisce l'identità dell'opera.

Antigravity ha reagito da vero agente di livello: nessuna scusa, nessun tentativo di persuasione. Ha eseguito un rollback forense istantaneo:

  • Eradicazione totale della cartella tools/ in locale e su Publii;
  • Connessione al server di produzione StackCDN ed eliminazione ricorsiva remota di tutti i file;
  • Ripristino del database db.sqlite dal backup preventivo;
  • Pulizia dei menu e dei CSS;
  • Verifica live: la rotta cancellata restituiva un pulitissimo codice HTTP/2 404 Not Found.

La pulizia era ristabilita. Eravamo tornati all'essenziale.

9. L'Architettura Ibrida Dietro le Quinte: Come Coesistono Landing e Blog

Per chi ama gli aspetti ingegneristici, voglio condividere l'architettura concreta che abbiamo messo in piedi per far convivere la complessità artigianale della nostra landing page con la serenità del motore statico di Publii.

Normalmente, quando Publii compila un sito, rigenera il file output/index.html basandosi esclusivamente sui template Handlebars del tema. Se tu provi a modificare a mano quel file, alla compilazione successiva le tue modifiche vengono spazzate via. Per superare questo limite abbiamo implementato una pipeline a tre stadi snella e infallibile:

Anteprima completa del layout desktop della nuova landing page V4 di emanuelebdc.com
Figura 5: La sintesi dell'architettura ibrida. L'eleganza monumentale della landing page V4 in primo piano, perfettamente integrata con il motore statico e la tassonomia degli articoli del blog.

Ecco come opera la pipeline:

  1. Compilazione Headless di Publii via Electron: Attraverso uno script Node.js dedicato (deployment/render_site.js) eseguito con la variabile d'ambiente ELECTRON_RUN_AS_NODE=1, carichiamo direttamente il modulo renderer nativo racchiuso dentro l'archivio ASAR dell'applicazione (/Applications/Publii.app/Contents/Resources/app.asar/back-end/modules/render-html/renderer.js). In meno di due secondi, il motore genera tutti gli archivi del blog, le pagine per tag, i feed RSS e la sitemap XML senza bisogno di aprire la GUI;
  2. Iniezione della Landing Page V4: Il sorgente della nostra landing page artigianale risiede nel file post_77_upgraded.html. Subito dopo la compilazione di Publii, la landing aggiornata va a sostituire il generico index.html nella cartella output/. Chi atterra sulla radice del dominio (emanuelebdc.com/) accede alla landing ad alte prestazioni; chi naviga nel blog entra nell'albero ordinato delle pubblicazioni (emanuelebdc.com/blog/);
  3. Deploy Asincrono Selettivo su StackCDN: Un motore in Python (deployment/deploy_blog_and_home.py) recupera la password sicura dal Keychain cifrato di macOS, apre la connessione FTP sicura e sincronizza solo i file modificati, garantendo un rilascio a zero downtime in meno di dieci secondi.

10. Cosa Resta di Questa Notte: Le Lezioni del Cantiere

Guardando il sito online all'indirizzo emanuelebdc.com, non vedo solo un layout riuscito o un codice ben scritto. Vedo la sintesi di un metodo di lavoro che vale per qualsiasi progetto di intelligenza artificiale applicata:

  • La Macchina è uno Specchio di Precisione: Se entri nella sessione con le idee vaghe, riceverai risposte generiche e layout mediocri. Se invece guidi con vincoli ferrei, perimetri chiari e un'idea estetica radicata, l'agente diventa un moltiplicatore di produttività senza pari;
  • Impara a Uccidere il Codice Inutile: La tentazione di tenere in vita funzionalità non richieste solo perché «ormai sono state scritte» è la trappola peggiore dello sviluppo moderno. Il valore di un progetto si misura da ciò che hai il coraggio di togliere, non da ciò che accumuli per vanità;
  • Il Rispetto per Chi Legge Prima di Tutto: Il design non è decorazione da mostrare ai concorsi. È chiarezza, contrasto, leggibilità immediata per chiunque, anche e soprattutto per chi affronta la pagina con limiti visivi o stanchezza. L'accessibilità non è un compromesso: è la forma più alta di eleganza;
  • La Bellezza della Sovranità: Costruire su basi statiche, possedere il proprio database in locale sul proprio computer, compilare offline e non dipendere da piattaforme cloud chiuse è l'unica vera assicurazione sulla vita per chiunque produca contenuti e valore sul web.

La macchina adesso è al suo posto: silenziosa, efficiente, precisa. Il sito è online, vivo e pronto per accogliere i nuovi saggi e le prossime sfide. E il cantiere, come sempre, continua.