La presentazione è in caricamento. Aspetta per favore

La presentazione è in caricamento. Aspetta per favore

Web Usability Dott. Simone Lazzini Università di Pisa.

Presentazioni simili


Presentazione sul tema: "Web Usability Dott. Simone Lazzini Università di Pisa."— Transcript della presentazione:

1 Web Usability Dott. Simone Lazzini Università di Pisa

2 Come si persegue la usability? ( Realizzazione e gestione di un sito web) Strategia e fattibilità Management, Consulenti 1 Visual design Visual designer 3 Esercizio del sito Web master 6 Gestione dei server Web farm 7 Sviluppo del software System integrator 4 5 Content editor Gestione dei contenuti Web designer 2 Web design & user experience Connettività internet Internet Service Provider 8

3 Comunicazione Usabilità FunzionalitàContenuto Accessibilità Obiettivi Architettura Gestione Quali elementi di valutazione è possibile analizzare Strategia e fattibilità Management, Consulenti 1 Visual design Visual designer 3 Esercizio del sito Web master 6 Gestione dei server Web farm 7 Sviluppo del software System integrator 4 5 Content editor Gestione dei contenuti Web designer 2 Web design & user experience Connettività internet Internet Service Provider 8

4 Contenuto Il contenuto informativo è corretto, e adeguato agli scopi del sito? Comunicazione Il sito raggiunge i suoi obiettivi di comunicazione? Accessibilità Il sito è di facile accesso per tutti? Funzionalità Le funzioni del sito sono adeguate e corrette? Gestione Loperatività del sito è ben gestita ? Architettura La struttura e la navigazione del sito sono adeguate? Usabilità Il sito è facile da usare? Un primo modello di analisi

5 Quindi un sito è usabile quando è : BISOGNI Identificare i BISOGNI degli utenti Progettare e valutare prodotti FACILI DA USARE Identificare i FATTORI CHE MOTIVANO gli utenti UTILE FRUIBILE DESIDERABILE

6 EfficaciaEfficienza Soddisfazione Utilità Appropriatezza Velocità Affidabilità Scalabilità Facilità duso Piacevolezza Semplicità QUALI SONO LE DIMENSIONI DA CONSIDERARE Il sito deve essere strutturato in modo da richiedere il minimo numero di passi per accedere allinformazione voluta tenendo presente il numero di elementi che l'utente riesce a mantenere contemporaneamente in memoria (tipicamente un numero variabile da 4 a 7) e garantendo comunque il minor tempo di accesso possibile.

7 Usability e Architettura dellinformazione Struttura Mappatura Navigazione

8 Lanalisi della Struttura del sito La rappresentazione avviene, di solito, mediante un diagramma ad albero, allo scopo di valutarne la adeguatezza BCDEA HOME D1D2D3 A2A1 A2.2A2.3A2.1 1° livello 2° livello 3° livello

9 Larchitettura strutturale comunica la relazione tra i contenuti di un sito web e il modo in cui questi sono espressi. Aiuta a capire come si utilizza il sito. Rende accessibili e quindi più comprensibili i suoi contenuti informativi. Lanalisi della Struttura del sito – Gli scopi

10 Tre strutture di base 1) Lineare Una pagina dopo laltra. Struttura adatta per costruire funzioni vincolanti: se, ad esempio, linformazione A deve essere conosciuta prima della B, e la B prima della C, si crea un accesso lineare da A a C. 2) Gerarchica Più percorsi mutuamente esclusivi Adatta ad evidenziare le relazioni insieme/sotto insieme Consente movimenti top-down / bottom-up.

11 3) A ragnatela Pagine collegate in modo da permettere riferimenti incrociati e salti avanti/indietro. Struttura che esalta le potenzialità dei sistemi interattivi. Ma più la ragnatela è complessa, più aumentano le difficoltà di orientamento per lutente. I livello HOME II Livello I livello II Livello

12 v Navigando cerco un sito per valutare la possibilità di comprare una motosega: Lo scenario di Krug: UTENSILI Dove sono le motoseghe? La struttura del sito presenta tre reparti… CASALINGHI PRATO E GIARDINO Ogni volta che si aggiungono nuovi contenuti bisogna valutare la loro coerenza rispetto allarchitettura complessiva del sito. Trovare una collocazione adatta o riprogettare larchitettura stessa. Le possibili strutture possono essere moltissime ed avere i caratteri di ciascuna ma…

13 Seguendo il vostro intuito provate a vedere se la motosega si trova sotto UTENSILI… il livello successivo è? UTENSILI A MOTORE …nella corsia UTENSILI A MOTORE cercate la motosega ma??? UTENSILI MANUALI SMERIGLIARE E LEVIGARE UTENSILI PRATO E GIARDINO UTENSILI A MOTORE UTENSILI MANUALI SMERIGLIARE E LEVIGARE CASALINGHI HOME

14 Una struttura a ragnatela Una struttura a ragnatela consente una molteplicità di percorsi possibili. Progettando larchitettura di un sito web si possono sfruttare queste potenzialità, ma bisogna mantenere un modello concettuale coerente, evitando che lutente si smarrisca. UTENSILI PRATO E GIARDINO Utensili per il giardino Utensili per cucina CASALINGHI Utensili a motore Smerigliare e levigare Utensili a manuali motosega tagliaerba ecc… HOME

15 La mappatura Esplicita le relazioni tra laspetto strutturale a quello funzionale In alcuni casi può risultare molto complesso in relazione alla gamma dei servizi offerti

16 La mappatura (2) Definire la gerarchia dellinformazione Sequenza lineare La griglia Network

17 La mappatura (3) Correlare la mappatura alla struttura

18 La mappa del sito IKEA

19

20 Secondo lapproccio proposto da Jackob Nielsen la struttura di navigazione di un sito web deve aiutare lutente nel rispondere a tre domande: Dove mi trovo ? Dove sono stato ? Dove posso andare ? I criteri per lanalisi

21 Le tipologie di navigazione BCDEA HOME D1D2D3 A2A1 A2.2A2.3A2.1 navigazione orizzontale navigazione trasversale navigazione verticale

22 1.Dove mi trovo? in relazione al Web

23 1.Dove mi trovo? in relazione alla struttura del sito

24 2. Dove sono stato ? nel Web

25 allinterno del sito 2. Dove sono stato ?

26 3. Dove posso andare ? A questa domanda rispondono tre diversi tipi di link… link topici link associativi link strutturali

27 TOPICI STRUTTURALI ASSOCIATIVI link usati per indicare altre pagine dal contenuto simile o correlato a quella attuale che lutente potrebbe perciò trovare interessanti testo sottolineato (di solito ma non sempre!) che conduce a ulteriori informazioni riguardo allargomento trattato link usati per connettere tra di loro livelli diversi della struttura del sito. Usati anche per connettere una data pagina con altre allo stesso livello gerarchico I Link

28 Link associativi Link strutturali Link topici

29 ID del sitoUna via alla Home Page Le sezioni Utilities Una via per la ricerca Il test del portabagagli 1)In che sito mi trovo? ID 2)In che pagina sono? Nome della Pagina 3)Quali sono le sezioni principali del sito? Sezioni del sito o navigazione primaria 4)Quali opzioni ho a disposizione a questo livello? Navigazione locale 5)Dove mi trovo nella struttura generale del sito? Indicazioni voi siete qui 6)Come posso effettuare una ricerca? Campo ricerca

30 ID Sezioni Nome della pagina Navigazione locale Voi siete qui Ricerca

31 Una struttura di navigazione tipica ABCDE D1 D2 D3 pagina D1 contenuti della pagina navigazione globale navigazione locale BC D EA HOME D1D2D3 A2A1 A2.2A2.3A2.1 D

32 A BCD E Unaltra variante: navigazione globale (metafora dello schedario) A BCD E D1D2D3 pagina D1 A BCD E D1 D2 D3

33 Una variante: navigazione locale in orizzontale Strutturalmente, è la stessa cosa Unaltra variante: navigazione locale in menu a tendina

34 Cosa distingue la home page dalle altre pagine: deve mettere in evidenza lidentità del sito ( ID ) deve comunicare un quadro dinsieme (facendo dei compromessi!) ed esporre la mission del sito in modo chiaro e sintetico (WELCOME BLURB) dovrebbe avere una TAGLINE ben progettata (solo i più famosi possono farne a meno!) può avere un diverso orientamento delle sezioni e del testo, ma senza modificare i nomi e lordine delle sezioni (consistency) HOME

35 Cosa distingue la home page dalle altre pagine (2) : Lidentità del sito (ID) … Il logo (ID) in evidenza, insieme ai valori e alla storia che esso esprime

36 IL WELCOM BLURB … poche righe per spiegare chi siamo, cosa facciamo, che obiettivi abbiamo (mission) Cosa distingue la home page dalle altre pagine (3) :

37 La TAGLINE (mission) …poche parole (!) vicino allID per mettere immediatamente in relazione chi siamo (ID) e cosa facciamo (mission) Cosa distingue la home page dalle altre pagine (4) :

38 Nella home page i link strutturali (sezioni) possono essere disposti in modo diverso rispetto a tutte le altre pagine (navigazione persistente)… Home page Cosa distingue la home page dalle altre pagine (5) : Pagina interna

39 Un difetto tipico: duplicazione degli accessi a una stessa pagina

40 Il modello più in dettaglio

41 Valutare le caratteristiche a partire dalle sottocaratteristiche Un possibile sistema di misurazione

42 Una visione globale Usabilità Architettura Comunicazione FunzionalitàContenuto Gestione Accessibilità

43 0 0,5 1 1,5 2 2,5 3 3,5 4 Usabilità Architettura Comunicazione FunzionalitàContenuto Gestione Accessibilità Confronto di due siti

44 Un profilo di qualità più analitico

45 Best site web award

46

47

48

49

50

51 Analisi operativa e strategica dei risultati OBIETTIVI DEL PORTALE DETERMINAZIONE DEL FABBISOGNO INFORMATIVO DESTINATARI ESTERNI REALIZZAZIONE/ REVISIONE ESPLICITAZIONE DEI PARAMETRI DEL PORTALE COMMISURAZIONE DEI PARAMETRI REPORT CON PARAMETRI E-GOV Il circuito del controllo IL PORTALE

52 Qualche riferimento Documenti consultati Web Usability – Francesca Rizzo Informatica per le-Government Come cambia la Pubblica Amministrazione italiana - Prof. Valter Baldassi. Linee Guida per la Qualità delle Forniture ICT: evoluzione ed applicazione – Marco Gentili Analisi siti web Pa –Paolo Atzeni, Paolo Merialdo Progettazione di un sito Web – Roberto Pirrone Bibliografia Consultata Designing Web Usability, Nielsen, J., tr. it. di Vanini, W., Apogeo,Milano, Information Architecture for the World Wide Web, Rosenfeld, L.,Morville, P., OReilly, Sebastapol CA, Usability Inspection Methods, Nielsen, J., and Mack, R. L., JohnWiley & Sons, New York, NY, 1994.


Scaricare ppt "Web Usability Dott. Simone Lazzini Università di Pisa."

Presentazioni simili


Annunci Google