Il codice sulle slide è quasi sempre uno screenshot. Sta bene e non si muove: o mostri la versione finita, o allinei tre immagini e speri che il pubblico colga da solo la differenza.

Keynote sa fare di meglio. Spostamento magico interpola fra due slide e, se il codice è testo vero anziché un'immagine, anima le singole parole: una riga che scende per fare spazio, un valore che cambia, un blocco intero che compare mentre tutto il resto si sposta per accoglierlo.

Sono due slide e una transizione. Niente After Effects, nessuna traccia video.

Perché uno screenshot non può farlo

Spostamento magico funziona abbinando gli oggetti di due slide consecutive e animando il passaggio dagli uni agli altri. Un'immagine è un oggetto solo. Keynote può spostarla, ridimensionarla, dissolverla, ma non può entrarci dentro e animare la quarta riga, perché per Keynote una quarta riga non esiste.

Il testo è un'altra cosa. Un riquadro di testo contiene parole, e Spostamento magico sa abbinarle una per una.

Tutta la tecnica dipende quindi dal portare in Keynote codice colorato sotto forma di testo. Riscriverlo e colorarlo a mano è una pena. Incollarlo dall'editor perde l'evidenziazione, perché gli editor mettono negli appunti testo semplice.

Far uscire il codice colorato come testo

Codeshot esporta due cose. Il PNG è l'immagine già composta: sfondo, cornice della finestra, ombra. L'RTF è il codice da solo, come testo colorato.

Codeshot con il formato impostato su RTF, con i pulsanti Copia RTF e Salva RTF

Imposta Formato su RTF e premi Copia RTF. Nell'RTF non c'è nessuno sfondo, ed è voluto: lo sfondo lo mette la slide, e un secondo dietro al testo sarebbe solo d'intralcio.

Vale la pena conoscere un dettaglio, perché è quello che di solito rovina il codice incollato: l'RTF indica i font per nome, e il monospaziato di sistema ha un nome privato che le altre app non riescono a risolvere. Quando non ci riescono sostituiscono un font proporzionale, e l'allineamento in colonne — ciò che fa leggere il codice come codice — crolla. Codeshot in uscita mette al suo posto Menlo, così non succede. Se il font l'hai scelto tu, il suo nome è già pubblico e passa intatto.

Costruire le due slide

Incolla in una slide. Comando-V. I colori arrivano con il testo. Ridimensiona pure il riquadro, ma non riscrivere nulla: Spostamento magico si basa sulle parole stesse.

Duplica la slide. Selezionala nel navigatore e premi Comando-D. Ora hai due slide identiche.

Modificane una. O aggiungi alla seconda le righe che ancora non c'erano, oppure — spesso più comodo — incolli lo snippet finito e cancelli righe dalla prima finché non mostra lo stato precedente. Tutto ciò che lasci intatto è quello che Spostamento magico animerà; tutto ciò che aggiungi o togli è quello che farà comparire o sparire in dissolvenza.

Conviene lavorare a ritroso. Spostamento magico si basa sulle parole stesse, quindi le righe che devono restare ferme vanno lasciate identiche su entrambe le slide. Cancellare da un duplicato lo garantisce; riscrivere una riga a mano è il modo di ritrovarsi con una parola che in silenzio non viene abbinata e salta invece di muoversi.

Due slide nel navigatore di Keynote, la seconda con più righe di codice della prima

L'ordine conta: la transizione appartiene alla slide da cui esci, quindi costruisci prima lo stato prima.

L'unica impostazione che fa la differenza

Seleziona la prima slide, apri la barra laterale Animazione e aggiungi Spostamento magico.

Le impostazioni di Spostamento magico in Keynote, con durata 2 secondi e Abbina impostato su Per parola

Poi porta Abbina dal valore di default a Per parola.

È l'impostazione da cui dipende l'intero effetto. Lasciata com'è, Spostamento magico tratta il riquadro di testo come un oggetto unico e lo dissolve: ottieni una sfocatura fra due stati invece di codice che si muove. Per parola gli dice di abbinare le parole di ciascuna slide e di animarle una per una, ed è questo che fa scorrere le righe e cambiare i valori sul posto.

Una durata attorno a 1,5-2 secondi si legge bene con il codice. Più veloce e nessuno riesce a seguire quale riga si è spostata, che è poi l'unico motivo per cui lo si fa.

Dissolvi oggetti senza corrispondenza va lasciato attivo. È quello che fa comparire le righe nuove e sparire quelle rimosse, invece di farle scattare di colpo.

Costruire una sequenza

Tre slide, due spostamenti magici, e puoi accompagnare il pubblico dentro un refactoring un passo alla volta: la versione ingenua, la funzione estratta, la forma finale. Ogni transizione porta con sé le righe rimaste uguali, così l'occhio resta ancorato a ciò che è davvero cambiato.

Tieni piccolo ogni passo. Due o tre righe di differenza per transizione sono già tante: una slide che cambia metà del proprio contenuto si anima fino a diventare rumore.

Quando conviene un'immagine

Non tutte le slide di codice vogliono questo.

Se il codice non cambia mai, un PNG è più semplice, più nitido, e porta con sé la cornice della finestra e lo sfondo che gli danno un'aria curata. Esporta a 2× e hai finito. Il flusso completo copre quella strada.

Usa RTF e Spostamento magico quando il punto è il cambiamento: quando mostri un diff, quando costruisci qualcosa pezzo per pezzo, o quando spieghi perché una versione è diventata quella dopo.

Oltre Keynote

Lo stesso RTF entra in Pages, in Word e in qualunque cosa accetti testo formattato. È testo colorato, selezionabile e ricercabile invece di un'immagine — il che vuol dire anche che resta leggibile da uno screen reader, e che qualcuno può copiarsi una riga dal tuo documento ed eseguirla.