Come creare video di confronto prima e dopo
Mostra i miglioramenti con registrazioni dello schermo prima e dopo. Impara a pianificare, registrare e montare confronti che rendono evidente il cambiamento.
Come creare video di confronto prima e dopo
Alcuni miglioramenti sono difficili da spiegare e facili da mostrare. Una pagina che prima impiegava otto secondi a caricarsi ora ne impiega uno. Una dashboard affollata è diventata leggibile. Un checkout confuso ha perso tre passaggi. Descrivere questi cambiamenti a parole richiede un paragrafo; mostrarli richiede sei secondi di video.
I confronti prima/dopo sono tra i formati più persuasivi che puoi realizzare con un registratore dello schermo, e anche tra quelli più facili da sbagliare. Se le due registrazioni non combaciano, lo spettatore spenderà la propria attenzione sulle differenze che non volevi mostrare invece che su quella che ti interessava.
Questa guida spiega come pianificare, registrare e montare video di confronto in Recorded, così che sia il miglioramento a parlare.
Quando usare un video di confronto
- Miglioramenti di performance: tempi di caricamento, tempi di build, velocità di rendering, durata della sincronizzazione
- Redesign: un nuovo layout, una nuova navigazione o un nuovo stile accanto a quello vecchio
- Modifiche al flusso di lavoro: sette clic ridotti a due
- Correzioni di bug: prima il comportamento difettoso, poi quello corretto
- Prima e dopo del tuo lavoro: pulizie di design, refactoring, migrazioni, riscritture di contenuti
Se la tua modifica è invisibile sullo schermo — un refactoring backend con output identico — un video di confronto non aiuta. Usalo quando la differenza è qualcosa che lo spettatore può davvero vedere.
La regola d’oro: cambia una cosa sola
Tutta la forza persuasiva di un confronto nasce dal fatto che, a parte il miglioramento, tutto è rimasto uguale. Le due registrazioni devono quindi condividere:
- Le stesse dimensioni della finestra e la stessa risoluzione dello schermo
- La stessa modalità di cattura e lo stesso frame rate
- Lo stesso stato di partenza (stessa pagina, stessi dati, stesso account)
- Le stesse azioni, nello stesso ordine e allo stesso ritmo
- Lo stesso tema — non registrare il “prima” in modalità chiara e il “dopo” in modalità scura
Qualsiasi discrepanza dà allo spettatore un motivo per dubitare del risultato. Blocca tutti questi parametri prima di premere registra la prima volta.
Pianificare il confronto
- Scrivi lo script esatto delle azioni. Non la narrazione: i clic. “Apri la dashboard, clicca su Report, seleziona gli ultimi 30 giorni, clicca su Esporta.”
- Decidi cosa stai misurando. Tempo, numero di passaggi, numero di errori o chiarezza percepita. Dillo esplicitamente nel video.
- Prepara dati di test identici. Un account demo con gli stessi record in entrambi gli ambienti elimina l’obiezione “ma lì c’erano meno dati”.
- Fissa una dimensione della finestra. Regolala una volta e non toccarla tra una ripresa e l’altra.
- Prova entrambe le versioni. Incespicare in una ripresa ed essere fluidi nell’altra esagera silenziosamente il tuo risultato.
Registrare entrambe le versioni
Registra il “prima” e il “dopo” come due registrazioni separate, non come un’unica ripresa lunga. File distinti sono più facili da tagliare, allineare e rifare se qualcosa va storto.
- Configura la cattura in Recorded — scegli lo stesso monitor, finestra o area per entrambe
- Scegli un frame rate e mantienilo in entrambe le riprese
- Registra la versione “prima” seguendo esattamente il tuo script di azioni
- Cambia ambiente — la nuova build, il nuovo design, l’URL di staging
- Verifica che la finestra abbia ancora le stesse dimensioni
- Registra la versione “dopo” con lo script di azioni identico
Suggerimento: se stai confrontando i tempi di caricamento, avvia la registrazione un attimo prima del clic che avvia il caricamento e fermala un attimo dopo la fine. Quei fotogrammi in più rendono molto più semplice tagliare a un punto di partenza equo.
Montare il confronto
Taglia allo stesso punto d’inizio
Apri ogni registrazione nell’editor e taglia entrambe in modo che inizino esattamente nello stesso momento scatenante, di solito il fotogramma del clic. Un confronto che parte mezzo secondo prima da un lato sembra più lento anche quando non lo è.
Etichetta chiaramente i due lati
Usa sovrimpressioni di testo per marcare Prima e Dopo sullo schermo. Mantienile:
- Nella stessa posizione in entrambe le clip
- Visibili per l’intero segmento, non solo il primo secondo
- Ad alto contrasto, così da sopravvivere alla compressione e agli schermi piccoli
Aggiungere un cronometro o un contatore di passaggi come seconda sovrimpressione rende il miglioramento misurabile, non solo percepito.
Usa lo zoom per guidare l’attenzione
Se la differenza avviene in un angolo dello schermo — un indicatore di caricamento, un contatore, un menu — aggiungi un effetto zoom nello stesso momento in entrambe le clip. Zoomare solo da un lato rompe la simmetria: replica le regioni di zoom su entrambe le registrazioni.
Attenzione ai cambi di velocità
Il cambio di velocità è ottimo per i tutorial e rischioso per i confronti. Se acceleri una delle due clip, lo spettatore non può più fidarsi dei tempi. Se devi comprimere un’attesa lunga, applica esattamente la stessa velocità a entrambe le clip e dichiaralo a schermo.
Scegli un layout
- Sequenziale: prima il “prima”, poi il “dopo”. Semplice, onesto e adatto a qualsiasi formato: la scelta predefinita più sicura.
- Affiancato: entrambe le clip insieme, ideale quando le durate sono simili e le schermate restano leggibili a metà larghezza.
- Stacco sul momento: mostra entrambe fino all’istante chiave, poi alterna. Efficace quando le differenze di performance sono clamorose.
Per i formati verticali o social, impila le due clip sopra e sotto invece che a sinistra e a destra, così ciascuna mantiene dimensioni leggibili.
Restare onesti
I video di confronto sono marketing, ma sono anche prove. Un risultato che viene messo in discussione e non regge costa più fiducia di quanta il video ne abbia guadagnata.
- Non svuotare la cache solo in una delle due esecuzioni
- Non eseguire il “prima” su una connessione limitata
- Non saltare di nascosto un passaggio nel “dopo”
- Dichiara le condizioni: quale macchina, quale rete, quanti dati
- Mostra un caso tipico, non il tuo tentativo più fortunato
Esportare e condividere
- MP4 per qualsiasi luogo in cui incorpori o carichi un video
- GIF per confronti brevi in un README, un changelog o un messaggio di chat: resta entro pochi secondi
- Ritaglio verticale per le piattaforme social, con il layout impilato descritto sopra
Dai al file un nome che sopravviva al download: checkout-flow-before-after-2026-09.mp4 è meglio di confronto-finale-v3.mp4.
Checklist rapida
[ ] Stesse dimensioni finestra, risoluzione, frame rate e tema in entrambe le riprese
[ ] Stesso stato di partenza e stessi dati di test
[ ] Script di azioni identico, provato per entrambe le versioni
[ ] Entrambe le clip tagliate allo stesso fotogramma di innesco
[ ] Sovrimpressioni Prima/Dopo nelle stesse posizioni
[ ] Effetti zoom replicati su entrambe le clip
[ ] Nessun cambio di velocità applicato a un solo lato
[ ] Condizioni indicate a schermo o nella descrizione
Conclusione
Un buon video di confronto non sostiene che qualcosa è migliorato: lascia che siano gli spettatori a vederlo e a giudicare. Allinea le due registrazioni il più possibile, cambia soltanto ciò che stai dimostrando ed etichetta chiaramente il risultato. La prossima volta che rilasci un redesign, un miglioramento di velocità o un flusso più semplice, registra entrambi i lati prima che la vecchia versione sparisca. È l’inquadratura che non puoi più recuperare.