Vai al contenuto principale

Da Loom a pagina web Parte 1 di 3

Registra con Clips, il Loom open source per gli agenti

~5 min di lettura Agg. 24 ago 2026

Cos'è Clips

Clips è un'alternativa a Loom 100% gratuita e open source, costruita da Builder.io. La differenza che cambia tutto: un agente può capire un Clip partendo da un semplice URL. Ogni clip porta con sé metadati, trascrizione e fotogrammi con timestamp. L'agente non legge soltanto cosa hai detto: vede anche cosa hai mostrato.

Clips è open source: se preferisci avere tutto in casa puoi forkarlo e self-hostarlo dal repository ufficiale su GitHub.

Qui sotto il percorso completo, così com'è: dalla registrazione fino al link pronto per l'agente. Lo facciamo tutto dall'estensione Chrome, la via più veloce per registrare direttamente dal browser.

1. Registrati e collega lo spazio di archiviazione

Vai su clips.agent-native.com e registrati, con Google o via email. Alla prima schermata la libreria è vuota: premi "Record your first Clip" per iniziare.

La schermata di registrazione dell'account su clips.agent-native.com
Registrati su clips.agent-native.com per iniziare.
La libreria di Clips vuota, con il pulsante Record your first Clip evidenziato
Libreria vuota: si parte da qui, con “Record your first Clip”.

Prima di registrare devi collegare uno spazio dove salvare le clip: lo dice la schermata stessa.

“Clips is 100% free and open source, so you need to hook up a way to store clips. Connect storage with Builder.io for free-tier storage and AI, or use S3-compatible object storage and your own LLM keys.”

Per andare veloci scegliamo lo spazio gratuito di Builder.io: il free tier include già storage video e crediti AI. (In alternativa puoi collegare uno storage S3-compatibile e le tue chiavi, ma è tutta un'altra configurazione.)

La schermata Connect storage di Clips con l'opzione Use Builder.io free evidenziata
Colleghiamo lo storage: “Use Builder.io (free)”.

Builder.io ti chiede di creare un account: procedi con Google (o GitHub, o email).

La schermata Create An Account di Builder.io con Continue With Google
Creazione account Builder.io: qui facciamo il sign in con Google.

Completi un breve onboarding — scegli come vuoi usare Builder (per il nostro caso va bene "Create Prototypes") e prosegui.

L'onboarding di Builder.io: come vuoi usare Builder, con Create Prototypes selezionato
Onboarding Builder.io: scegliamo l'uso e proseguiamo.

Infine autorizzi l'accesso: Clips chiede il permesso di usare il tuo spazio Builder.io per salvarci le registrazioni.

La schermata Authorize access di Builder.io con la selezione dello Space
Autorizzi l'accesso di Clips al tuo spazio Builder.io.

Fatto: vieni rimandato a clips.agent-native.com/record con lo storage collegato e il recorder pronto a partire.

Clips conferma Builder.io connected e sta avviando il recorder
“Builder.io connected”: storage a posto, recorder in avvio.

2. Installa e configura l'estensione Chrome

Serve un browser basato su Chromium: Google Chrome, Arc, Brave o Edge. Su Firefox e Safari l'estensione non è disponibile.

Attenzione: non andare diretto allo store. Dentro Clips, alla scelta del recorder, clicca "Chrome extension": è quel link che apre la pagina giusta del Chrome Web Store.

La scelta del recorder in Clips con l'opzione Chrome extension evidenziata
In Clips scegli il recorder: clic su “Chrome extension”.

Si apre il Chrome Web Store: aggiungi l'estensione ufficiale "Agent-Native Clips" a Chrome.

La pagina dell'estensione Agent-Native Clips sul Chrome Web Store con il pulsante Add to Chrome
L'estensione ufficiale sul Chrome Web Store: “Add to Chrome”.

Fai il pin dell'estensione così l'icona resta sempre a portata nella barra di Chrome.

Il menu delle estensioni di Chrome con Agent-Native Clips e l'icona del pin
Pinniamo Agent-Native Clips: sempre a un clic di distanza.

Ora torni su Clips: clicca il logo dell'estensione e fai "Sign in to Clips". Clips conferma l'accesso — sei già loggato da quando ti sei registrato — e poi torni all'estensione.

Il popup dell'estensione Clips con il pulsante Sign in to Clips evidenziato
Dal popup dell'estensione: “Sign in to Clips”.
Clips conferma l'accesso avvenuto con il messaggio Signed in
Si torna su Clips, che conferma: “Signed in”. Poi torni all'estensione, pronto.

La prima volta concedi i permessi di microfono e camera. È un consenso una tantum: Chrome ti chiederà comunque cosa condividere a ogni registrazione.

La schermata di Clips che conferma i permessi di microfono e camera concessi
Permessi concessi: “You're all done”, pronti a registrare.

3. La registrazione (qui si gioca tutto)

Apri l'estensione e parti. Ma attenzione, è qui che fai la differenza. Un video è una sequenza di immagini, e l'agente accede proprio a quelle. Più limiti il contenuto allo stretto necessario, più riduci l'area d'errore dell'agente. Mostra solo le schermate che servono. Niente tour panoramici.

Registra avendo già in testa cosa vuoi che l'agente riproduca. Ogni schermata in più è un'occasione in più per fargli sbagliare bersaglio.

Dall'icona dell'estensione scegli cosa catturare — schermo + camera, solo schermo o solo camera — e controlli sorgente, microfono e camera prima di partire.

Il recorder di Clips con le opzioni Screen + cam, Screen only, Camera only e Start recording
Il recorder: scegli sorgente e modalità, poi “Start recording”.

Nel mio caso parto subito da ciò che voglio replicare: un linktree trovato sulla loro pagina ufficiale. Poi passo sul sito di AI Pratika, per mostrare lo stile della piattaforma di riferimento. E mentre registro, descrivo il problema a voce, in italiano: l'abbiamo testato e funziona.

Apri il sito da replicare e premi "Start recording" dal popup dell'estensione.

Il sito da replicare con il popup dell'estensione Clips e il pulsante Start recording evidenziato
Sul sito da replicare, premiamo “Start recording”.

Chrome ti chiede cosa condividere — una scheda, una finestra o l'intero schermo — poi premi Condividi.

Il popup di Chrome per scegliere cosa condividere con Agent-Native Clips
Chrome chiede cosa condividere: scheda, finestra o schermo intero.

Parte la registrazione: vedi l'indicatore REC, il timer e la bolla della camera. Registra i tuoi 45 secondi, poi fermati.

La registrazione in corso: indicatore REC, timer e bolla della camera sul sito
Registrazione in corso: REC, timer e bolla della camera.

Ecco com'è andata la mia, con la spiegazione a voce di quello che voglio ottenere.

La registrazione del video con la spiegazione a voce di quello che voglio ottenere.

4. La generazione del link

Finita la registrazione, aspetti qualche minuto che il video venga processato: Clips sta generando trascrizione e fotogrammi, quelli che poi l'agente andrà a leggere.

Clips mostra il video appena registrato come pronto dopo l'elaborazione, condivisibile come un Loom
Il video pronto dopo l'elaborazione: come un tipico Loom, si può anche condividere.

A quel punto hai due possibilità di condivisione. La prima è il classico link per una persona. Ma quella che ci interessa è la seconda: il link da condividere con un agente.

Quel secondo link è il cuore di tutto. Contiene il contesto per l'agente: i metadati del video, il collegamento alla trascrizione e ai fotogrammi. È esattamente quello che mancava a Loom.

Come prendere il link corretto, quello per l'agente AI, da condividere
Come prendiamo il link corretto da condividere con il nostro agente AI.
Da brief confuso a UX/UI completa Un brief vago diventa un’app navigabile. Spot prodotto da una foto Una foto diventa uno spot animato, senza codice. Far guardare i video a Claude Claude guarda i tuoi video e li trasforma in testo. Higgsfield in Claude Code Genera immagini e video mentre programmi in Claude Code. Da un Loom a una pagina web Un video schermo diventa una pagina web, senza codice. Video Shorts con NotebookLM Le tue fonti diventano uno short verticale. Landing luxury su Lovable Landing page di lusso con un solo prompt. Excalidraw in locale Excalidraw gratis sul tuo computer, senza codice. Mistral OCR nel flow Estrai testo dai documenti con Mistral OCR. Claude SEO nel terminale 25 skill SEO gratis dentro Claude Code. Google Search Console dentro Claude Code I dati di Search Console dentro il terminale. Routine di Claude Code Claude che lavora da solo, a computer spento. Clonare una landing in React con v0 Clona una landing reale in codice React. Context economy con Claude Lavora leggero e non bruciare i limiti di Claude. Dal prompt alla skill auto-evolutiva Skill Claude che imparano dai tuoi errori. Da NotebookLM a Canva: presentazioni Slide da NotebookLM, finalmente editabili in Canva. La mappa per capire ogni tool AI 12 categorie per incasellare qualsiasi tool AI. PNG trasparenti con ChatGPT PNG con trasparenza reale, non la scacchiera finta. Infografiche animate con Gemini Infografiche che si animano in loop con Gemini. Ricerca di mercato con Deep Research Deep Research come tuo analista di mercato. Farti citare dai motori AI (AEO) Diventa una fonte che ChatGPT e Perplexity citano.