Embed Size (px)
Citation preview
Web Usability
Sistemi Distribuiti Corso di laurea in Ingegneria Informatica
Facoltà di Ingegneria - Università di Bologna7 giugno 2002
IndiceDefinizioneIl contesto economico, strutturale, sociale e tecnologicoInverse Acquisition Process
Lo sviluppo dell’interfacciaDesigner Conceptual ModelUser Conceptual Model
L’implementazioneElementi di Site DesignElementi di Page e Content Design
Definizione
Web Usability: concetto di ergonomia applicato agli ambienti digitali
Quindi tutto ciò che è volto a:
• facilitare
• ottimizzare
• velocizzare
• semplificare l’uso
Le Macro Componenti del ContestoEconomiche:
Ciclo di vita delle tecnologie
Strutturali:Peculiarità del supporto tecnologico (hardware)Peculiarità delle infrastrutture (connessioni)
Sociologiche:Comportamentali (bisogno, evoluzione cognitiva, aspettativa, abitudine, fiducia)
Inerenti i processi aziendali:Dinamiche di creazione del prodotto
Donald A. Norman, Il Computer Invisibile
Economiche
Ciclo di vita delle tecnologie
World Internet Project Italia - Bocconi, Economia&Management
Economiche
Tempo di diffusione della tecnologia
Da quanto tempo utilizza Internet?
5,3
4,9
19,8
33,9
18
12,3
2,8
2,8
0,3
0 10 20 30 40
meno di 3 mesi
da 3 mesi a 6 mesi
da 6 mesi a 1 anno
da 1 a 2 anni
da 2 a 3 anni
da 3 a 4 anni
da 4 a 5 anni
da più di 5 anni
non sa/ non risponde
Espe
rienz
a
Percentuale degli intervistati
Jupiter MMXI - At Home Panels
Economiche
Crescita della popolazione online
2.0003.0004.0005.0006.0007.0008.0009.000
10.00011.00012.00013.00014.00015.00016.00017.000
Janua
ry 01
Februa
ry 20
01Marc
h 2001
April 2
001
May 20
01Ju
ne 20
01Ju
ly 20
01Aug
ust 20
01
Septem
ber 20
01Octo
ber 20
01
Novem
ber 20
01
Decem
ber 20
01
FranceGermanyUKSpainItaly
Italy: + 47%
Jupiter MMXI - At Home Panels
Strutturali
Tipologia di connessione utilizzata Europa
38,8 47,4 52,9 55,3 55,6 54,2 51,5
7,211,7 17,3 23,7 30,5
3,5
1,2
0
20
40
60
80
100
2000 2001 2002 2003 2004 2005 2006
Dial-up Broadband
World Internet Project Italia - Bocconi, Economia&Management
Strutturali
Tipologia di connessione utilizzata Italia
Che tipo di connessione a Internet utilizza?
69,4
4,20,9
5,9
19,6
0
10
20
30
40
50
60
70
80
fino a 56k broadband(Adsl,
Fastweb, …)
mobileattraversocellulare
altro non sa/nonrisponde
Tipo di connessione
Perc
en
tuale
deg
li i
nte
rvis
tati
World Internet Project Italia - Bocconi, Economia&Management
Sociologiche
Percezione capacità di utilizzo del computerIn una scala da 1 (min) a 10 (max) valuti la sua capacità di
utilizzo del computer
27,8
4,2 4,6 5,1
11,810,2 10
4,72 2,6
17
0
5
10
15
20
25
30
1 (m
in) 2 3 4 5 6 7 8 9
10 (m
ax)
non
sa/ n
on ri
spon
de
Perc
en
tuale
deg
li i
nte
rvis
tati
Jupiter MMXI - At Home Panels
Sociologiche
Demographics popolazione online
Men : 63%Men : 63%
High Standard High Standard of Living : 41%of Living : 41%
Men : 50%
<35 years old : 52%<35 years old : 52% <35 years old : 53%
€€ $ High Standard High Standard of Living : 32%of Living : 32%$
Europe: France, Uk, Germany, Spain, Italy, Switzerland
Donald A. Norman, Il Computer Invisibile
Prospettive nella creazione di un prodotto
Aziendali
Inverse Acquisition Process
processo tradizionale
buy use
in ambiente web
use buy
Interface Design
Lo sviluppo dell’InterfacciaUser Conceptual Model
Immagine “mentale” che ciascun soggetto sviluppa inconsciamente interagendo con un sistema:
non necessariamente riflette esattamente la realtàma aiuta il soggetto a “predire” una reazione data un’azioneserve come modello di analisi di una situazione, comprensione e quindi genera l’azione
Processo iterativo
Interface Design
Lo sviluppo dell’interfacciaUser vs. Designer Conceptual Model
Interface Design
Interfaccia deve essere:Prevedibile Intuitiva
Elementi che devono convergere :
Tecnico-funzionaleComportamentaleEstetico
Efficiente, razionale ed organizzata
Rispondere alle aspettative ed al bisogno
Coerente, ordinata e semplice
Premesse
Lo scenario è in costante evoluzioneTecnologie, infrastrutture, capacità cognitivaUtente non è una costante ma una variabile
“Codificazioni” sono dettate dalla consuetudine
Il concetto di “standard” è prematuro
Site Design
Elementi di site design
Rispondere a due criteri fondamentali:gerarchiastrutturato in piccoli blocchi di informazioni
Processo si suddivide in 4 step:Dividere l’informazione in unità logicheIndividuare relazioniStabilire una gerarchiaAnalizzare la rispondenza ai criteri di funzionalità e ordine estetico
Non si legge on-screen
Coerenza conformità all’aspettativa abitudine fiducia
Necessità di orientare in un ambiente “libero”
Patrick J. Lynch, Sarah Horton, Web Style Guide: Basic Design Principles for Creating Web Sites
Site Design
Struttura – gerarchia web
Patrick J. Lynch, Sarah Horton, Web Style Guide: Basic Design Principles for Creating Web Sites
Site Design
La libertà di navigazione
Site Design
Usability Checklist – site design
La struttura è razionale ed equilibrataLe informazioni sono organizzate in piccoli blocchiLa struttura è di supporto, ma non imbrigliaCoerente con le esigenze dell’utente
Page Design
Elementi di page design
Rispondere a criteri fondamentali:Coerenza visiva e capacità di guida (fuoco, percorso)Compatibilità con il supporto tecnologico (peso e dimensioni)
Utente ha un approccio visivo in tre fasi:Visuale (grafica)Percettiva (struttura)Analitica (contenuto)
In media si perde l’attenzione dell’utente > 10 secondi
Coerenza conformità all’aspettativa abitudine fiducia
20% utenti utilizza le scroll bars
Patrick J. Lynch, Sarah Horton, Web Style Guide: Basic Design Principles for Creating Web Sites
Page Design
Struttura, contrasto e fuoco
Patrick J. Lynch, Sarah Horton, Web Style Guide: Basic Design Principles for Creating Web Sites
Page Design
Sequenza approccio visivo
Page Design
Elementi fondamentali struttura pagina
Elementi grafici, colore e struttura fuocoAsse visuale occidentale (sx dx, top bottom)Occhio percepisce il contrastoInformazione deve essere strutturata con il supporto della grafica, del colore e del testo
Vincoli:monitor 800x600browserconnessionela stampa (A4: 535x320)gamma colori
Patrick J. Lynch, Sarah Horton, Web Style Guide: Basic Design Principles for Creating Web Sites
Page Design
Visibilità pagina sul monitor
Patrick J. Lynch, Sarah Horton, Web Style Guide: Basic Design Principles for Creating Web Sites
Page Design
Layout pagina
Page Design
Usability Checklist – page design
Contenuti fondamentali sono nella parte alta della paginaLe informazioni sono organizzate verticalmente e da sinistra verso destraGli elementi testuali e di grafica sono coerentiLa necessità di scrolling è minimizzata
Content Design
Elementi testuali
Occhio individua primariamente le forme ed il contrastoLe maiuscole sono meno distinguibiliI blocchi di testo devono essere brevi e con elementi in evidenzaUtilità degli elementi differenzianti (titoli, bold)
Vincoli:differenze tra sistemiimpossibilità di prevedere le impostazioni dell’utentevariazioni browser
Patrick J. Lynch, Sarah Horton, Web Style Guide: Basic Design Principles for Creating Web Sites
Content Design
Leggibilità
Patrick J. Lynch, Sarah Horton, Web Style Guide: Basic Design Principles for Creating Web Sites
Content Design
Font - differenze
Patrick J. Lynch, Sarah Horton, Web Style Guide: Basic Design Principles for Creating Web Sites
Content Design
Il colore
Content Design
Usability Checklist – elementi testuali
Font di almeno 10-12 puntiChiarezza e contrasto con lo sfondoEvitare le maiuscoleBrevitàOmogeneità nell’utilizzo di font e colori
Overall Design: Usability
Usability Checklist – navigazione
Risponde alle aspettative comportamentali ed al bisogno dell’ utente
E’ strutturata in modo da garantire all’80% degli utenti l’80% delle funzioni richieste
…nel frattempo nel mondo reale…
Possiamo mettere a posto la nostra incomprensibile
interfaccia utente spendendo 1
milione di dollari…
..oppure possiamo chiudere gli occhi e sperare molto
intensamente che ai nostri utenti non importerà…
Lui sta risparmiando un milione di dollari.E tu che cosa hai
fatto oggi?
FontiJakob Nielsen Designing Web Usability
Tom Brinck, Darren Gergle, Scott D. WoodUsability for the Web
Patrick J. Lynch, Sarah HortonWeb Style Guide: Basic Design Principles for Creating Web Sites
Donald A. NormanIl Computer Invisibile
http://www.business2.com/webguide/0,,26399,00.html
Jupiter Media MetrixWorld Internet Project Italia – Università BocconiEconomia&Management
