Amore a prima vista: Excalidraw

Insegnando e facendo video lezioni uso spesso lavagne online, tra le applicazioni che uso di più Janboard di Google, ma in questi giorni non posso fare a meno di utilizzare Excalidraw, che ho conosciuto guardando le lezioni settimanali di Ludovico e Jaga su Kubernetes e molto altro.

Da sempre utilizzo il mio blocco appunti cartaceo per disegnare cose che sto cercando di capire e che voglio spiegare, quindi agisco all’inizio di ogni mio progetto in modo analogico 🙂

Online trovate moltissime applicazioni che potete utilizzare per creare diagrammi a blocchi, diagrammi di flusso ecc… ma nulla è così efficace come disegnare su un foglio di carta.

Ritengo che nessuna applicazione web per disegnare diagrammi, in cui si utilizza mouse o tavoletta grafica, può sostituire la libertà del disegno a mano libera su carta, ma molto spesso ho l’esigenza di condividere velocemente durante una video lezione, testo semplice e forme da collegare con frecce e per questo motivo potrebbe essere interessante utilizzare Excalidraw.

Piccola analisi sui pregi e difetti dell’uso di carta e penna.

Perché carta e penna è così efficace?

  • Tolto il costo della carta, non ci sono costi aggiuntivi;
  • completa libertà in ciò che disegnate: disegni, testo, forme, frecce e pasticci vari che ci vengono in mente;
  • non dovete collegarvi su nessun sito, prendete il foglio di carta ed iniziate, quindi immediatezza;
  • potete aggiornare il disegno, potete aggiungere note ad ogni parte del disegno anche in momenti diversi;
  • non rischiate di cancellare la pagina, una volta che avete diegnato tutto rimane in modo permanente.

Ma un’applicazione aggiunge qualcosa di più:

  • collaborazione del disegno, infatti risulta difficile condividere un disegno mentre state facendo una video lezione;
  • la carta occupa la mia scrivania e molto spesso perdo i fogli tra pagine di libro o  nascoste sotto schede elettroniche;
  • sicurezza, non molto rilevante nel mio mestiere, ma alcune volte si realizzano disegni con appunti riservati e quindi siete obbligati a strappare periodicamente in mille pezzi il foglio di carta;
  • il nostro Pianeta. Usare la carte non è molto sostenibile.

Excalidraw funziona interamente online in modo crittografato ed completamente open-source, su GitHub l’app ha più di 10.000 like. Proverò ad usarlo la prossima settimana  quando farò lezione, soprattutto quando dovrò spiegare ai miei studenti come funzionano sketch Arduino e circuiti elettronici.

Tutte le forme sono rese semplici in modo che il tutto sia veloce, potete aggiungere il testo facendo un doppio click in qualsiasi zona del foglio da disegno. Il piano di lavoro ha una dimensione infinita, ogni elemento può essere organizzato a livelli e potete assegnare un grado di trasparenza. Tutti i colori degli oggetti e dello sfondo possono essere selezionati da una tavolozza o tramite i codici esadecimali HTML standard.

Una delle caratteristiche più belle è la sicurezza e la capacità di condivisione dei disegni stessi.

Excalidraw memorizza tutti i disegni sul server come BLOB,  crittografati, questo vuol dire che anche se i dati sono conservati in remoto, nessuno sul server può vedere il contenuto. I disegni persistono tra le visite e possono essere esportati in formto PNG, SVG oppure condivisi solo come collegamento che include il riferimento al BLOB e la chiave di decrittografia.

Dal momento in cui iniziate a costruire il diagramma potete velocemente generare un link di condivisione da consegnare ai vostri studenti in modo che possano vedere e modificare il disegno. Può quindi essere resa collaborativa la produzione di un disegno e vedere in tempo reale la modifica del vostro disegno fatta da un altro utente.

Quindi se dovessi spiegare come funziona questo codice:

1if (inputPin < 500)
2{
3   doThingA;
4}
5else if (inputPin >= 1000)
6{
7   doThingB;
8}
9else
10{
11   doThingC;
12}

Il diagramma di flusso con Excalidraw sarebbe:

Attenzione però che Excalidraw non sostituisce altre applicazioni come ad esempio: Disegni Google, Lucidchart o Draw.io, tutti questi sono strumenti ottimi per diagrammi complessi in cui è richiesto un grado di precisione più elevato.

Quindi, come già affermato all’inizio di questo post, non è la soluzione perfetta per disegnare grafici e disegni, ma sicuramente è un modo estremamente veloce e sicuro per condividere un disegno.

Lascio a voi scoprire tutte le funzionalità dell’applicazione.

Buon lavoro 🙂

Progettare una nuova scuola – Corso gratuito on-line – Corso n. 3 – produrre e gestire contenuti online

Ho il piacere di informarvi che da qualche giorno è on line il mio terzo corso gratuito:

produrre e gestire contenuti online
per potenziare la didattica digitale a distanza e integrata

che fa parte dell’iniziativa realizzata da Tecnica della Scuola: Progettare una nuova scuola.
Il corso illustra come creare e condividere contenuti on line (documenti e presentazioni mediante le Google Apps) e come gestire attività di progetto tramite la creazione di siti e blog didattici, la cui realizzazione e gestione prevede l’uso esclusivo di un browser internet. Nello specifico verranno mostrate le modalità di creazione di siti e blog mediante applicativi visuali appositamente studiate per il docente.
Il blog o il sito possono diventare luoghi in cui il docente inserisce i contenuti da lui mediati da offrire ai propri allievi, un luogo che può essere arricchito con contenuti multimediali per rafforzare l’efficacia dell’apprendimento, ma in un sito è possibile inserire sistemi di e-learning che offrono allo studente strumenti per verificare in autonomia le competenza raggiunte e quindi autovalutazione durante il processo di apprendimento.

Per maggiori informazioni vi rimando alla pagina del sito di Tecnica della Scuola.

5 minuti da Maker: lista della spesa smart

Figlia: Papà visto che sei al supermercato puoi aggiungere alla lista della pesa:

  • gocciole,
  • cerotti,
  • matite

aspetta aspetta papà ti mando la foto della lista!

Io: Basta! Da oggi si cambia, vi avevo condiviso liste con Evernote, Google Keep, ma nulla! Mannaggia!
Proviamo con Google Documenti che sapete usarlo tutti in famiglia! Un tag nfc da pochi centesimi ed un foglio Google Documenti condiviso in famiglia.

Approfondimenti

Progetti realizzati/da realizzare:

  • tag NFC su strumento di laboratorio che rimanda alla manualistica e agli appunti del Prof.
  • tag NFC su armadio aula che rimanda all’inventario
  • tag NFC su porta aula di scuola che rimanda ad orario occupazione aula
  • tag NFC sportello segreteria che rimanda alla documentazione (moduli permessi, ferie, ecc…)
  • tag NFC per realizzare una caccia al tesoro didattico a scuola
  • tag NFC per individuare oggetti da parte di un robot
  • tag NFC per controllo freschezza alimenti

😉

Progettare una nuova scuola – Corso gratuito on-line – Corso n. 2 – videolezione e ambienti di apprendimento

Come già segnalato in un precedente post, ho collaborato con Tecnica della Scuola al progetto: Progettare una nuova scuola, corsi di formazione a cui è possibile iscriversi gratuitamente. Il mio contributo copre aspetti di carattere tecnologico ed ho il piacere di informarvi che da qualche giorno potete iscrivervi al corso:

video lezione e ambienti di apprendimento

Il corso si propone di mostrare come configurare e gestire ambienti di apprendimento integrati on line per potenziare la didattica digitale a distanza e integrata. Ciò consente di realizzare dinamiche di lavoro collaborative, altamente inclusive permettendo il monitoraggio e la valutazione a distanza sulla classe o sul singolo allievo.
Il corso contiene anche situazioni didattiche reali gestite con le tecnologie esposte, mostrando tutto il processo di lavoro: dalla creazione della classe online alla realizzazione di videolezioni in modalità sincrona o asincrona, in particolare si forniscono le nozioni tecniche e le competenze per un’operatività avanzata nell’uso di software per la produzione di videolezioni, sistemi per il montaggio audio e video, scelte tecnologiche: microfoni, webcam, luci.

Per maggiori informazioni vi rimando alla pagina dedicata.

Ringrazio di cuore tutte le persone che stanno partecipando, sono tantissimi gli iscritti sia al primo che al secondo corso e preannuncio che sono in procinto di preparare nuovi corsi per i prossimi mesi, che rispondono a molte delle esigenze che negli scorsi mesi mi avete comunicato. L’ultimo corso: produrre e gestire contenuti online verrà pubblicato nel breve.

Grazie 🙂

Arduino: cicli infiniti ed uscita da un ciclo infinito

Per rispondere ad un quesito che mi è stato posto questa mattina a lezione da alcuni allievi condivido questo breve approfondimento sulla gestione dei cicli infiniti.

Parliamo di un ciclo infinito quando il controllo entra nel corpo del ciclo e non esce mai da esso, ciò accade quando la condizione di test del loop non è mai false.

Possiamo realizzare un ciclo infinito in C in diversi modi:

1for (int i = 0; i >= 0; )
2{
3    // corpo del ciclo in cui la variabile i non viene mai modificata
4}

Nell’esempio la variabile i viene inizializzata a 0 e la condizione di controllo i>=0 all’inizio è vera. La variabile i non viene modificato in nessun punto del codice inoltre l’espressione di aggiornamento della variabile non è presente, ciò implica che i avrà sempre come valore 0 e la condizione di controllo i>=0 non è mai falsa e quindi il corpo del for viene eseguito ad ogni ciclo.

Un modo più sintetico per realizzare un ciclo infinito è quello di utilizzare una condizione sempre vera utilizzando l’istruzione while:

1while (true)
2{
3    // corpo del while
4}

Questo comportamento può essere realizzato anche scrivendo 1 per indicare “condizione sempre vera”.

1while (1)
2{
3    // corpo del while ripetuto per sempre
4}

o ancora utilizzando un’uguaglianza sempre vera:

1while (3==3)
2{
3    // corpo del while ripetuto per sempre
4}

che nella programmazione con Arduino può essere ottenuto anche con:

1while (HIGH)
2{
3    // corpo del while ripetuto per sempre
4}

E’ possibile realizzare un ciclo infinito anche con l’istruzione for omettendo la condizione di ripetizione del ciclo, cioè che bisognerebbe inserire tra i due punti e virgola.

1for (;;)
2{
3    // corpo del for ripetuto per sempre
4}

Terminare un ciclo infinito

Negli esempi visti precedentemente la condizione sempre vera causava la ripetizione infinita del corpo dell’istruzione, però esiste il modo per terminare un ciclo infinito utilizzando l’istruzione break usata appunto per uscire da un ciclo: for, while oppure do..while, ma anche per uscire da una istruzione switch case.

Poiché nelle nostre sperimentazioni utilizziamo Arduino vediamo come realizzare l’uscita da un loop infinito.

Lo scopo è quello di far lampeggiare ripetutamente un LED e bloccare il lampeggio con la pressione di un pulsante.

Realizzimo il seguente circuito:

Utilizzando l’istruzione while.

Esempio 1

1/*
2  Prof. Michele Maffucci
3  Data: 16.11.2020
4  Esempio1: Funzionamento dell'istruzione break
5*/
6const int pinPulsante = 8; // pin digitale 8
7 
8void setup()
9{
10  Serial.begin(9600);
11  pinMode(LED_BUILTIN, OUTPUT); // abilita il pin a cui è connesso il LED come output
12  pinMode(pinPulsante, INPUT);  // abilita il pin a cui è connesso il pulsante come input
13}
14void loop()
15{
16  while (true) // ciclo infinito
17  {
18    if (digitalRead(pinPulsante) == HIGH)
19    {
20      break; // esce dal ciclo se si preme il pulsante
21    }
22    lampeggio(); // chiama la funzione che accende e spegne il LED
23  }
24}
25void lampeggio()
26{
27  digitalWrite(LED_BUILTIN, HIGH);
28  delay(100);
29  digitalWrite(LED_BUILTIN, LOW);
30  delay(100);
31}

Come si può notare viene utilizzata l’istruzione break per uscire dal ciclo. Fino a quando il pulsante non sarà premuto la condizione: digitalRead(pinPulsante) == HIGH sarà falsa, pertanto non verrà eseguito il corpo dell’if e quindi non potrà essere eseguito il break, in questa condizione ciò che segue l’if è la chiamata della funzione lampeggia().

Nel caso in cui il pulsante viene premuto, la condizione digitalRead(pinPulsante) == HIGH risulta vera, pertanto viene eseguito il corpo dell’if che contiene l’istruzione break che causerà l’uscita dal ciclo while.

Il codice sopra indicato funziona anche se nel while viene sostituito true con HIGH:

1...
2while (true) // ciclo infinito
3  {
4       // corpo del while
5  }
6...

con

1...
2while (HIGH) // ciclo infinito
3  {
4       // corpo del while
5  }
6...

Come spiegato ad inizio lezione, un ciclo infinito può essere ottenuto anche con un’istruzione for quindi si ottiene il medesimo risultato se si utilizza il codice che segue.

Esempio 2

1/*
2  Prof. Michele Maffucci
3  Data: 16.11.2020
4  Funzionamento dell'istruzione break
5*/
6const int pinPulsante = 8; // pin digitale 8
7 
8void setup()
9{
10  Serial.begin(9600);
11  pinMode(LED_BUILTIN, OUTPUT); // abilita il pin a cui è connesso il LED come output
12  pinMode(pinPulsante, INPUT);  // abilita il pin a cui è connesso il pulsante come input
13}
14void loop()
15{
16  for (;;) // ciclo infinito
17  {
18    if (digitalRead(pinPulsante) == HIGH)
19    {
20      break; // esce dal ciclo se si preme il pulsante
21    }
22    lampeggio(); // chiama la funzione che accende e spegne il LED
23  }
24}
25void lampeggio()
26{
27  digitalWrite(LED_BUILTIN, HIGH);
28  delay(100);
29  digitalWrite(LED_BUILTIN, LOW);
30  delay(100);
31}

Differenze tra ciclo for e ciclo while

  • Il ciclo for ha necessità di una variabile al suo interno, mente il ciclo while può utilizzare qualsiasi variabile definita prima dell’istruzione while.
  • L’uso del ciclo do-while permette di realizzare sempre una volta il corpo delle istruzioni in esso contenuto (indipendentemente dall’espressione condizionale) e ciò non può essere fatto con un  ciclo for.

Esercizio per i miei studenti

Esercizio 1

Realizzare le stesse funzionalità dell’esempio precedente (usando un ciclo infinito nel loop()) aggiungendo la stampa sequenziale crescente di un numero n = n + 1 sulla Serial Monitor. Alla pressione del pulsante si interrompe il lampeggio del LED e si azzera il contatore.

Buon Coding a tutti 🙂