1. Università degli Studi di Bari
Facoltà di Scienze MM.FF.NN
Corso di Laurea in Informatica e tecnologie per la produzione del software
Corso di Interazione uomo macchina e progettazione
dell’interazione con l’utente
Prof.ssa Valeria Carofiglio
a.a. 2011-2012
RIPROGETTAZIONE DELL’INTERFACCIA
GADALETA FABIO
SCHINO FRANCESCO
TANGA CARMINE

2. INDICE
Sezione 1: Sintesi delle analisi e delle valutazioni
1. Sintesi del primo prototipo
2. Sintesi del Walkthrough
3. Sintesi delle valutazioni euristiche ed empiriche
Sezione 2: Riprogettazione
1. Descrizione delle riprogettazioni
 Descrizioni delle conferme
 Descrizione delle modifiche
2. Qualità del progetto
Appendice 1
1. Allegati

3. SEZIONE 1: SINTESI DELLE ANALISI E DELLE
VALUTAZIONI
1- SINTESI DEL PRIMO PROTOTIPO
Definire un prototipo in fase iniziale di un progetto è molto più utile di definire un prodotto
completo alla fine della programmazione. Alla luce di tale osservazione, il nostro intento è
stato quello di ideare un prototipo low-fidelity che si basasse sulla semplicità di
realizzazione, per motivi di tempo e di entità delle risorse impiegabili.
I prototipi creati sono stati di due tipi:
1) Pictive, un prodotto simil-iPad realizzato con un modello cartaceo al quale erano
collegate le schede dei vari “sottogiochi”, suddivisi per genere in base a dcategorie
poste in una “cesta di giochi”
2) Un altro prototipo su carta con schizzi e bozze dell’interfaccia che, pur apparendo
scarna, ci ha aiutato, successivamente, ad avere idee più chiare sulla realizzazione
progettuale.
Il secondo prototipo è stato oggetto di ulteriori miglioramenti.
Esso è un prototipo statico ma è stato reso interattivo, grazie alla realizzazione della
maggior parte delle schermate e videate. Non possiamo dire di essere stati subito
pienamente soddisfatti, ma siamo riusciti ad ottenere ottimi risultati dalle azioni di
miglioramento, soprattutto dopo aver effettuato dei test di usabilità dell’interazione con i
nostri utenti.
Basandoci sul prototipo fin qui definito, provvederemo a trarne i vantaggi prima mancanti
e ad implementare miglioramenti non preventivabili in precedenza.
2- SINTESI DEL WALKTHROUGH
Il walkthrough associato al primo prototipo ci aveva già permesso di effettuare prime
considerazioni interessanti, ma nella fase delle valutazioni euristiche successive non sono
state tenuto in considerazione.
Le valutazioni empiriche sono state, invece, accorpate con le analisi del walkthrough della
prima progettazione; molti dei risultati osservati in relazione alla prima rappresentazione

4. del prototipo cartaceo, sono stati riscontrati anche per il successivo prototipo migliorato, in
quanto molti cambiamenti analizzati precedentemente non erano stati considerati, proprio
perché la riprogettazione sarebbe stata necessaria anche dopo la valutazione preliminare,
euristica ed empirica.
Non si è voluto quindi apportare modifiche sostanziali al prototipo cartaceo, tranne che
provare ad inserire alcune funzionalità prima assenti (come ad esempio i tasti volume o il
tasto di ritorno) per poter ottenere un riscontro diverso dal risultato dell’analisi del
walkthrough.
3- SINTESI DELLE VALUTAZIONI EURISTICHE ED
EMPIRICHE
Le valutazioni euristiche ed empiriche hanno prodotto, come ci aspettavamo, molti risultati
sia positivi che negativi. Positivi, perché gli utenti ci hanno segnalato numerosi elementi
sui quali poter lavorare in termini di miglioramento, negativi perché molte volte abbiamo
creduto che un utente di così tenera età avrebbe affrontato con maggiore semplicità gli
esercizi proposti, che si sono rivelati non adeguati al suo livello di conoscenza.
In ogni caso la totalità dei dati raccolti ci ha permesso di definire una prima
riprogettazione, sicuramente migliore dal punto di vista qualitativo.

5. SEZIONE 2: RIPROGETTAZIONE
1- DESCRIZIONE DELLA RIPROGETTAZIONE
L’analisi delle valutazioni è stata davvero difficile, non tanto per i dati raccolti, ma per la
loro interpretazione. Da un errore di interpretazione può conseguire non un miglioramento
ma una scarsa qualità del prodotto finale.
La riprogettazione sarà svolta in base ai dati raccolti, ideando una rappresentazione più
consona e adatta, con una interfaccia più fluida e più semplice, essenziale all’adeguatezza
del compito e alla facilità e rapidità di apprendimento.
DESCRIZIONE DELLE CONFERME
Il menù esagonale, la prima delle schermate visibili, oltre al supporto fisico, è la nostra
prima conferma. Migliorata a livello grafico e semplificata, non ha suscitato negli utenit
nessun commento negativo, ma anzi solo stupore che ha stimolato la curiosità del
bambino e quindi lo ha invogliato al suo utilizzo.
Ulteriori conferme sono state registrate in relazione l livello di presentazione del menù: lo
sfondo e i task sono stati ben orientati e le etichette non sono state necessarie, grazie alle
immagini già di per sé semplici e chiare.
DESCRIZIONE DELLE MODIFICHE
In relazione al sistema, la maggior parte delle impostazioni sono state ritoccate, ma non
del tutto stravolte.
Con riferimento al supporto fisico, abbiamo voluto rendere il prototipo meno spigoloso e
quindi più tondeggiante.
Esso, a livello di impatto grafico, si presenta con una linea più “elegante” oltre che in un
colore neutro: non bianco perché troppo chiaro, nè nero perché troppo scuro: una via di
mezzo, tendente quasi al metallico, secondo il gradimento degli utenti.
La presenza di funzionalità poco chiare all’impatto frontale della vista dell’utente avrebbe
potuto sicuramente confonderlo: ne è conseguita la necessità di eliminare i pulsanti del
volume e del ritorno e di inglobarli all’interno della schermata touch; le funzioni sono
modificabili attraverso semplici pressioni sullo schermo e sono state posizionate agli angoli

6. dell’esagono, in modo tale da risultare visibili e facilmente comprensibili attraverso le
immagini simboliche che le rappresentano.
Oltre a queste modifiche, abbiamo voluto aggiungere la funzione di luminosità dello
schermo, per aumentare o diminuire la luminosità e il contrasto delle videate.
Oltre ai tasti fisici delle funzioni volume e ritorno indietro, è stata eliminata la presenza dei
led indicanti il livello di carica del dispositivo: lo status di crica è stato spostato all’interno
della videata.
Il dispositivo di uscita (altroparlanti) sono stati spostati nella parte posteriore del supporto;
il microfono è stato ridotto nelle dimensioni e spostato nella parte superiore accanto alla
webcam.
Tutto ciò per ottenere un hardware più elegante e meno difficile da interpretare.
Altro aspetto fondamentale è stato rendere più comprensibile e meno confusionaria anche
la parte tattile del touch screen.
Partendo dalla poca chiarezza delle immagini che abbiamo potuto osservare, le lettere
minuscole, per un bambino, non sono risultate molto comprensibili e abbiamo deciso di
effettuare una sostituzione con le lettere maiuscole.
Oltre all’intervento sulle lettere, alcune forme poco note al bambino hanno confuso le sue
idee. Ne è conseguita la nostra volontà di rimuovere alcune forme difficili da interpretare
(come il pentagono o l’esagono), aggiungendo forme già conosciute dagli utenti e
inserendole di varie dimensioni.
Infine, sempre nel menù principale, la fetta dell’esagono raffigurante i colori a strisce è
risultata poco divertente, scambiata quasi per un misto di bandiere a strisce. L’immagine
sarà sostituita con delle chiazze di colore simili a schizzi su un muro bianco; questa
versione del menù ci è sembrata molto più adatto a ciò che un bambino farebbe se si
trovase davanti ad un muro con la possibilità di colorarlo.
In relazione ai sottomenù, ognuno di essi conteneva al suo interno 3 sottotask, uno per
ogni esercizio, e un menù di sfondo troppo nitido e luminoso nel quale era facile perdersi e
confondersi. Per questo motivo abbiamo deciso di ridurre la trasparenza dello sfondo, in
modo da farlo risultare in secondo piano rispetto ai task; questi ultimi, inoltre, non saranno
più rappresentati da un’immagine statica ma da un’animazione dell’esercizio con un
esempio del suo svolgimento, in modo da far capire intuitivamente all’utente cosa
potrebbe succedere toccando una specifica parte dello schermo.
Con riferimento agli esercizi provati (l’associazione dei colori e il ricopiare la lettera), si è
deciso di eliminare qualcosa o rendere più semplice l’interazione, come abbiamo notato e
ci hanno fatto notare.
Iniziamo dal ricopiare la lettera.

7. L’esercizio per dipingere la lettera aveva una similitudine con la realtà, ovvero un
secchiello dove intingere il dito ma, visto e osservato che quasi nessuno degli utenti
eseguiva la procedura così come l’avevamo pensata, abbiamo voluto rendere la loro
interazione quanto più possibile simile alla realtà, senza il secchiello nel quale intingere
digitalmente il dito, lasciando invariato il resto dell’interfaccia.
L’associazione di colori è stata resa molto meno complicata. L’utente non avrà più il
compito di scegliere il nome del colore e il colore da associare, ma solo i nomi da
selezionare. Così alla sua pressione, la casella esagonale si riempirà del colore scelto e
genererà un ritorno audio con la pronuncia del colore scelto; non tutti i bambini, infatti,
sanno leggere le parole intere e il nostro obbiettivo è insegnare loro come si scrivono i
colori senza rendere noiosa la loro interazione.
Inoltre, sono stati sostituiti alcuni colori poco noti, come il magenta e il ciano, con colori
più usati e conosciutida un bambino, quali il fucsia e il celeste.
In base alla prima valutazione compita e agli errori riscontrati, la prima riprogettazione è
stata fatta cercando di rimediare agli errori fatti durante la prima analisi.
Al termine di questa fase, probabilmente, ci saranno ancora altri tipi di errori,dovuti ad
esempio alle preferenze non tutte uguali dei bambini, ma abbiamo cercato di soddisfare la
maggior parte di loro attraverso le migliorie apportate.
2- QUALITA’ DEL PROGETTO
Non è possibile stabilire la qualità del progetto a priori e soprattutto non è possibile
valutarla oggettivamente senza analizzarne l’impatto reale sull’utenza, proprio perché il
target scelto per il prodotto è un’utenza specifica.
Per quanto ci è possibile, daremo un giudizio di qualità quanto più oggettivo.
L’interazione come detto sopra, non è stata modificata, tranne per l’eliminazione di alcuni
tasti fisici.
In seguito alla miglioria apportata, una freccia permetterà sicuramente di trasmettere un
significato più chiaro per il bambino; inoltre sono stati eliminati dalla parte fisica del
prototipo tutti i dettagli che rendono caotica l’interfaccia per il bambino: le luci della carica
della batteria, i due altoparlanti (all’interno dei quali il piccola sarebbe tantato ad infilarci
piccoli oggetti), tasti senza una dicitura o un’ etichetta. Sicuramente, ora, l’impatto visivo è
più facilitato.
Gli esercizi sono stati resi più accessibili a tutti i bambini della fascia d’età considerata, dai
3 ai 6 anni, tenendo presente il diverso livello di apprendimento e di conoscenza.

8. In conclusione, ci riteniamo soddisfatti di questa prima riprogettazione, basata sul risultato
di un’analisi e di una valutazione imperniata sugli utenti ai quali era indirizzato il prodotto;
non ci saremmo aspettati di poter riscontrare molti più difetti di quanti ne avessimo
preventivati.
APPENDICE 1
Nell’allegato sarà presente un file che mostrerà le differenze fra il “prima” e il “dopo” dei
miglioramenti effettuati, con alcune videate che mostreranno come si stia proseguendo nel
lavoro di progettazione, successivo alla valutazione.