Progetto IUM

23/02/2015

​

I Love FantaCappuccio

Cos’è I Love Calcio?

I love calcio è una delle applicazioni web legate al calcio più popolari di Facebook.

​

La sua pagina vanta oltre 1,2M di “mi piace”, permette di gestire una squadra virtuale dal punto di vista economico e manageriale, e sfidare gli amici o altri utenti della piattaforma.

Il problema

Il problema di «I Love Calcio»

I problemi che andiamo ad analizzare sono quelli che riguardano la versione web dell’applicazione per smartphone.

​

I principali sono:

• Accesso obbligatorio tramite browser o l’applicazione «Facebook»
• Tempi di accesso all’applicazione troppo alti
• Apertura del Browser Ricerca di «I Love Calcio» Accesso al sito Login
• Apertura di Facebook Ricerca di «I Love Calcio» Attesa dell’apertura del browser Login

​

Il problema di «I Love Calcio» (2)

• Molti task da compiere per raggiungere un obiettivo con conseguente scoraggiamento dell’utente soprattutto nello schieramento della formazione:
• Browser Ricerca-pagina Login Menu Formazione
• Browser Ricerca-pagina Login Menu Classifica

​

• I problemi appena descritti sono una piccola parte del problema di interazione da noi scelto per questo progetto.
• Il nostro lavoro si è maggiormente focalizzato sulle problematiche relative alla poca intuitività nella «gestione dello schieramento della formazione»
• Analizzeremo approfonditamente questo problema nelle slides successive.

​

Tutto questo comporta un’esperienza utente non ottimale!

​

La nostra soluzione:

Abbiamo provato a sviluppare un prototipo di applicazione Android chiamata «I Love FantaCappuccio» per ovviare ai problemi descritti in precedenza:

• Essendo una applicazione mobile non necessita dell’accesso tramite browser
• Tempi di accesso migliorati:
• Apertura dell’app Login
• Task per raggiungere gli obiettivi interni diminuiti:
• Login Formazione
• Login Classifica

La realizzazione del prototipo

Prototipo a bassa fedeltà

La realizzazione del prototipo a bassa fedeltà è la seguente:

​

​

​

Il problema della formazione

Il problema della formazione

Il problema fondamentale che ci proponiamo di risolvere è quello di migliorare l’esperienza dell’utente di «I Love Calcio» nello schieramento della formazione.

Infatti nella versione web sorgono i seguenti problemi:

1. Visualizzazione:
1. Visione incompleta della formazione
2. Posizionamento pulsanti:
1. Pulsanti «Cambio Modulo» e «Salva Formazione» troppo distanti fra loro

​

Il problema della formazione (2)

3. Schieramento giocatore:
1. Selezione del giocatore desiderato
2. Click sul giocatore da sostituire

Questo tipo di interfaccia può portare l’utente a commettere un errore evidenziato anche nei test di valutazione.

​

Errore doppio click

Il problema della formazione (3)

4. Ambiguità schieramento:
• Lunga lista di giocatori

​

Poca distinzione tra i reparti

​

Questo tipo di interfaccia può suggerire all’utente che un giocatore possa essere schierato in qualsiasi ruolo.

​

La soluzione per la formazione

La soluzione per la formazione

Con la nostra applicazione «I Love FantaCappuccio» riusciamo ad eliminare tutti i problemi elencati precedentemente

Infatti:

1. Visualizzazione :
• Tutta la formazione in un’unica schermata
• Posizionamento Pulsanti:
• Meglio posizionati
• Più facili da raggiungere
• Sempre visibili all’utente

​

​

​

La soluzione per la formazione (2)

• Schieramento giocatore :
• Click sul giocatore da sostituire
• Scelta del sostituto all’apertura del dialog
• Il focus si sposta sul dialog

​

Eliminato errore doppio click

5. Ambiguità schieramento:
1. Il dialog contiene solo giocatori che appartengono ad un ruolo specifico

​

Le soluzioni proposte comportano una notevole

riduzione degli errori da parte dell’utente!

​

​

​

Inserimento Sostituzione

Realizzazione finale

Prototipo ad alta fedeltà

La realizzazione del prototipo ad alta fedeltà è la seguente:

​

​

​

Prototipo ad alta fedeltà: Schermata di login

Schermata di «Login» che presenta due campi di testo che conterranno email e password.

Dopo la loro compilazione, il bottone «Accedi» permetterà di effettuare l’accesso all’account personale dell’applicazione.

Spiegazione generale

Per facilitare lo spostamento tra le schermate, abbiamo implementato la funzionalità «swipe», ma è possibile muoversi tra di esse anche cliccando sulle icone della tab nella parte superiore dello schermo, come illustrato nei video.

​

Prototipo ad alta fedeltà:�Schermata Home

Dopo aver effettuato l’accesso verrà visualizzata la schermata principale «Home».

Vengono presentati i dati dell’utente, della squadra da lui creata e del campionato in cui milita.

Prototipo ad alta fedeltà:�Schermata Formazione

Viene proposta una formazione vuota che può essere riempita intuitivamente dall’utente tramite il click sulle magliette e la scelta del giocatore.

…

​

Prototipo ad alta fedeltà:�Schermata Formazione �– Scelta del giocatore

1. Al click sulla maglietta, si apre un dialog che contiene una lista di nomi dei giocatori, suddivisi per ruolo, che è possibile selezionare.

​

Il posto vuoto viene occupato dalla maglietta della squadra a cui appartiene il giocatore selezionato.

Prototipo ad alta fedeltà:�Schermata Formazione �– Scelta del modulo

2. Cliccando l’icona del modulo si apre un dialog che permette di scegliere un modulo da adottare tra quelli proposti.

​

Una volta scelto un nuovo modulo, viene modificata la disposizione delle magliette nel campo.

Prototipo ad alta fedeltà:�Schermata Formazione �– Scelta della panchina

3. Cliccando l’icona della panchina viene visualizzato l’elenco dei giocatori non titolari.

​

Per tornare alla schermata principale della formazione, si deve cliccare sul tasto «Annulla» o sul tasto «Back» del device.

Prototipo ad alta fedeltà:�Schermata Formazione �– Conferma formazione

4. Premendo il tasto conferma verranno confermati formazione e modulo.

​

La conferma è possibile solo se son stati schierati gli undici titolari.

​

Alla pressione del tasto comparirà una notifica Toast che comunicherà l’avvenuta conferma.

Prototipo ad alta fedeltà:�Schermata classifica

La schermata «Classifica» visualizza l’elenco delle squadre con la relativa posizione

​

Un’icona posizionata accanto al nome della propria squadra permette all’utente di identificarne velocemente la posizione in classifica.

Tecnologia usata:

Android 4.4 e XML

Java 1.8

2 Samsung Galaxy S4

​

Valutazione

Preparazione del test

• Obiettivo:
• Valutare l’applicazione «I Love FantaCappuccio»
• Durata:
• 180 secondi massimo per ogni tester
• Luogo:
• Palazzo delle Scienze ,Dipartimento di Informatica, Aula C
• Tester:
• Campione di 14 utenti valutati secondo un design Within Subjects

​

​

​

​

​

​

Preparazione del test (2)

• Task da svolgere dal tester:
• Cambiare modulo
• Inserire la formazione con almeno 11 titolari
• Confermare la formazione
• Criteri di successo e insuccesso
• Successo:
• Completamento del task entro i 180 secondi
• Insuccesso:
• Completamento del task oltre i 180 secondi
• Abbandono del test

​

​

​

Preparazione del test (3)

• Supporto hardware/software:
• Samsung Galaxy S4 con Android 4.4.2 per entrambe le versioni
• Suddivisione dei compiti:
• Un membro supervisiona la web app
• Un membro supervisiona l’app «I Love FantaCappuccio»
• Un membro cronometra il tempo di completamento del task e prende nota di eventuali errori della web app
• Un membro cronometra il tempo di completamento del task e prende nota di eventuali errori dell’app «I Love FantaCappuccio»

​

Fase di introduzione

• Informazioni fornite:
• Non stiamo valutando l’utente
• Possono andarsene quando vogliono anche in caso di non completamento del test
• Conoscenze:
• Abbiamo chiesto agli utenti di indicare il loro grado di esperienza in ambito calcistico (4 su 14 appartengono al target)

​

Fase di esecuzione

• Alberto e Riccardo hanno:
• Supervisionato gli utenti durante il test
• Osservato il comportamento degli utenti
• Fornito ulteriori chiarimenti ricordando il compito da svolgere
• Fabrizio e Matteo hanno:
• Raccolto i dati relativi al tempo di completamento
• Annotato l’insieme degli errori commessi da ogni singolo tester

​

Fase di debriefing

• Opinioni degli utenti su «I Love Calcio»
• Scarsa usabilità
• Confusionale
• Opinioni degli utenti su «I Love FantaCappuccio»
• Più semplice
• Interfaccia più intuitiva

​

​

​

Analisi dei dati

Comparazione delle medie: t-test

• Considerando che:
• Dobbiamo comparare le due medie ottenute:
• Il tempo di completamento di «I Love Calcio»
• Il tempo di completamento di «I Love FantaCappuccio»
• Gli utenti hanno utilizzato entrambi gli applicativi Within Subjects

​

utilizziamo il Paired t-test, calcolando:

• Media delle differenze
• Deviazione standard

​

Dati

Leggenda:

• Dati in grassetto:
• Tester con esperienza calcistica
• A:
• Tester che hanno abbandonato il test
• OT:
• Tester che hanno superato il tempo massimo concesso

​

I dati sono espressi in secondi e approssimati

​

Calcolo della deviazione standard

Abbiamo calcolato la media della differenza.

Ora calcoliamo la deviazione standard:

Calcolo del t-test e di p-value

Calcolo dell’intervallo di confidenza

Considerazioni finali

• Dai dati raccolti abbiamo constatato che:
• Il tempo di completamento medio è a favore dell’applicazione «I Love FantaCappuccio» con 11 sec di differenza
• Tutti i tester sono riusciti a completare il task proposto per la versione mobile
• 5 tester non sono riusciti a completare il task proposto per la versione web
• 3 hanno superato il tempo massimo concesso
• 2 hanno abbandonato il test
• Aspetti emotivi:
• Tutti i tester hanno espresso una considerazione positiva sull’esperienza d’uso della nostra applicazione

​

​

​

Considerazioni finali (2)

• Target:
• Alcune anomalie riscontrate sui dati raccolti possono essere riconducibili alla poca esperienza in ambito calcistico della maggioranza dei tester (10 su 14)
• Es: non riconoscimento immediato dell’icona «Modulo» e «Panchina»
• Al contrario, gli utenti aventi una maggiore esperienza calcistica, hanno:
• Identificato immediatamente l’icona «Modulo»
• Effettuato scelte ponderate durante lo schieramento dei giocatori in un tempo ragionevole

​

L’app «I Love FantaCappuccio» � è stata realizzata da:

​

• Atzori Riccardo
• Collu Alberto
• Giustino Matteo
• Meloni Fabrizio

Grazie per l’attenzione!