SlideShare ist ein Scribd-Unternehmen logo
1 von 60
PRINCIPI E LINEE GUIDA  PER IL DESIGN Corso di Interazione Uomo Macchina AA 2009-2010 Roberto Polillo Università di Milano Bicocca Dipartimento di Informatica, Sistemistica e Comunicazione
Scopo di questa lezione ,[object Object]
Temi ,[object Object],[object Object]
Terminologia
Indicazioni per il design ,[object Object],[object Object],[object Object],[object Object]
Indicazioni per il design: tipologia coercitività generalità standard regole di progetto linee  guida principi bassa bassa alta alta
Terminologia ,[object Object],[object Object],[object Object],[object Object]
Indicazioni per il design: autorevolezza ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Gli standard per la usabilità ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
ISO 9241: Standard pubblicati al giugno 2009
Principi ,[object Object],[object Object],[object Object],[object Object],[object Object]
I principi del dialogo secondo la ISO 9241
I 7 principi del dialogo secondo la ISO 9241-110:2006 ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Un “modello di qualità”          Adeguatezza al compito Auto-descrizione Conformità alle aspettative dell’utente Adeguatezza all’apprendimento Controllabilità Tolleranza  verso gli errori Adeguatezza alla individualizzazione
Adeguatezza al compito ,[object Object],[object Object]
Adeguatezza al compito: esempio
Adeguatezza al compito: raccomandazioni ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Autodescrizione ,[object Object]
Autodescrizione: raccomandazioni ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Autodescrizione: esempio Pagina web con menu le cui scritte appaiono sono come roll-over: da evitare!
Autodescrizione: esempio
Conformità alle aspettative dell’utente ,[object Object]
Conformità alle aspettative dell’utente ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Aderenza alle convenzioni: esempio
Organizzazione familiare:  esempio Non c’è bisogno di spiegare nulla: questa interfaccia (Nokia) è largamente diffusa e familiare 7° giornata Inter-Lazio Milan-Atalanta Juventus-Parma Bari-lecce Udinese-Roma Indietro Ok
Bernard, 2001 Organizzazione abituale: esempio Link interni al sito Link esterni al sito Link alla home page Search engine interna Banners pubblicitari Login /registrazione Shopping cart Help Links ai prodotti
Conformità alle aspettative: esempio ,[object Object],[object Object],[object Object],[object Object]
Dialogo consistente: esempi
Es. di incoerenza: menu che si trasformano
[object Object],[object Object],[object Object],  
Feedback conforme alle aspettative: esempio
Output in posizione appropriata: esempio
Input in posizione attesa: esempio Da Word 2007
Stile dei messaggi coerente: esempio
I principi del dialogo secondo la ISO 9241
I 7 principi del dialogo secondo la ISO 9241-110:2006 ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Adeguatezza all’apprendimento ,[object Object]
Adeguatezza all’apprendimento: raccomandazioni ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Aiuto alla familiarizzazione: esempio PowerPoint 2007
Bassa soglia di apprendimento: esempio PowerPoint 2007
Feedback intermedi: esempio www.trenitalia.it
Controllabilità ,[object Object]
Controllabilità: esempio di dialogo non controllabile ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object], Mycin 
Controllabilità: raccomandazioni ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
I 7 principi del dialogo secondo la ISO 9241-110:2006 ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Tolleranza verso gli errori ,[object Object],[object Object]
Tolleranza verso gli errori: raccomandazioni ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Adeguatezza alla individualizzazione ,[object Object]
Adeguatezza alla individualizzazione: raccomandazioni ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Scelta di rappresentazioni alternative: esempio MacOS Finder 10.6
Scelta di rappresentazioni alternative: esempio MacOS Finder 10.6
Personalizzazione delle spiegazioni: esempio Ning, 2009
Scelta del metodi di interazione: esempio Microsoft Word 2008 per Mac
Personalizzazione dei tempi di risposta: esempio MacOS Finder 10.6
Personalizzazione del dialogo: esempio Glossario personalizzabile Microsoft Word 2008 per Mac

Weitere ähnliche Inhalte

Andere mochten auch

Designing for life-changing impact: From bottled water to ending world poverty
Designing for life-changing impact: From bottled water to ending world povertyDesigning for life-changing impact: From bottled water to ending world poverty
Designing for life-changing impact: From bottled water to ending world poverty
Yuan Wang
 

Andere mochten auch (19)

Инновации в рекламном бизнесе
Инновации в рекламном бизнесеИнновации в рекламном бизнесе
Инновации в рекламном бизнесе
 
Cannes Lions: первые впечатления и умозаключения
Cannes Lions: первые впечатления и умозаключенияCannes Lions: первые впечатления и умозаключения
Cannes Lions: первые впечатления и умозаключения
 
Why We're Hungry for Remarkable Content
Why We're Hungry for Remarkable ContentWhy We're Hungry for Remarkable Content
Why We're Hungry for Remarkable Content
 
Cannes Lions 2016 Highlights
Cannes Lions 2016 HighlightsCannes Lions 2016 Highlights
Cannes Lions 2016 Highlights
 
100+ Beautiful Slides from #CannesLions 2016
100+ Beautiful Slides from #CannesLions 2016100+ Beautiful Slides from #CannesLions 2016
100+ Beautiful Slides from #CannesLions 2016
 
Cannes Lions 2016: 9 Inspiring Trends
Cannes Lions 2016: 9 Inspiring TrendsCannes Lions 2016: 9 Inspiring Trends
Cannes Lions 2016: 9 Inspiring Trends
 
Untangling the customer journey
Untangling the customer journeyUntangling the customer journey
Untangling the customer journey
 
UX Design + UI Design: Injecting a brand persona!
UX Design + UI Design: Injecting a brand persona!UX Design + UI Design: Injecting a brand persona!
UX Design + UI Design: Injecting a brand persona!
 
The secret to 10,000 likes? Running a social media campaign with UX and behav...
The secret to 10,000 likes? Running a social media campaign with UX and behav...The secret to 10,000 likes? Running a social media campaign with UX and behav...
The secret to 10,000 likes? Running a social media campaign with UX and behav...
 
Understanding Reddit: The Social Media Superpower You've Probably Never Heard Of
Understanding Reddit: The Social Media Superpower You've Probably Never Heard OfUnderstanding Reddit: The Social Media Superpower You've Probably Never Heard Of
Understanding Reddit: The Social Media Superpower You've Probably Never Heard Of
 
Designing for life-changing impact: From bottled water to ending world poverty
Designing for life-changing impact: From bottled water to ending world povertyDesigning for life-changing impact: From bottled water to ending world poverty
Designing for life-changing impact: From bottled water to ending world poverty
 
STEAL THIS PRESENTATION!
STEAL THIS PRESENTATION! STEAL THIS PRESENTATION!
STEAL THIS PRESENTATION!
 
Eco-nomics, The hidden costs of consumption
Eco-nomics, The hidden costs of consumptionEco-nomics, The hidden costs of consumption
Eco-nomics, The hidden costs of consumption
 
AI and the Future of Growth - Infographic
AI and the Future of Growth - InfographicAI and the Future of Growth - Infographic
AI and the Future of Growth - Infographic
 
You Suck At PowerPoint! by @jessedee
You Suck At PowerPoint! by @jessedeeYou Suck At PowerPoint! by @jessedee
You Suck At PowerPoint! by @jessedee
 
The Secret Sauce of Successful Teams
The Secret Sauce of Successful TeamsThe Secret Sauce of Successful Teams
The Secret Sauce of Successful Teams
 
How Google Works
How Google WorksHow Google Works
How Google Works
 
10 Insightful Quotes On Designing A Better Customer Experience
10 Insightful Quotes On Designing A Better Customer Experience10 Insightful Quotes On Designing A Better Customer Experience
10 Insightful Quotes On Designing A Better Customer Experience
 
Learn BEM: CSS Naming Convention
Learn BEM: CSS Naming ConventionLearn BEM: CSS Naming Convention
Learn BEM: CSS Naming Convention
 

Ähnlich wie 9. Principi e linee guida per il design

metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utentemetodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
andrea.giro
 

Ähnlich wie 9. Principi e linee guida per il design (20)

16. Principi e linee guida
16. Principi e linee guida16. Principi e linee guida
16. Principi e linee guida
 
16. Principi e linee guida (i)
16. Principi e linee guida (i)16. Principi e linee guida (i)
16. Principi e linee guida (i)
 
20. Principi e linee guida (I)
20. Principi e linee guida (I)20. Principi e linee guida (I)
20. Principi e linee guida (I)
 
20. Principi e linee guida (II)
20. Principi e linee guida (II)20. Principi e linee guida (II)
20. Principi e linee guida (II)
 
10. Principi e linee guida
10. Principi e linee guida10. Principi e linee guida
10. Principi e linee guida
 
17. Principi e linee guida (ii)
17. Principi e linee guida (ii)17. Principi e linee guida (ii)
17. Principi e linee guida (ii)
 
Web Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesignerWeb Usability - 2 | WebMaster & WebDesigner
Web Usability - 2 | WebMaster & WebDesigner
 
Relazione finale progetto Pedalami
Relazione finale progetto PedalamiRelazione finale progetto Pedalami
Relazione finale progetto Pedalami
 
Web usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesignerWeb usability - 2 | WebMaster & WebDesigner
Web usability - 2 | WebMaster & WebDesigner
 
8. Come valutare l’usabilità
8. Come valutare l’usabilità8. Come valutare l’usabilità
8. Come valutare l’usabilità
 
Laboratorio internet 10: Redazione dei contenuti
Laboratorio internet 10: Redazione dei contenutiLaboratorio internet 10: Redazione dei contenuti
Laboratorio internet 10: Redazione dei contenuti
 
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utentemetodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
metodologia di lavoro per un sito web orientato alla soddisfazione dell\'utente
 
Workshop Ideare e creare Web Applications, Introduzione ad AngularJS
Workshop Ideare e creare Web Applications, Introduzione ad AngularJSWorkshop Ideare e creare Web Applications, Introduzione ad AngularJS
Workshop Ideare e creare Web Applications, Introduzione ad AngularJS
 
6. Il progetto d’esame
6. Il progetto d’esame6. Il progetto d’esame
6. Il progetto d’esame
 
Agile UX - AR Meetup
Agile UX - AR MeetupAgile UX - AR Meetup
Agile UX - AR Meetup
 
Quo vadis P.O.? Metriche UX per misurare il valore rilasciato.
Quo vadis P.O.? Metriche UX per misurare il valore rilasciato.Quo vadis P.O.? Metriche UX per misurare il valore rilasciato.
Quo vadis P.O.? Metriche UX per misurare il valore rilasciato.
 
Valutazione dell'usabilità del portale UNIBA
Valutazione dell'usabilità del portale UNIBAValutazione dell'usabilità del portale UNIBA
Valutazione dell'usabilità del portale UNIBA
 
Lezione 04/2006
Lezione 04/2006Lezione 04/2006
Lezione 04/2006
 
Progetto di Ergonomia Cognitiva: Decathlon +Plus
Progetto di Ergonomia Cognitiva: Decathlon +PlusProgetto di Ergonomia Cognitiva: Decathlon +Plus
Progetto di Ergonomia Cognitiva: Decathlon +Plus
 
SYNERGY Induction to Pedagogy Programme - Evaluation of the Learning Resource...
SYNERGY Induction to Pedagogy Programme - Evaluation of the Learning Resource...SYNERGY Induction to Pedagogy Programme - Evaluation of the Learning Resource...
SYNERGY Induction to Pedagogy Programme - Evaluation of the Learning Resource...
 

Mehr von Roberto Polillo

Mehr von Roberto Polillo (20)

Future City, Ipotesi sulla città del futuro
Future City, Ipotesi sulla città del futuroFuture City, Ipotesi sulla città del futuro
Future City, Ipotesi sulla città del futuro
 
Teaching HCI to computing students: some considerations
Teaching HCI to computing students: some considerationsTeaching HCI to computing students: some considerations
Teaching HCI to computing students: some considerations
 
Conclusioni del corso
Conclusioni del corsoConclusioni del corso
Conclusioni del corso
 
22. Conclusioni del corso
22. Conclusioni del corso22. Conclusioni del corso
22. Conclusioni del corso
 
ICT e sviluppo sociale: alcune riflessioni
ICT e sviluppo sociale: alcune riflessioniICT e sviluppo sociale: alcune riflessioni
ICT e sviluppo sociale: alcune riflessioni
 
Editoria e industria dei media di fronte alla rivoluzione digitale
Editoria e industria dei media di fronte alla rivoluzione digitaleEditoria e industria dei media di fronte alla rivoluzione digitale
Editoria e industria dei media di fronte alla rivoluzione digitale
 
21. Progettare per l'errore
21. Progettare per l'errore21. Progettare per l'errore
21. Progettare per l'errore
 
18. Paradigmi di interazione uomo macchina (III)
18. Paradigmi di interazione uomo macchina (III)18. Paradigmi di interazione uomo macchina (III)
18. Paradigmi di interazione uomo macchina (III)
 
Wikipedia
WikipediaWikipedia
Wikipedia
 
Open internet
Open internetOpen internet
Open internet
 
17. Evoluzione dei paradigmi di interazione uomo macchina (I)
17. Evoluzione dei paradigmi di interazione uomo macchina (I)17. Evoluzione dei paradigmi di interazione uomo macchina (I)
17. Evoluzione dei paradigmi di interazione uomo macchina (I)
 
16. Evoluzione dei paradigmi di interazione uomo macchina (I)
16. Evoluzione dei paradigmi di interazione uomo macchina (I)16. Evoluzione dei paradigmi di interazione uomo macchina (I)
16. Evoluzione dei paradigmi di interazione uomo macchina (I)
 
20. Social networks
20. Social networks20. Social networks
20. Social networks
 
19. Le organnizzazioni sul web e segg
19. Le organnizzazioni sul web e segg19. Le organnizzazioni sul web e segg
19. Le organnizzazioni sul web e segg
 
18. Content sharing sites
18. Content sharing sites18. Content sharing sites
18. Content sharing sites
 
17. Web feed e aggregatori
17. Web feed e aggregatori17. Web feed e aggregatori
17. Web feed e aggregatori
 
15. Ancora sulla grafica
15. Ancora sulla grafica15. Ancora sulla grafica
15. Ancora sulla grafica
 
16. Social media
16. Social media16. Social media
16. Social media
 
14. Progettare il testo
14. Progettare il testo14. Progettare il testo
14. Progettare il testo
 
15. La forma breve e il microblogging
15. La forma  breve e il microblogging15. La forma  breve e il microblogging
15. La forma breve e il microblogging
 

Kürzlich hochgeladen

Scienza Potere Puntoaaaaaaaaaaaaaaa.pptx
Scienza Potere Puntoaaaaaaaaaaaaaaa.pptxScienza Potere Puntoaaaaaaaaaaaaaaa.pptx
Scienza Potere Puntoaaaaaaaaaaaaaaa.pptx
lorenzodemidio01
 
case passive_GiorgiaDeAscaniis.pptx.....
case passive_GiorgiaDeAscaniis.pptx.....case passive_GiorgiaDeAscaniis.pptx.....
case passive_GiorgiaDeAscaniis.pptx.....
giorgiadeascaniis59
 
Nicola pisano aaaaaaaaaaaaaaaaaa(1).pptx
Nicola pisano aaaaaaaaaaaaaaaaaa(1).pptxNicola pisano aaaaaaaaaaaaaaaaaa(1).pptx
Nicola pisano aaaaaaaaaaaaaaaaaa(1).pptx
lorenzodemidio01
 
Presentazione tre geni della tecnologia informatica
Presentazione tre geni della tecnologia informaticaPresentazione tre geni della tecnologia informatica
Presentazione tre geni della tecnologia informatica
nico07fusco
 
Adducchio.Samuel-Steve_Jobs.ppppppppppptx
Adducchio.Samuel-Steve_Jobs.ppppppppppptxAdducchio.Samuel-Steve_Jobs.ppppppppppptx
Adducchio.Samuel-Steve_Jobs.ppppppppppptx
sasaselvatico
 

Kürzlich hochgeladen (20)

discorso generale sulla fisica e le discipline.pptx
discorso generale sulla fisica e le discipline.pptxdiscorso generale sulla fisica e le discipline.pptx
discorso generale sulla fisica e le discipline.pptx
 
LE ALGHE.pptx ..........................
LE ALGHE.pptx ..........................LE ALGHE.pptx ..........................
LE ALGHE.pptx ..........................
 
Tosone Christian_Steve Jobsaaaaaaaa.pptx
Tosone Christian_Steve Jobsaaaaaaaa.pptxTosone Christian_Steve Jobsaaaaaaaa.pptx
Tosone Christian_Steve Jobsaaaaaaaa.pptx
 
Una breve introduzione ad Elsa Morante, vita e opere
Una breve introduzione ad Elsa Morante, vita e opereUna breve introduzione ad Elsa Morante, vita e opere
Una breve introduzione ad Elsa Morante, vita e opere
 
CHIẾN THẮNG KÌ THI TUYỂN SINH VÀO LỚP 10 THPT MÔN NGỮ VĂN - PHAN THẾ HOÀI (36...
CHIẾN THẮNG KÌ THI TUYỂN SINH VÀO LỚP 10 THPT MÔN NGỮ VĂN - PHAN THẾ HOÀI (36...CHIẾN THẮNG KÌ THI TUYỂN SINH VÀO LỚP 10 THPT MÔN NGỮ VĂN - PHAN THẾ HOÀI (36...
CHIẾN THẮNG KÌ THI TUYỂN SINH VÀO LỚP 10 THPT MÔN NGỮ VĂN - PHAN THẾ HOÀI (36...
 
Oppressi_oppressori.pptx................
Oppressi_oppressori.pptx................Oppressi_oppressori.pptx................
Oppressi_oppressori.pptx................
 
Storia-CarloMagno-TeccarelliLorenzo.pptx
Storia-CarloMagno-TeccarelliLorenzo.pptxStoria-CarloMagno-TeccarelliLorenzo.pptx
Storia-CarloMagno-TeccarelliLorenzo.pptx
 
Scrittura seo e scrittura accessibile
Scrittura seo e scrittura accessibileScrittura seo e scrittura accessibile
Scrittura seo e scrittura accessibile
 
Scienza Potere Puntoaaaaaaaaaaaaaaa.pptx
Scienza Potere Puntoaaaaaaaaaaaaaaa.pptxScienza Potere Puntoaaaaaaaaaaaaaaa.pptx
Scienza Potere Puntoaaaaaaaaaaaaaaa.pptx
 
case passive_GiorgiaDeAscaniis.pptx.....
case passive_GiorgiaDeAscaniis.pptx.....case passive_GiorgiaDeAscaniis.pptx.....
case passive_GiorgiaDeAscaniis.pptx.....
 
descrizioni della antica civiltà dei sumeri.pptx
descrizioni della antica civiltà dei sumeri.pptxdescrizioni della antica civiltà dei sumeri.pptx
descrizioni della antica civiltà dei sumeri.pptx
 
Presentazioni Efficaci e lezioni di Educazione Civica
Presentazioni Efficaci e lezioni di Educazione CivicaPresentazioni Efficaci e lezioni di Educazione Civica
Presentazioni Efficaci e lezioni di Educazione Civica
 
ProgettoDiEducazioneCivicaDefinitivo_Christian Tosone.pptx
ProgettoDiEducazioneCivicaDefinitivo_Christian Tosone.pptxProgettoDiEducazioneCivicaDefinitivo_Christian Tosone.pptx
ProgettoDiEducazioneCivicaDefinitivo_Christian Tosone.pptx
 
Nicola pisano aaaaaaaaaaaaaaaaaa(1).pptx
Nicola pisano aaaaaaaaaaaaaaaaaa(1).pptxNicola pisano aaaaaaaaaaaaaaaaaa(1).pptx
Nicola pisano aaaaaaaaaaaaaaaaaa(1).pptx
 
Presentazione tre geni della tecnologia informatica
Presentazione tre geni della tecnologia informaticaPresentazione tre geni della tecnologia informatica
Presentazione tre geni della tecnologia informatica
 
Aristotele, vita e opere e fisica...pptx
Aristotele, vita e opere e fisica...pptxAristotele, vita e opere e fisica...pptx
Aristotele, vita e opere e fisica...pptx
 
Adducchio.Samuel-Steve_Jobs.ppppppppppptx
Adducchio.Samuel-Steve_Jobs.ppppppppppptxAdducchio.Samuel-Steve_Jobs.ppppppppppptx
Adducchio.Samuel-Steve_Jobs.ppppppppppptx
 
Vuoi girare il mondo? educazione civica.
Vuoi girare il mondo? educazione civica.Vuoi girare il mondo? educazione civica.
Vuoi girare il mondo? educazione civica.
 
Quadrilateri e isometrie studente di liceo
Quadrilateri e isometrie studente di liceoQuadrilateri e isometrie studente di liceo
Quadrilateri e isometrie studente di liceo
 
Descrizione Piccolo teorema di Talete.pptx
Descrizione Piccolo teorema di Talete.pptxDescrizione Piccolo teorema di Talete.pptx
Descrizione Piccolo teorema di Talete.pptx
 

9. Principi e linee guida per il design

Hinweis der Redaktion

  1. R.Polillo, Interazione uomo macchina - Parte prima, 8
  2. R.Polillo, Interazione uomo macchina - Parte prima, 8
  3. R.Polillo, Interazione uomo macchina - Parte prima, 8
  4. R.Polillo, Interazione uomo macchina - Parte prima, 8
  5. www.ccjensen.com Dalla home page si sceglie APPLICATIONS, e viene fuori questo, che è il menu delle applicazioni! R.Polillo, Interazione uomo macchina - Parte prima, 8
  6. R.Polillo, Interazione uomo macchina - Parte prima, 8
  7. R.Polillo, Interazione uomo macchina - Parte prima, 8
  8. Sito ufficiale del film “The Story of Us”, ottobre 1999 R.Polillo, Interazione uomo macchina - Parte prima, 8
  9. Sito ufficiale del film “The Story of Us”, ottobre 1999 La struttura di navigazione trasversale presenta molti problemi. Infatti: Il menù (rappresentato dal “mazzo” di fotografie, cambia forma e contenuti nei vari contesti (nella home page sono 5 foto, nelle pagine di livello 1 sono 4 foto, mancando quella della pagina corrente. Inoltre in due pagine manca il menu. Perchè?) Il titolo cambia passando dalla home page alle pagine di primo livello. Es.: “The Marriage” diventa “Story – The Marriage”. Il secondo titolo si vede, sulla home page, passando il mouse sulla fotografia relativa. R.Polillo, Interazione uomo macchina - Parte prima, 8
  10. R.Polillo, Interazione uomo macchina - Parte prima, 8