SCRATCH: GIOCHIAMO A PROGRAMMARE 5 Introduzione all’ambiente Scratch è un , sviluppato dal MIT Media Lab, con un’interfaccia basata su blocchi grafici che possono essere trascinati con il mouse, destinato principalmente ai giovani che possono sviluppare e condividere progetti. Scratch linguaggio di programmazione visuale Esiste in versione sia online sia offline entrambe gratuite. Utilizzando la versione online, dalla home page (https://scratch.mit.edu/) facendo clic sul pulsante Inizia a Creare si apre l’ambiente di lavoro. Al centro della finestra è presente l’ trascinando al suo interno i blocchi disponibili sulla sinistra. Lo (o finestra di esecuzione) sulla destra ha al suo interno il “personaggio” ( ) che rappresenta l’ (di default è un gatto). Allo sprite possono essere assegnati compiti da svolgere, come per esempio muoversi, parlare attraverso un fumetto o emettere suoni. editor grafico nel quale “scrivere” il programma stage sprite elemento che può essere programmato attenzione All’apertura dell’ambiente di lavoro vengono resi disponibili alcuni videotutorial. Per visualizzarli fare clic sul pulsante Play . Per selezionare la lingua (dell’ambiente e/o del tutorial) fare clic sul pulsante . Per chiudere la finestra fare clic sul pulsante Chiudi Per fare clic sul pulsante inserire uno sprite Scegli uno sprite . Si apre una finestra nella quale gli sprite sono raggruppati in catergorie. Facendo clic sullo sprite scelto, questo viene inserito nello stage, dove, trascinandolo con il mouse, è possibile spostarlo, posizionandolo nel punto preferito. La in cui si trova lo sprite viene indicata dalle nella dello sprite. In questa sezione è possibile, anche, nascondere lo sprite, aumentarne o diminuirne le proporzioni e stabilire in quale direzione si muove (per esempio 90 gradi corrisponde a destra). posizione coordinate x e y sezione delle caratteristiche Facendo clic sul campo , compare un riquadro con il quale è possibile impostare la direzione trascinando la freccia con il mouse e stabilire il comportamento dello sprite scegliendo tra: Direzione Può ruotare; ; Sinistra-Destra . Non ruotare Al centro dello stage (dove si trova inizialmente il gatto) le coordinate sono = 0 e = 0. Muovendo lo sprite verso destra si incrementa ; muovendolo verso l’alto si incrementa . x y x y Andando nelle direzioni opposte le coordinate diminuiscono. Per dallo stage fare clic sul pulsante eliminare uno sprite che compare selezionando l’icona che corrisponde al personaggio. Per fare clic sul pulsante cambiare lo sfondo Scegli uno sfondo . Si apre una finestra nella quale gli sfondi sono raggruppati in categorie. Selezionando lo sfondo desiderato viene applicato allo stage. attenzione L’ aspetto dell’editor grafico cambia in funzione dello sprite selezionato, questo è utile per essere sempre consapevoli di quale personaggio si sta programmando. Sulla sinistra dell’ambiente di lavoro sono presenti tre schede: : contiene tutti i blocchi di istruzioni che possono essere utilizzati per programmare lo sprite; Codice : consente di creare, modificare e salvare i costumi, cioè l’ . Il granchio (sprite Crab), per esempio, di default ha due costumi: uno con le chele chiuse e uno con le chele aperte; Costumi aspetto dello sprite : consente di intervenire sui . Il granchio, per esempio, di default ha un suono: “pop”. Suoni suoni associati agli sprite I progetti possono essere salvati sul disco locale ( ) e successivamente riaperti ( ) utilizzando il menu che si trova in alto a sinistra, attraverso il quale è anche possibile creare un altro progetto ( ). Salva sul tuo computer Carica dal computer File Nuovo Se non si salva il progetto, quando si , compare una finestra che richiede la conferma dell’operazione da svolgere. chiude la scheda del browser attenzione Registrandosi ed entrando a far parte della “comunità Scratch” è possibile salvare sul cloud e condividere i progetti con gli altri utenti. Lo sapevi che Quando i dj utilizzano i dischi in vinile, spesso creano i mix utilizzando una tecnica chiamata che consiste nell’appoggiare le dita sul disco e portarlo avanti e indietro sul giradischi producendo degli effetti sonori. scratching Il nome , che deriva da questa tecnica, descrive l’idea che sta alla base del linguaggio e cioè quella di , e per con la libertà di usare anche i progetti degli altri e di “mixarli” per creare qualcosa di originale. Scratch unire insieme immagini suoni testi creare un contenuto multimediale >> pagina 419 Gli strumenti di Scratch Per oltre all’editor, possono essere usati i che si trovano sopra lo stage. programmare uno sprite, pulsanti di esecuzione Il pulsante Vai serve per avviare l’esecuzione del programma, mentre il pulsante Ferma tutto ha la funzione di arrestare l’esecuzione nei casi in cui non si arresti spontaneamente. I per programmare lo sprite (nella scheda ) sono raggruppati per , a ognuna delle quali è associato un colore come indicato nella tabella a pagina seguente. blocchi Codice categoria Categoria Colore Funzione dei blocchi Movimento intervengono sui movimenti dello sprite sullo sfondo Aspetto consentono di cambiare il costume allo sprite e lo sfondo, ma anche di modificare l’aspetto dello sprite se pensa, saluta ecc. Suono permettono di agire sull’audio avviandone la riproduzione, arrestandola, alzando o abbassando il volume ecc. Situazioni gestiscono gli eventi che possono verificarsi (per esempio quando viene fatto clic su Vai , viene eseguito il programma) Controllo includono varie strutture di selezione e iterazione che richiamano anche quelle del teorema di Böhm-Jacopini Sensori rilevano che cosa succede allo sprite (per esempio se sta toccando qualcosa), ma anche al cursore del mouse, ai tasti della tastiera ecc. Operatori eseguono operazioni matematiche e confronti logici, generano numeri casuali ecc. Variabili consentono di creare, modificare, nascondere, eliminare le variabili I miei blocchi consente di creare blocchi personalizzati L’esecuzione del programma può essere avviata facendo clic sul pulsante Vai , grazie all’inserimento nel codice del blocco della categoria Situazioni. attenzione Il programma può partire anche senza premere il pulsante Vai , ma digitando un tasto da tastiera. Basta sostituire il blocco con il blocco e scegliere il tasto desiderato dal menu a tendina. >> pagina 420 Il coding del movimento Per far muovere lo sprite si può usare il blocco della categoria Movimento . Il numero di passi si può modificare facendo clic sul numero e digitandone uno nuovo. coding / scrittura di codice esempio Facciamo fare 100 passi (verso destra) allo sprite Cat. Trasciniamo il blocco e attacchiamolo al blocco . Modifichiamo il numero dei passi come richiesto. Per eseguire il codice, facciamo clic sul pulsante Vai . Il gatto si sposta verso destra di 100 passi; ogni volta che facciamo ripartire lo sprite, questo fa un salto verso destra di 100 passi, ripartendo da dove era arrivato. Per è possibile ripetere più volte pochi passi. Si inserisce il blocco in un blocco di ripetizione della categoria . rendere più fluido il movimento Controllo Per rallentare il movimento dello sprite si può inserire anche il blocco della categoria Controllo. esempio Per rendere più fluido e lento il movimento del gatto dell’esempio precedente, usiamo il blocco . Modificiamo il numero di ripetizioni e inseriamo un’attesa di 1 secondo prima di fare, ogni volta, 5 passi. Per far , continuamente, si deve: muovere uno sprite avanti e indietro muovere lo sprite verso destra (nel modo precedentemente descritto); invertire la direzione dello sprite con il blocco della categoria ; Movimento muovere lo sprite verso sinistra (duplicando e modificando il codice di movimento precedente); invertire nuovamente la direzione dello sprite con il blocco ; ripetere queste tre operazioni all’infinito, inserendo il blocco della categoria (facendo clic sul pulsante si può bloccare l’iterazione). Controllo Ferma tutto attenzione Il codice può essere duplicato riscrivendolo tutto a mano o facendo clic destro sui blocchi e scegliendo Duplica dal menu contestuale. esempio Per far muovere avanti e indietro il gatto dell’esempio precedente scriviamo il codice a lato. Terminate le ripetizioni di movimento verso destra, la nuova direzione diventa - 90 gradi. Eseguendo il codice ci accorgiamo che il gatto si muove verso destra correttamente, ma quando torna indietro ruota su se stesso trovandosi a testa in giù. Questo avviene perché il comportamento dello sprite, per default, è , ma è possibile modificarlo selezionando dopo aver fatto clic sul campo . Può ruotare Sinistra-Destra Direzione >> pagina 421 Il coding dei costumi Aprendo la scheda è possibile visualizzare tutti i costumi disponibili per lo sprite selezionato. Costumi Per animare lo sprite si può cambiare il suo aspetto usando il blocco della categoria Aspetto . esempio Lo sprite Pico Walking ha quattro costumi. Per fare in modo che muova gambe e braccia mentre cammina, scriviamo il seguente codice. >> pagina 423 Il coding delle interazioni Quando nello stage sono presenti più sprite è possibile farli interagire usando i blocchi delle categorie Aspetto e Situazioni . esempio Creiamo un programma in cui il granchio saluta la stella marina e lei risponde sorridendo. Per fare in modo che il granchio saluti la stella marina inseriamo il blocco della categoria e modifichiamo il testo con Aspetto “Ciao Stella!”. Per fare in modo che la stella marina reagisca allo stimolo, nel suo codice sorgente: clic sulla freccetta accanto a messaggio1, selezioniamo dal menu a tendina. Nella finestra che si apre scriviamo il messaggio “Ciao Stella!” e facciamo clic su ; inseriamo il blocco (della categoria ) e, facendo Situazioni Nuovo messaggio OK inseriamo il blocco (della categoria ). Aspetto Eseguendo il codice, il granchio saluta correttamente, ma la stella marina non sorride. Questo accade perché il fumetto del granchio è un semplice output sul monitor e non è un messaggio che raggiunge realmente la stella marina. Il granchio può inviare un messaggio alla stella con il blocco della categoria . In questo modo la stella marina Situazioni riceve realmente il messaggio e reagisce cambiando costume. attenzione Per fare in modo che la stella marina (Starfish) guardi il granchio (Crab), le sue caratteristiche di default sono state modificate selezionando come costume iniziale (dalla scheda ) starfish-b, impostando x = 170; y = -60; dimensione = 50; direzione = -90 e comportamento . Costumi Sinistra-Destra >> pagina 423 Il coding della profondità Per dare l’impressione che uno sprite si allontani, si può ottenere l’effetto di profondità diminuendo le sue dimensioni con il blocco della categoria e impostando un valore negativo. Aspetto esempio Facciamo allontanare una pallina usando il seguente codice. attenzione Per fare in modo che la pallina si trovi nella posizione rappresentata, le sue caratteristiche di default sono state modificate impostando x = -120; y = -120; dimensione = 135; direzione = 68.-120; y = -120;dimensione = 135; direzione = 68. Il coding delle variabili Per creare una variabile è sufficiente scegliere lo sprite che dovrà utilizzarla e fare clic sul pulsante Crea una variabile nella categoria Variabili . Nella finestra che si apre si può assegnare un e stabilire se si tratta di una variabile “globale” ( ) visibile da tutti gli sprite o “locale” ( ) che può essere vista solo dallo sprite selezionato. La variabile viene creata e aggiunta alle variabili già presenti; il suo contenuto è visibile nell’angolo in alto a sinistra dello stage. nome alla variabile Per tutti gli sprite Solo per questo sprite Di default, le variabili appena create vengono inizializzate con valore 0, ma è possibile modificare questo valore usando il blocco della categoria Variabili . Per incrementare il valore della variabile usare il blocco della categoria Variabili . Per decrementare si usano valori negativi. attenzione Disabilitando il flag, la variabile non viene visualizzata nello stage. esempio Creiamo un programma in cui quando la rana fa 10 salti (lunghi 10 passi ciascuno), la libellula vola via. Per prima cosa creiamo la variabile pericolo, visibile da tutti gli sprite. Appena creata la variabile è visibile perché il flag è abilitato. Il coding da utilizzare per i due sprite è quello indicato a lato. attenzione Per fare in modo che la rana (Frog) guardi la libellula (Dragonfly) le sue caratteristiche di default sono state modificate direzione = -90 e comportamento , la libellula, invece, è stata inserita Sinistra-Destra con dimensione = 20. >> pagina 424 Il coding dei rimbalzi Per fare in modo che gli sprite “rimbalzino” quando incontrano un ostacolo si usano i blocchi della categoria . Movimento esempio Creiamo un programma in cui una colomba scivoli via in una posizione casuale quando urta una nuvola (sprite Cloud) e rimbalzi quando incontra il bordo dello stage. A ogni passo la colomba deve “controllare” se si è imbattuta nella nuvola. Usiamo il blocco della categoria Sensori e scegliamo Cloud dal menu a tendina. Se la colomba urta la nuvola deve scivolare via. In caso contrario prosegue finché non urta un bordo (su cui rimbalza). Usiamo i blocchi della sezione . Movimento prova tu Inserisci due palline su uno Fai in modo che quando sfondo a scelta e falle muovere rimbalzando sui bordi. si scontrano, rimbalzino entrambe in un’altra direzione. >> pagina 425 Il coding del pilotaggio Per controllare con la tastiera il movimento di uno sprite nello stage si usano i blocchi delle categorie e . Controllo Movimento esempio Creiamo un programma per pilotare il gatto usando le frecce della tastiera. Si devono programmare quattro eventi. Ogni volta che si preme una freccia, il gatto si muove in quella direzione e poi si ferma, ma tenendo premuto il tasto, il movimento prosegue. Il coding e lo sviluppo del pensiero computazionale Il concetto di risale agli anni Cinquanta, ma la maggior parte delle idee coinvolte risultano molto più antiche. Il pensiero computazionale e , tutti concetti presenti anche nel pensiero scientifico, ingegneristico e progettuale, basati sulla formulazione di modelli. pensiero computazionale coinvolge l’astrazione, la rappresentazione dei dati la loro organizzazione logica Pensare in modo computazionale significa come farebbe un , utilizzando gli stessi processi logici per comprendere le problematiche e formulare le soluzioni. considerare e risolvere i problemi programmatore informatico Il pensiero computazionale include due processi fondamentali: : il in una serie di passaggi ordinati, con l’obiettivo di che possa essere utilizzata per risolvere una moltitudine di problemi analoghi. Identificando e analizzando varie soluzioni, viene , sia in termini di passaggi risolutivi, sia in termini di utilizzo delle risorse disponibili; 1. astrazione problema viene riformulato ottenere una soluzione generica individuata quella ritenuta più efficiente ed efficace : il , e talvolta in sotto-problemi che vengono risolti separatamente. Utilizzando le tecniche di pensiero tipiche della programmazione, per rappresentare la soluzione (per esempio l’iterazione) e i modelli per la rappresentazione dei dati (per esempio le variabili). L’algoritmo individuato viene rappresentato per mezzo di simboli e operazioni logiche. 2. modellizzazione problema viene analizzato organizzato scomposto vengono riconosciuti gli schemi Lo sviluppo del pensiero computazionale potenzia l’attività del che si concretizza nella , individuando soluzioni attraverso l’applicazione ordinata di metodi generici e appropriati per la situazione considerata. Il in questo senso costituisce un valido strumento che supporta lo sviluppo di questa competenza. problem solving capacità di risolvere i problemi coding