Preparazione di un tutorial tecnico

Questo documento ha lo scopo di aiutarti a creare un tutorial con un focus più tecnico ( cioè che includa estratti di codice ed esempi) se non ne hai mai creato uno prima.

Preparazione

Top ↑

Definisci una serie chiara di obiettivi/risultati di apprendimento

Con i tutorial tecnici per Learn WordPress, è sempre una buona idea assicurarsi di definire obiettivi/risultati di apprendimento chiari. Quali sono i compiti specifici che chi ti guarda sarà in grado di svolgere una volta completato il tutorial? Questo ti aiuta a definire ciò che includerai o non includerai nel tutorial.

Perché questo è importante per i tutorial tecnici? Spesso quando si insegnano concetti di sviluppo, un’idea può portare in una sorta di tana del Bianconiglio, lasciando la\o studente con altre domande senza risposta, il che non è l’ideale.

Per esempio, supponiamo di voler creare un workshop sugli hook di WordPress. Ci sono diversi possibili risultati di apprendimento, alcuni direttamente collegati all’argomento principale, altri secondari, ma necessari per presentare i risultati di apprendimento principali:

  • Cosa sono gli hook?
  • Quali sono i diversi tipi di hook?
  • Quali sono le differenze tra i diversi tipi di hook?
  • Come vengono definiti gli hook?
  • Che cos’è una funzione di callback di un hook?
    • Che cos’è una funzione in PHP e come ne crei una
  • Come si registra una funzione di callback di un hook?
    • Come si aggiunge una funzione PHP personalizzata a un sito WordPress?
    • Che cos’è un plugin?
    • Cos’è un tema child?
  • Che cos’è la priorità degli hook?
  • Come funzionano gli hook con gli argomenti?
    • Cosa sono gli argomenti in PHP e come funzionano?

Se cercassi di includere tutto questo in un unico tutorial, sarebbe eccessivo. Pertanto, devi selezionare cosa trattare e cosa potrebbe essere trattato in altri tutorial.

Durante questo processo, devi anche decidere in che ordine presentare i risultati dell’apprendimento. Questo aspetto sarà importante nella fase successiva.

In genere, questa fase può richiedere dalle 2 alle 4 ore.

Top ↑

Prepara il codice di esempio

La preparazione del codice di esempio è la priorità successiva. Dopo aver definito chiaramente gli obiettivi e i risultati dell’apprendimento,  così come aver stabilito l’ordine in cui devono essere presentati, si può iniziare a pensare a ciò che chi studia dovrà costruire per apprendere i concetti presentati.

In questo caso, diventa importante l’ordine in cui decidi di presentare i risultati dell’apprendimento. Con i contenuti tecnici, è una buona idea “stratificare” le nuove idee su quelle insegnate in precedenza, nello stesso modo in cui si dipinge un muro. Quando dipingi una parete, c’è uno strato di preparazione, poi una prima mano, poi una seconda, poi si riempiono gli angoli e alla fine la parete è dipinta. Allo stesso modo, quando presenti contenuti tecnici, è una buona idea insegnare i nuovi concetti sovrapponendoli a ciò che hai già insegnato.

L’altra domanda importante da porsi sempre è: “Questo esempio di codice mi permette di concentrarmi su questo punto specifico o crea nuove domande in chi mi sta seguendo?”. Se il codice pone nuove domande, allora potrebbe essere una buona idea scegliere un altro esempio.

L’elemento chiave da ricordare è che qualsiasi nuova informazione presentata, che non sia specificamente rilevante per l’obiettivo di apprendimento, deve essere facile da spiegare in una o due frasi. Se devi includere un elemento tecnico nel tuo codice di esempio non direttamente correlato al risultato di apprendimento, questo non deve complicare eccessivamente l’esempio. Se devi partire per la tangente per spiegare un nuovo concetto, solo per assicurarti che il risultato dell’apprendimento sia stato raggiunto, riconsidera l’esempio.

Top ↑

Quando prepari un codice di esempio, includi sempre i link alla documentazione pertinente. In questo modo, quando l’utente scarica il codice di esempio sul proprio computer locale, non deve andare a cercarla, è già inclusa nel codice. Questi collegamenti possono essere aggiunti come commenti sopra la relativa sezione del codice.

I collegamenti dovrebbero essere aggiunti anche al tutorial stesso, sotto una voce chiamata “Risorse” o “Collegamenti attinenti alla documentazione”.

Top ↑

Prepara esempi di codice progressivi

Non è un obbligo, ma facilita l’apprendimento. Dove possibile, separa ogni livello di esempio di codice in un ramo separato del repository di codice, oppure in una serie di directory per passi successivi nel repository. Questo permette a chi studia di rivedere ogni fase del processo e imparare da essa. Inoltre, se si blocca in un passaggio, può guardare il codice completato nel passaggio successivo e colmare le lacune.

A seconda dei risultati di apprendimento che si vogliono raggiungere, questo può richiedere da 4 a 8 ore. Se è necessaria anche una fase di configurazione o la preparazione degli strumenti o la revisione del codice, potrebbe essere necessario prevedere un tempo maggiore.

Top ↑

Prepara la prima bozza dello script

Una volta completato il codice di esempio (e che sia funzionante!) è il momento di preparare la prima bozza del tuo script. Non cercare di scriverlo esattamente come lo presenteresti. Piuttosto, scrivilo come faresti per un articolo/tutorial di carattere tecnico su un tuo blog personale, facile da leggere. Questo è utile perché fornisce una versione scritta del contenuto che può essere adattata in un secondo momento in una trascrizione o in un piano di lezioni, ma aiuta anche a pensare ai concetti che vuoi insegnare e a come far susseguire l’uno all’altro. Prendere tutte le idee che hai in testa e metterle in parole è un ottimo modo per pianificare il tutorial finale. Scrivere i contenuti in questo modo fa passare il tuo cervello dalla modalità “sviluppo” alla modalità “insegnamento”.

Spesso, durante questo processo, ti rendi conto che è necessario apportare delle revisioni, sia ai risultati dell’apprendimento che al codice di esempio, ed è meglio scoprirlo qui, piuttosto che durante la registrazione.

Questo processo può richiedere fino a 4-8 ore, soprattutto se scopri revisioni da fare nelle fasi precedenti.

Top ↑

Registrazione ed editing

Top ↑

Prepara la registrazione

Come già detto in precedenza, la prima bozza dello script viene scritta con un linguaggio comprensibile, ora devi modificarla leggermente per la registrazione.

  1. Aggiungi delle pause logiche nello script: spesso queste si collegano alle slide, ma permettono anche di passare dalla presentazione all’editor di codice/IDE. L’aggiunta di pause ti consente anche di rifare le sezioni in caso di errore e di modificarle durante il processo di editing.
  2. Aggiungi gli snippet di codice che potrebbero essere utili al tuo script: spesso è utile averli nel documento, per potervi fare riferimento durante la registrazione, per copiare e incollare il codice o se dimentichi come fare qualcosa.
  3. È anche una buona idea preparare le slide in base al contenuto del tuo script. Includi elementi come la copertina, l’introduzione, gli obiettivi di apprendimento, i dettagli sulle descrizioni necessarie o i link alla documentazione, ecc. Mentre prepari la presentazione, devi pensare a quando potresti dover passare dalle slide all’editor di codice o all’IDE, o mostrare i link alla documentazione nel browser.

La preparazione ti può richiedere dalle 2 alle 4 ore, a seconda della quantità di lavoro da completare.

Top ↑

Creare il tutorial

Registra il tutorial usando un software di registrazione dello schermo. Se puoi, utilizza un monitor secondario per mostrare il tuo script, in modo da potervi fare riferimento e da potervi aggiungere eventuali snippet di codice, mantenendo la presentazione, la finestra del browser e l’editor di codice/IDE sullo schermo principale di registrazione. Se non disponi di un secondo monitor, ti può essere utile stampare lo script e averlo davanti a te.

È buona norma registrare alla risoluzione di 1920×1080 e ingrandire o aumentare le dimensioni dei caratteri della finestra del browser e dell’editor di codice/IDE. Un buon livello di zoom predefinito è tra il 125% e il 150%. Per quanto riguarda il codice, cerca di ingrandirlo in modo che sia leggibile, ma che possa comunque rientrare nell’area dell’editor di codice sullo schermo. Se il sistema operativo lo supporta, passa tutte le finestre alla modalità a schermo intero.

Durante la registrazione, non preoccuparti troppo di dover presentare un codice “perfetto”. È normale sbagliare qualcosa o fare un errore e correggerlo durante il workshop. I piccoli errori sono positivi: danno il permesso anche agli altri di non essere perfetti.

È anche una buona idea cercare di passare a un tono più colloquiale quando si legge lo script e soprattutto quando fai live coding. Potresti includere piccoli dettagli come il tuo personale stile di scrittura del codice o semplicemente parlare del codice che stai digitando sullo schermo.

Una volta registrato, modifica e aggiungi delle note al tuo video tutorial. Questo è un ottimo momento per rivedere il contenuto e assicurarti che abbia senso. Se il tuo software lo supporta, aggiungi annotazioni come frecce e rettangoli per evidenziare gli elementi che vuoi far risaltare, come i nomi delle funzioni, i parametri che vengono passati o le sezioni della documentazione.

Questo processo può durare da 30 minuti a 4 ore, a seconda del numero di riavvii, di tagli e della quantità di modifiche e annotazioni che avrai bisogno di fare. Tuttavia, più ci si esercita, più si migliora.

Top ↑

Non aver paura di chiedere aiuto

Preparare un tutorial tecnico può essere scoraggiante la prima volta, quindi non aver paura di chiedere aiuto. Puoi contattare liberamente i membri del team di formazione nel canale #training sullo Slack di Make WordPress se hai domande o bisogno di aiuto/supporto nella creazione del tuo tutorial tecnico per Learn WordPress.

Ultimo aggiornamento: