Corso di Interazione Uomo Macchina
AA 2013-2014
Roberto Polillo
Corso di laurea in Informatica
Università di Milano Bicocca
Dipartimento di Informatica, Sistemistica e Comunicazione
IL PROGETTO D'ESAME3
Edizione
2013-14
Queste slides…
… si basano sul libro “Facile da usare”, dell’autore, dove si trovano
tutte le necessarie spiegazioni. Vedi www.rpolillo.it
Queste slide sono disponibili con licenza Creative Commons
(attribuzione, non commerciale, condividi allo stesso modo) a
chiunque desiderasse utilizzarle, per esempio a scopo didattico,
senza necessità di preventiva autorizzazione:
http://creativecommons.org/licenses/by-nc-sa/3.0/it/deed.it
La licenza non si estende alle immagini fotografiche e alle screen
shots, i cui diritti restano in capo ai rispettivi proprietari, che sono
stati indicati, ove possibile, nelle didascalie del libro. L’autore si
scusa per eventuali omissioni, e resta a disposizione per
correggerle.
R.Polillo - Marzo 2014
2
Scopo di questa lezione
Descrivere gli obiettivi e le modalità di
realizzazione
del progetto di esame
R.Polillo - Marzo 2014
3
Il progetto
 Realizzazione del prototipo di un'applicazione mobile usabile
(smartphone, tablet), proposto dagli studenti e approvato dai
docenti
 Uso di un toolkit per sviluppo app mobili
 Progettazione centrata sull'utente, processo di progettazione
iterativo, con test di usabilità e scenari d'uso
 In gruppo (di 3), ripartendosi i compiti
R.Polillo - Marzo 2014
4
Scelta del progetto
Scegliete un tema che:
conoscete bene
sia semplice
sia tecnologicamente fattibile
Abbia caratteristiche innovative
Anche un tema in apparenza banale può portare a un
progetto innovativo
R.Polillo - Marzo 2014
5
Il vostro progetto: deliverable
R.Polillo - Marzo 2014
6
Requisiti
Progettazione
Realizzazione
Test
1. Requisiti
3. Protipo lo-fi
4. Protipo med-fi
Revisione
Esame
2. Video-scenario
5. Video test usabilità
6. Report test usabilità
2
Il progetto
R.Polillo -Marzo 2013
4
Esame
Navigazione a posto
Document
o dei
requisiti
Prototipo
di carta
Revisione
Video
scenario
Primo
prototipo
(toolkit)
2
1
Secondo
prototipo
(toolkit)
Test
usabilità
(con video)
3
Revis.
Revisione
Alle revisioni devono
partecipare TUTTI
i componenti del gruppo
Il progetto: prima fase
R.Polillo -Marzo 2013
Document
o dei
requisiti
Prototipo
di carta
Revisione
Video
scenario
1
Video
max 3 minuti
Slides PowerPoint
(template)
Paper prototype
eseguibile
Alle revisioni devono
partecipare TUTTI
i componenti del gruppo
Il documento dei requisiti
Parte Prima: Generalità
 Descrizione generale del prodotto
 Obiettivi del prodotto
 Utenti
 Contesti d’uso
 Scenari d’uso
 Fattibilità tecnologica
Parte Seconda: Posizionamento
 Situazione attuale
 Analisi della concorrenza
 Posizionamento competitivo
Parte Terza: Requisiti
 Casi d’uso
 Requisiti per la esperienza utente
 Altri requisiti
Riferimenti
R.Polillo - Marzo 2014
Valutato su forma e
contenuti
9
 Sintetico ma completo,
ben strutturato,
 Userete un template
PowerPoint molto
semplice, da
personalizzare
Il video scenario
 Video di max 3 minuti che mostri tipici casi
d'uso del sistema, collocati nel contesto d'uso
 Non deve illustrare in dettaglio l'interfaccia
utente, ma il "concept" generale: quando,
dove e perché si usa
 Non interessa la qualità tecnica (usate il
telefonino): ciò che importa è la chiara
illustrazione del concept del prodotto
R.Polillo - Marzo 2014
10
Esempi di video-scenario
R.Polillo - Marzo 201411
 Con prototipo di carta (3’)
Applicazione per PDA per incontrare amici all’Università
http://it.youtube.com/watch?v=c4-A-9hGn0U
 Order processing (2')
https://www.youtube.com/watch?v=k0AiPRtcD5w
 Videoconferencing col ristorante in macchina (2')
https://www.youtube.com/watch?v=ZSMPKIe578w
 Orologio intelligente (2')
http://www.youtube.com/watch?v=lJLI4Aw897U
 Motorola new life forms (3,4')
https://www.youtube.com/watch?v=78QBVEJUqXs
(segue)
 Lampade programmabili (4')
https://www.youtube.com/watch?
v=Vf0nLCDcTDc
 Recharge your health in car (1') (con disegni)
https://www.youtube.com/watch?v=1vYQFt_7OjI
R.Polillo - Marzo 2014
12
Il prototipo di carta
 Schermate disegnate grossolanamente su
foglietti di carta
 Fotografate col telefonino
 Inserite in POP e rese cliccabili
 Esecuzione simulata con un paio di utenti
SCOPO: MESSA A PUNTO DELLLA
STRUTTURA DI NAVIGAZIONE
R.Polillo - Marzo 2014
13
Iniziate così…
R.Polillo - Marzo 2014
14
Poi così…
R.Polillo - Marzo 2014
15
POP: Prototyping on Paper
R.Polillo -
Marzo 201416
App per iPhone / iPad / Android: https://popapp.in
2
Il progetto: seconda fase
R.Polillo -Marzo 2013
Navigazione a posto
Document
o dei
requisiti
Prototipo
di carta
Revisione
Video
scenario
Primo
prototipo
(toolkit)
2
1
Revis.
Video
max 3 minuti
Slides PowerPoint
(template)
Paper prototype
eseguibile
Alle revisioni devono
partecipare TUTTI
i componenti del gruppo
R.Polillo - Marzo 2014
2
Il progetto: terza fase
R.Polillo -Marzo 2013
Navigazione a posto
Document
o dei
requisiti
Prototipo
di carta
Revisione
Video
scenario
Primo
prototipo
(toolkit)
2
1
Secondo
prototipo
(toolkit)
3
Revis.
Revisione
Video
max 3 minuti
Slides PowerPoint
(template)
Paper prototype
eseguibile
Alle revisioni devono
partecipare TUTTI
i componenti del gruppo
2
Il progetto: quarta fase
R.Polillo -Marzo 2013
4
Esame
Navigazione a posto
Document
o dei
requisiti
Prototipo
di carta
Revisione
Video
scenario
Primo
prototipo
(toolkit)
2
1
Secondo
prototipo
(toolkit)
Test
usabilità
(con video)
3
Revis.
Revisione
Prototipo
finale
(toolkit)
Video
max 3 minuti
Alle revisioni devono
partecipare TUTTI
i componenti del gruppo
Slides PowerPoint
(template)
Paper prototype
eseguibile
Report + videoPrototipo
Il test di usabilità
 Faremo una lezione sull'argomento
 Sul prototipo finale deve essere fatto un test di
usabilità strutturato (3 utenti), e descritto in un
rapporto di test (template Word sul sito)
 Durante il processo di prototipazione possono
essere fatti test di usabilità informali, non
documentati
R.Polillo - Marzo 2014
21
Il rapporto di test: indice di
massima
Obiettivi del test
Metodologia usata
Utenti
Compiti/scenari
Strumentazione
Modalità di svolgimento
Risultati del test
Analitici, con le misure
Raccomandazioni finali
Analitiche, con livelli di priorità
Allegati:
Eventuali questionari utilizzati
R.Polillo - Marzo 2014
22
Suggerimenti
 Tenete sempre presenti gli obiettivi del prototipo, e
concentratevi sugli aspetti importanti, lasciando
perdere i dettagli irrilevanti (es. messaggi di errore,
login, …)
 Non stiamo realizzando il prodotto finale, ma un
prototipo per definire e verificare l'interfaccia e la
navigazione: la elaborazione dei dati non ci
interessa: non perdete tempo su questi
R.Polillo - Marzo 2014
23
Ed ora…
 Formazione dei gruppi
 Discussione delle proposte
 Buon lavoro!
R.Polillo - Marzo 2014
24

3. Il progetto di esame

  • 1.
    Corso di InterazioneUomo Macchina AA 2013-2014 Roberto Polillo Corso di laurea in Informatica Università di Milano Bicocca Dipartimento di Informatica, Sistemistica e Comunicazione IL PROGETTO D'ESAME3 Edizione 2013-14
  • 2.
    Queste slides… … sibasano sul libro “Facile da usare”, dell’autore, dove si trovano tutte le necessarie spiegazioni. Vedi www.rpolillo.it Queste slide sono disponibili con licenza Creative Commons (attribuzione, non commerciale, condividi allo stesso modo) a chiunque desiderasse utilizzarle, per esempio a scopo didattico, senza necessità di preventiva autorizzazione: http://creativecommons.org/licenses/by-nc-sa/3.0/it/deed.it La licenza non si estende alle immagini fotografiche e alle screen shots, i cui diritti restano in capo ai rispettivi proprietari, che sono stati indicati, ove possibile, nelle didascalie del libro. L’autore si scusa per eventuali omissioni, e resta a disposizione per correggerle. R.Polillo - Marzo 2014 2
  • 3.
    Scopo di questalezione Descrivere gli obiettivi e le modalità di realizzazione del progetto di esame R.Polillo - Marzo 2014 3
  • 4.
    Il progetto  Realizzazionedel prototipo di un'applicazione mobile usabile (smartphone, tablet), proposto dagli studenti e approvato dai docenti  Uso di un toolkit per sviluppo app mobili  Progettazione centrata sull'utente, processo di progettazione iterativo, con test di usabilità e scenari d'uso  In gruppo (di 3), ripartendosi i compiti R.Polillo - Marzo 2014 4
  • 5.
    Scelta del progetto Sceglieteun tema che: conoscete bene sia semplice sia tecnologicamente fattibile Abbia caratteristiche innovative Anche un tema in apparenza banale può portare a un progetto innovativo R.Polillo - Marzo 2014 5
  • 6.
    Il vostro progetto:deliverable R.Polillo - Marzo 2014 6 Requisiti Progettazione Realizzazione Test 1. Requisiti 3. Protipo lo-fi 4. Protipo med-fi Revisione Esame 2. Video-scenario 5. Video test usabilità 6. Report test usabilità
  • 7.
    2 Il progetto R.Polillo -Marzo2013 4 Esame Navigazione a posto Document o dei requisiti Prototipo di carta Revisione Video scenario Primo prototipo (toolkit) 2 1 Secondo prototipo (toolkit) Test usabilità (con video) 3 Revis. Revisione Alle revisioni devono partecipare TUTTI i componenti del gruppo
  • 8.
    Il progetto: primafase R.Polillo -Marzo 2013 Document o dei requisiti Prototipo di carta Revisione Video scenario 1 Video max 3 minuti Slides PowerPoint (template) Paper prototype eseguibile Alle revisioni devono partecipare TUTTI i componenti del gruppo
  • 9.
    Il documento deirequisiti Parte Prima: Generalità  Descrizione generale del prodotto  Obiettivi del prodotto  Utenti  Contesti d’uso  Scenari d’uso  Fattibilità tecnologica Parte Seconda: Posizionamento  Situazione attuale  Analisi della concorrenza  Posizionamento competitivo Parte Terza: Requisiti  Casi d’uso  Requisiti per la esperienza utente  Altri requisiti Riferimenti R.Polillo - Marzo 2014 Valutato su forma e contenuti 9  Sintetico ma completo, ben strutturato,  Userete un template PowerPoint molto semplice, da personalizzare
  • 10.
    Il video scenario Video di max 3 minuti che mostri tipici casi d'uso del sistema, collocati nel contesto d'uso  Non deve illustrare in dettaglio l'interfaccia utente, ma il "concept" generale: quando, dove e perché si usa  Non interessa la qualità tecnica (usate il telefonino): ciò che importa è la chiara illustrazione del concept del prodotto R.Polillo - Marzo 2014 10
  • 11.
    Esempi di video-scenario R.Polillo- Marzo 201411  Con prototipo di carta (3’) Applicazione per PDA per incontrare amici all’Università http://it.youtube.com/watch?v=c4-A-9hGn0U  Order processing (2') https://www.youtube.com/watch?v=k0AiPRtcD5w  Videoconferencing col ristorante in macchina (2') https://www.youtube.com/watch?v=ZSMPKIe578w  Orologio intelligente (2') http://www.youtube.com/watch?v=lJLI4Aw897U  Motorola new life forms (3,4') https://www.youtube.com/watch?v=78QBVEJUqXs
  • 12.
    (segue)  Lampade programmabili(4') https://www.youtube.com/watch? v=Vf0nLCDcTDc  Recharge your health in car (1') (con disegni) https://www.youtube.com/watch?v=1vYQFt_7OjI R.Polillo - Marzo 2014 12
  • 13.
    Il prototipo dicarta  Schermate disegnate grossolanamente su foglietti di carta  Fotografate col telefonino  Inserite in POP e rese cliccabili  Esecuzione simulata con un paio di utenti SCOPO: MESSA A PUNTO DELLLA STRUTTURA DI NAVIGAZIONE R.Polillo - Marzo 2014 13
  • 14.
  • 15.
  • 16.
    POP: Prototyping onPaper R.Polillo - Marzo 201416 App per iPhone / iPad / Android: https://popapp.in
  • 17.
    2 Il progetto: secondafase R.Polillo -Marzo 2013 Navigazione a posto Document o dei requisiti Prototipo di carta Revisione Video scenario Primo prototipo (toolkit) 2 1 Revis. Video max 3 minuti Slides PowerPoint (template) Paper prototype eseguibile Alle revisioni devono partecipare TUTTI i componenti del gruppo
  • 18.
  • 19.
    2 Il progetto: terzafase R.Polillo -Marzo 2013 Navigazione a posto Document o dei requisiti Prototipo di carta Revisione Video scenario Primo prototipo (toolkit) 2 1 Secondo prototipo (toolkit) 3 Revis. Revisione Video max 3 minuti Slides PowerPoint (template) Paper prototype eseguibile Alle revisioni devono partecipare TUTTI i componenti del gruppo
  • 20.
    2 Il progetto: quartafase R.Polillo -Marzo 2013 4 Esame Navigazione a posto Document o dei requisiti Prototipo di carta Revisione Video scenario Primo prototipo (toolkit) 2 1 Secondo prototipo (toolkit) Test usabilità (con video) 3 Revis. Revisione Prototipo finale (toolkit) Video max 3 minuti Alle revisioni devono partecipare TUTTI i componenti del gruppo Slides PowerPoint (template) Paper prototype eseguibile Report + videoPrototipo
  • 21.
    Il test diusabilità  Faremo una lezione sull'argomento  Sul prototipo finale deve essere fatto un test di usabilità strutturato (3 utenti), e descritto in un rapporto di test (template Word sul sito)  Durante il processo di prototipazione possono essere fatti test di usabilità informali, non documentati R.Polillo - Marzo 2014 21
  • 22.
    Il rapporto ditest: indice di massima Obiettivi del test Metodologia usata Utenti Compiti/scenari Strumentazione Modalità di svolgimento Risultati del test Analitici, con le misure Raccomandazioni finali Analitiche, con livelli di priorità Allegati: Eventuali questionari utilizzati R.Polillo - Marzo 2014 22
  • 23.
    Suggerimenti  Tenete semprepresenti gli obiettivi del prototipo, e concentratevi sugli aspetti importanti, lasciando perdere i dettagli irrilevanti (es. messaggi di errore, login, …)  Non stiamo realizzando il prodotto finale, ma un prototipo per definire e verificare l'interfaccia e la navigazione: la elaborazione dei dati non ci interessa: non perdete tempo su questi R.Polillo - Marzo 2014 23
  • 24.
    Ed ora…  Formazionedei gruppi  Discussione delle proposte  Buon lavoro! R.Polillo - Marzo 2014 24