MIT App Inventor 2: “Agire le scelte” utilizzando gli Sprite

Nel precedente Post avevamo preannunciato la costruzione di una semplice App, con il nostro MIT App Inventor 2, che consentisse di “agire” delle scelte (tra opzioni o elementi) trascinando degli Sprite e “portando il corpo” dentro l’attività cognitiva.

Prima di iniziare, è d’obbligo consigliare la lettura dei precedenti post dedicati agli strumenti di MIT App Inventor 2.

Fatto?

Bene, possiamo procedere.

L’attività-gioco che vogliamo utilizzare è quello, tanto semplice quanto importante, del “Mi Piace/Non mi Piace”.

Classificare in queste due categorie una serie di elementi (cibi, giochi, luoghi, persone…) è il primo passo cognitivo verso una maggiore consapevolezza emotiva (nonché, per l’operatore, verso una più profonda conoscenza del discente).

Naturalmente, verremmo meno alle nostre premesse (e promesse) se proponessimo un’App pre-costituita, non personalizzabile, con immagini e disegni creati dalla software house ed estranei alla quotidianità, al vissuto del bambino.

Fortunatamente, MIT App Inventor 2 ci consente di gestire, molto facilmente, la fotocamera del nostro Smartphone/Tablet e così…ecco risolto il problema della personalizzazione delle immagini stimolo: le acquisiremo direttamente dalla realtà di ogni giorno!

Bando agli indugi, partiamo con il Design della nostra, semplicissima App.

MIT App Inventor 2 Disabilità Android Apprendimento

Clicca sull’immagine per ingrandirla

Definite l’orientamento dello schermo a LandScape (orizzontale), poi trascinate sullo schermo del nostro Viewer un allineamento verticale, dal Menu Palette (sottomenu Layout); sia altezza che larghezza saranno settati a Fill Parent (occupa tutto lo spazio in orizzontale e verticale).

Trascinate poi due Canvas sullo schermo del Viewer; per il Canvas1 (quello più in alto) definite un altezza pari a 256 Pixel e lasciate la larghezza Fill Parent, mentre Canvas2 sarà alto 64 Pixel (larghezza Fill Parent).

Trascinate ora, dal menu Palette, tre Sprite nel Canvas1 e uno Sprite nel Canvas2.

Trascinate inoltre, sempre nel Viewer, i seguenti componenti: Camera, TextToSpeach, Sound (li trovate tutti nel sottomenu Media della Palette).

Ecco le proprietà che dovete impostare per gli Sprite:

Sprite Nome Proprietà
 Sprite1  Mipiace – Altezza e Larghezza:  50 Pixel

– Immagine: mipiace3png.png (qui)

– X: 30  Y:30

 Sprite2  Nonpiace  – Altezza e Larghezza 50 Pixel

– Immagine: nonpiace3png.png (qui)

– X: 30  Y: 120

 Sprite3  Oggetto  – Altezza: 150 Pixel

Larghezza: 200 Pixel

– Immagine: mela.jpg (qui)

– X: 270  Y:15

 Sprite4 (quello che avrete inserito in Canvas2) Foto  – Altezza: 35 Pixel

Larghezza: 40 Pixel

– Immagine: fotocamera.png (qui)

– X: 240  Y:1

Passiamo ora al codice, spostiamoci nel Blocks editor.

L’idea è semplice: trascinando con il dito le faccine (sorridente per il “Mi Piace” e triste per il “Non mi piace”) verso l’oggetto rappresentato sulla destra dello schermo del nostro Smartphone, lo stesso vibrerà brevemente (grazie al componente Sound) e riprodurrà la frase appropriata (componente TextToSpeach).

Per prima cosa, consentiamo ai due Sprite Mipiace e Nonpiace di muoversi.

Lo facciamo tramite il blocco When….Dragged (troviamo i blocchi relativi ad ogni componente, lo ricordiamo, cliccando su di essi nel menu Blocks, vedi post precedenti).

MIT App Inventor 2 App Disabili

Clicca sull’immagine per ingrandire

Il blocco registra il movimento del nostro dito da quando iniziamo a trascinare lo Sprite e lo memorizza nelle variabili currentX e currentY.

E’ quindi sufficiente reimpostare le coordinate cartesiane del nostro Sprite in modo continuativo (ossia finchè il dito trascina e il blocco è attivo) e il gioco è fatto.

Naturalmente creeremo un blocco analogo per lo Sprite Nonpiace.

MIT App Inventor 2 Android Educational Technology

Clicca sull’immagine per ingradire

In questo modo le nostre due faccine saranno libere di muoversi attraverso il Canvas che le ospita.

Il secondo passo è quello di impostare il comportamento dello Sprite Oggetto: quando una delle due faccine lo tocca, dovrà produrre una breve vibrazione, pronunciare la frase corretta e ripristinare la situazione iniziale.

Si utilizza il blocco When …..CollidedWith, ecco le istruzioni:

MIT App Inventor 2 Tecnologie Educazione

Clicca sull’immagine per ingrandire

Come funziona questo blocco?

CollidedWith si attiva quando uno Sprite collide con Oggetto ed è anche in grado di riconoscere quale Sprite si è scontrato: questa informazione viene memorizzata nella variabile “other”.

Per prima cosa effettuiamo un test per capire quale dei due Sprite (Mipiace o Nonpiace) è coinvolto nella scelta.

Utilizziamo un blocco “If…Then…Else” (Se…allora…altrimenti), che troviamo nella Control del sotto-menu Built-in:

MIT App Inventor 2 Android App Apprendimento

Clicca sull’immagine per ingrandire

Quindi, la nostra App controllerà se lo Sprite che ha toccato Oggetto è Mipiace: in tal caso riporterà Mipiace nella sua posizione originale, produrrà una breve vibrazione (di 300 millisecondi) e pronuncerà la frase <<Mi piace>>.

Altrimenti osserverà un comportamento speculare agendo sullo Sprite Nonpiace.

Chiaro?

Potrebbe capitare che, per errore, a scontrarsi siano Mipiace e Nonpiace…rischiamo di avere effetti indesiderati e poco chiari. E’ quindi necessario inserire un blocco di controllo, che segnali tale evento con una breve vibrazione e ristabilisca le posizioni iniziali. Ecco il blocco di istruzioni:

App Android disabilità MIT App Inventor 2

Clicca sull’immagine per ingrandire

Cosa manca?

L’aspetto primario di personalizzazione dello stimolo, senza il quale la nostra App sarebbe uguale a tante altre recuperate negli store…ecco le istruzioni:

MIT App Inventor2 Apprendimento Personalizzazione

Clicca per ingrandire

Quando lo Sprite Foto viene premuto, si attiva la fotocamera del dispositivo.

Dopo aver acquisito la Foto, il secondo blocco la memorizza nella variabile Image e modifica la proprietà Picture dello Sprite Oggetto.

(nota: la correzione successiva della coordinata cartesiana dello Sprite, a 330, è funzionale sui dispositivi che ho provato; è possibile che differenti fotocamere abbiano risoluzioni e dimensioni differenti e sia necessario aggiustare tale valore di X).

Oltre alla modifica dell’oggetto-stimolo, questa prima semplicissima applicazione consente già alcuni ulteriori livelli di personalizzazione dell’intervento: provate a sostituire le faccine sorridenti con foto reali (sorridenti o disgustate) del bambino, modificate la dimensione e la posizione degli Sprite per favorire i movimenti più facilmente realizzabili da chi ha difficoltà motorie, utilizzate l’App per altre categorizzazioni dicotomiche (alto-basso, corretto-errato)…

Il passo successivo sarà quello di modificare l’App per consentirne l’utilizzo anche soggetti con disabilità motorie più complesse, approntando una modalità di scelta “a scansione”.

P.S.

Dal punto di vista tecnico, con questa App abbiamo introdotto alcune funzionalità grafiche di MIT App inventor 2. Per dirla con onestà, l’estrema semplicità dell’applicativo del MIT trova dei limiti proprio in tale ambito: accortezze e trucchi non sempre immediati sono necessari per gestire correttamente immagini, risoluzioni su dispositivi di dimensione diversa…ne parleremo senz’altro, per il momento vi rimando agli ottimi tutorial su tale tema del sito MIT App Inventor 2 e a quelli, altrettanto perfetti, del sito italiano Seblog Android Apps.

 

Advertisements

2 thoughts on “MIT App Inventor 2: “Agire le scelte” utilizzando gli Sprite

  1. Pingback: MIT App Inventor 2: la Scansione per agire le scelte | Il sarto delle App

  2. Pingback: MIT App Inventor 2 per l’apprendimento – Immagini e grafica: elementi essenziali di personalizzazione | Il sarto delle App

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione / Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione / Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione / Modifica )

Google+ photo

Stai commentando usando il tuo account Google+. Chiudi sessione / Modifica )

Connessione a %s...