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