Riprogettazione Dellinterfaccia
Upcoming SlideShare
Loading in...5
×
 

Riprogettazione Dellinterfaccia

on

  • 226 views

 

Statistics

Views

Total Views
226
Views on SlideShare
225
Embed Views
1

Actions

Likes
0
Downloads
0
Comments
0

1 Embed 1

http://www.linkedin.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Riprogettazione Dellinterfaccia Riprogettazione Dellinterfaccia Document Transcript

  • Università degli Studi di BariFacoltà di Scienze MM.FF.NNCorso di Laurea in Informatica e tecnologie per la produzione del softwareCorso di Interazione uomo macchina e progettazionedell’interazione con l’utenteProf.ssa Valeria Carofiglioa.a. 2011-2012 RIPROGETTAZIONE DELL’INTERFACCIA GADALETA FABIO SCHINO FRANCESCO TANGA CARMINE
  • 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
  • SEZIONE 1: SINTESI DELLE ANALISI E DELLEVALUTAZIONI1- SINTESI DEL PRIMO PROTOTIPODefinire un prototipo in fase iniziale di un progetto è molto più utile di definire un prodottocompleto 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à direalizzazione, 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 dellamaggior parte delle schermate e videate. Non possiamo dire di essere stati subitopienamente soddisfatti, ma siamo riusciti ad ottenere ottimi risultati dalle azioni dimiglioramento, soprattutto dopo aver effettuato dei test di usabilità dell’interazione con inostri utenti.Basandoci sul prototipo fin qui definito, provvederemo a trarne i vantaggi prima mancantie ad implementare miglioramenti non preventivabili in precedenza.2- SINTESI DEL WALKTHROUGHIl walkthrough associato al primo prototipo ci aveva già permesso di effettuare primeconsiderazioni interessanti, ma nella fase delle valutazioni euristiche successive non sonostate tenuto in considerazione.Le valutazioni empiriche sono state, invece, accorpate con le analisi del walkthrough dellaprima progettazione; molti dei risultati osservati in relazione alla prima rappresentazione
  • del prototipo cartaceo, sono stati riscontrati anche per il successivo prototipo migliorato, inquanto molti cambiamenti analizzati precedentemente non erano stati considerati, proprioperché la riprogettazione sarebbe stata necessaria anche dopo la valutazione preliminare,euristica ed empirica.Non si è voluto quindi apportare modifiche sostanziali al prototipo cartaceo, tranne cheprovare ad inserire alcune funzionalità prima assenti (come ad esempio i tasti volume o iltasto di ritorno) per poter ottenere un riscontro diverso dal risultato dell’analisi delwalkthrough.3- SINTESI DELLE VALUTAZIONI EURISTICHE EDEMPIRICHELe valutazioni euristiche ed empiriche hanno prodotto, come ci aspettavamo, molti risultatisia positivi che negativi. Positivi, perché gli utenti ci hanno segnalato numerosi elementisui quali poter lavorare in termini di miglioramento, negativi perché molte volte abbiamocreduto che un utente di così tenera età avrebbe affrontato con maggiore semplicità gliesercizi 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 primariprogettazione, sicuramente migliore dal punto di vista qualitativo.
  • SEZIONE 2: RIPROGETTAZIONE1- DESCRIZIONE DELLA RIPROGETTAZIONEL’analisi delle valutazioni è stata davvero difficile, non tanto per i dati raccolti, ma per laloro interpretazione. Da un errore di interpretazione può conseguire non un miglioramentoma 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’adeguatezzadel compito e alla facilità e rapidità di apprendimento. DESCRIZIONE DELLE CONFERMEIl menù esagonale, la prima delle schermate visibili, oltre al supporto fisico, è la nostraprima conferma. Migliorata a livello grafico e semplificata, non ha suscitato negli utenitnessun commento negativo, ma anzi solo stupore che ha stimolato la curiosità delbambino e quindi lo ha invogliato al suo utilizzo.Ulteriori conferme sono state registrate in relazione l livello di presentazione del menù: losfondo e i task sono stati ben orientati e le etichette non sono state necessarie, grazie alleimmagini già di per sé semplici e chiare. DESCRIZIONE DELLE MODIFICHEIn relazione al sistema, la maggior parte delle impostazioni sono state ritoccate, ma nondel tutto stravolte.Con riferimento al supporto fisico, abbiamo voluto rendere il prototipo meno spigoloso equindi più tondeggiante.Esso, a livello di impatto grafico, si presenta con una linea più “elegante” oltre che in uncolore neutro: non bianco perché troppo chiaro, nè nero perché troppo scuro: una via dimezzo, tendente quasi al metallico, secondo il gradimento degli utenti.La presenza di funzionalità poco chiare all’impatto frontale della vista dell’utente avrebbepotuto sicuramente confonderlo: ne è conseguita la necessità di eliminare i pulsanti delvolume e del ritorno e di inglobarli all’interno della schermata touch; le funzioni sonomodificabili attraverso semplici pressioni sullo schermo e sono state posizionate agli angoli
  • dell’esagono, in modo tale da risultare visibili e facilmente comprensibili attraverso leimmagini simboliche che le rappresentano.Oltre a queste modifiche, abbiamo voluto aggiungere la funzione di luminosità delloschermo, 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 deiled indicanti il livello di carica del dispositivo: lo status di crica è stato spostato all’internodella 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 allawebcam.Tutto ciò per ottenere un hardware più elegante e meno difficile da interpretare.Altro aspetto fondamentale è stato rendere più comprensibile e meno confusionaria anchela parte tattile del touch screen.Partendo dalla poca chiarezza delle immagini che abbiamo potuto osservare, le lettereminuscole, per un bambino, non sono risultate molto comprensibili e abbiamo deciso dieffettuare una sostituzione con le lettere maiuscole.Oltre all’intervento sulle lettere, alcune forme poco note al bambino hanno confuso le sueidee. Ne è conseguita la nostra volontà di rimuovere alcune forme difficili da interpretare(come il pentagono o l’esagono), aggiungendo forme già conosciute dagli utenti einserendole 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’immaginesarà sostituita con delle chiazze di colore simili a schizzi su un muro bianco; questaversione del menù ci è sembrata molto più adatto a ciò che un bambino farebbe se sitrovase davanti ad un muro con la possibilità di colorarlo.In relazione ai sottomenù, ognuno di essi conteneva al suo interno 3 sottotask, uno perogni esercizio, e un menù di sfondo troppo nitido e luminoso nel quale era facile perdersi econfondersi. Per questo motivo abbiamo deciso di ridurre la trasparenza dello sfondo, inmodo da farlo risultare in secondo piano rispetto ai task; questi ultimi, inoltre, non sarannopiù rappresentati da un’immagine statica ma da un’animazione dell’esercizio con unesempio del suo svolgimento, in modo da far capire intuitivamente all’utente cosapotrebbe 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 eci hanno fatto notare.Iniziamo dal ricopiare la lettera.
  • L’esercizio per dipingere la lettera aveva una similitudine con la realtà, ovvero unsecchiello dove intingere il dito ma, visto e osservato che quasi nessuno degli utentieseguiva la procedura così come l’avevamo pensata, abbiamo voluto rendere la lorointerazione quanto più possibile simile alla realtà, senza il secchiello nel quale intingeredigitalmente il dito, lasciando invariato il resto dell’interfaccia.L’associazione di colori è stata resa molto meno complicata. L’utente non avrà più ilcompito di scegliere il nome del colore e il colore da associare, ma solo i nomi daselezionare. Così alla sua pressione, la casella esagonale si riempirà del colore scelto egenererà 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 icolori senza rendere noiosa la loro interazione.Inoltre, sono stati sostituiti alcuni colori poco noti, come il magenta e il ciano, con coloripiù 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 adesempio alle preferenze non tutte uguali dei bambini, ma abbiamo cercato di soddisfare lamaggior parte di loro attraverso le migliorie apportate.2- QUALITA’ DEL PROGETTONon è possibile stabilire la qualità del progetto a priori e soprattutto non è possibilevalutarla oggettivamente senza analizzarne l’impatto reale sull’utenza, proprio perché iltarget 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 alcunitasti fisici.In seguito alla miglioria apportata, una freccia permetterà sicuramente di trasmettere unsignificato più chiaro per il bambino; inoltre sono stati eliminati dalla parte fisica delprototipo tutti i dettagli che rendono caotica l’interfaccia per il bambino: le luci della caricadella batteria, i due altoparlanti (all’interno dei quali il piccola sarebbe tantato ad infilarcipiccoli 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, dai3 ai 6 anni, tenendo presente il diverso livello di apprendimento e di conoscenza.
  • In conclusione, ci riteniamo soddisfatti di questa prima riprogettazione, basata sul risultatodi 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 avessimopreventivati.APPENDICE 1Nell’allegato sarà presente un file che mostrerà le differenze fra il “prima” e il “dopo” deimiglioramenti effettuati, con alcune videate che mostreranno come si stia proseguendo nellavoro di progettazione, successivo alla valutazione.