Feedback visivo per agenti AI senza screenshot e spiegazioni prolisse

Chiedi a Claude Code o Copilot di creare un diagramma dell'architettura o un piano di prodotto. L'agente genera un documento HTML interattivo con diagrammi. Ma nel momento in cui vuoi correggere un'etichetta su un blocco o spostare un elemento, diventa tedioso. Devi fare uno screenshot con frecce, oppure descriverlo a testo: "nella terza sezione dal basso, sostituisci il blocco B con C."

L'idea alla base del repository lavish-axi è riportare l'interattività normale in questo processo. Invece di descrizioni testuali, lo strumento apre il file generato nel browser e fornisce strumenti di editing convenienti.

Cosa fa Lavish Editor

Questa è un'utility CLI e un'implementazione del protocollo AXI (Agent eXtension Interface). Lo strumento avvia un server web locale e apre il file HTML generato nel browser.

Selezioni il testo, clicchi sugli elementi, lasci commenti o modifichi diagrammi. Tutte le note vengono raccolte in una coda e inviate all'agente tramite long-polling o hook CLI. La rete neurale riceve selettori CSS precisi e frammenti di testo, quindi capisce rapidamente esattamente cosa deve essere corretto.

Tutto funziona completamente in locale. Nessun cloud di terze parti o invio del codice a server esterni per impostazione predefinita.

Conversione da Mermaid a Excalidraw Board

Se l'agente genera un diagramma Mermaid, Lavish lo converte automaticamente in una board Excalidraw interattiva direttamente nella pagina.

Clicchi sul diagramma, sposti forme, disegni connessioni o modifichi il testo. Poi clicchi invia feedback. Lo strumento genera un riepilogo delle modifiche con un'anteprima visiva, e l'agente aggiorna il codice Mermaid originale nel file.

Allo stesso tempo, l'HTML finale stesso non è inquinato con librerie esterne. Se lo apri in un browser normale senza Lavish, verrà visualizzato il Mermaid standard pulito.

Validazione Automatica del Layout

Un dettaglio interessante: prima di mostrare l'artefatto a una persona, Lavish esegue un controllo interno del layout.

Lo script integrato verifica se il testo ha superato i limiti del contenitore e se i controlli si sovrappongono. Se viene rilevato un problema critico nell'interfaccia, lo strumento invierà un messaggio all'agente per una revisione prima che la pagina aperta catturi la tua attenzione.

Come Funziona Tecnicamente

L'interazione si basa su principi chiari:

• Le sessioni sono legate al percorso canonico del file HTML, gli agenti non hanno bisogno di memorizzare ID.
• L'artefatto viene eseguito in un iframe isolato, lo script di iniezione non rompe i tuoi stili.
• Il feedback viene inviato all'agente in un formato TOON compatto per risparmiare token di contesto.
• La pagina si ricarica automaticamente quando il file viene salvato, mantenendo la posizione di scorrimento.

Per condividere il risultato con i colleghi, il comando export raggruppa immagini e stili in un unico file autonomo. E se hai bisogno di pubblicare rapidamente il risultato online, il comando share lo caricherà opzionalmente su hosting pubblico o protetto da password.

Connessione agli Agenti

Il modo più semplice per aggiungere lo strumento è attraverso il gestore di skill:

npx skills add kunchenguid/lavish-axi --skill lavish

In Claude Code o ambienti simili, apparirà un comando già pronto:

/lavish давайте обсудим план проекта

Per un'integrazione end-to-end in tutte le sessioni di sviluppo, puoi installare l'utility globalmente e abilitare gli hook:

npm install -g lavish-axi
lavish-axi setup hooks

Il comando scriverà un hook SessionStart per Claude Code, Codex, OpenCode e GitHub Copilot CLI. Quando qualsiasi nuova sessione viene avviata, l'agente vedrà immediatamente i processi di revisione attivi.

A Chi Sarà Utile Questo Progetto

L'utility è utile per gli sviluppatori che assegnano attivamente compiti agli agenti AI per creare documentazione tecnica e prototipi di interfaccia. Lo strumento elimina completamente il andare avanti e indietro sul tema "correggi quel blocco a destra" e fa risparmiare token di contesto.