3. Di che cosa parliamo
• Overview
• Desktop, web e RIA
• Il concetto di COMPITO
• L’importanza dell’esperienza
• Basarsi sul sapere condiviso
• Best practice
• Prototyping
• Alla fine
Monday, May 11, 2009 3
4. Overview
Progettare un’applicativo
RIA
Monday, May 11, 2009 4
5. User centered design
“What separates you from your
competitors isn’t design or development,
it’s truly thinking about the person who
will use your design or development and
figuring out how it can solve their needs.
”
- Deborah Adler
Monday, May 11, 2009 5
6. Desktop, web
e RIA
Progettare per gli utenti
Monday, May 11, 2009 6
7. L’applicazione desktop
• L’applicazione desktop per chi è stata pensata?
• Seguire lo standard
• Paradigmi d’uso:
• le voci di menu “file” e “edit” e gli strumenti
• modalità di selezionare: singolo/doppio click e multipla
• manipolazione diretta
• MDA
Monday, May 11, 2009 7
8. L’applicazione web
• L’applicazione web da chi viene usata e a quale
scopo?
• La navigazione e le azioni
• La personalizzazione
• L’information retrieval
Monday, May 11, 2009 8
9. L’applicazione RIA
• Un’applicazione RIA a che modello di utente si
rivolge?
• Il personal desktop
• La mobilità
Monday, May 11, 2009 9
11. Compito e azione
• La necessità
• Il compito : l’azione che scaturisce dalla necessità
• L’oggetto dell’azione
Monday, May 11, 2009 11
12. L’importanza
dell’esperienza
Come evitare che l’utente
fugga davanti al nostro
applicativo
Monday, May 11, 2009 12
13. L’evoluzione è veloce, noi
meno*
• Ridurre il gap tra l’utente e l’oggetto
“desiderato”
• La semplicità
• La scoperta e il “gioco”
• La curva di apprendimento nel design
Monday, May 11, 2009 13
14. Basarsi sul
sapere condiviso
L’architettura
dell’informazione nel
progesso di progettazione
Monday, May 11, 2009 14
15. Il ruolo della IA
• La curva di apprendimento: scelta del vocabolario
• Le tassonomie
• La costruzione delle mappe
Monday, May 11, 2009 15
16. Best practise
Effetti sì, quando?
Monday, May 11, 2009 16
17. Best practise
• Selezione
• Manipolazione
• Transizioni
• Ridimensionamento: scrolling e densità di dati
• Effetti davvero speciali: suoni e grafica 3D
Monday, May 11, 2009 17
18. Selezione
• Il monoclick
• Selezione degli oggetti
• Comandi di tastiera
Monday, May 11, 2009 18
19. Manipolazione
• Puntatore e spostamento
• Drag&Drop
• Ridimensionamento dell’oggetto
Monday, May 11, 2009 19
20. Transizioni
• Movimenti di “avviso”
• Transizioni di movimento
• Transazioni di pagina
Monday, May 11, 2009 20
21. Ridimensionamento
• All in one window
• Scrolling
• Ridimensionamento
Monday, May 11, 2009 21
22. Effetti davvero speciali
• Suoni
• Grafica 3D
• Video e altri contenuti non interattivi
Monday, May 11, 2009 22
23. Prototyping
Come un’idea diventa
visibile
Monday, May 11, 2009 23
27. Immagine statica
interazioni
legenda
navigator
controlli di navigazione: zoom
simbolo
avanti/indietro
libro full screen
disegna tutte le relazioni
seminario pubblicato
cancella le relazioni
seminario
m.over su icona > si formano relazioni + glow sulle icone collegate
m.over su icona > pop up
su click i collegamenti rimangono permanenti
Monday, May 11, 2009 27
29. Alcuni esempi
• Google Docs: Online - Offline
• Lacan+Freud Viz: ricerche interattive
• SIRS: paradigmi
Monday, May 11, 2009 29
30. Online - Offline
• Mobile desktop
• paradigmi del web +
desktop:
l’esempio delle voci
di menù
Monday, May 11, 2009 30
31. Ricerche interattive
• Iconizzare
• Mettere in relazione
• Zoom&pan
Monday, May 11, 2009 31
32. Paradigmi
• Information Retrieval
• All in one window
• Focus+context
• La griglia elastica
Monday, May 11, 2009 32
33. Alla fine
Non riduciamoci a
schematismi
Monday, May 11, 2009 33
34. Bibliografia e link utili
• Remo Jobs (a cura di), Manuale di psicologia cognitiva, CAROCCI
• Calvin Moores, Ambient findability, O'REALLY
• Bill Morridge, Interaction Design, MIT PRESS
• J. Preece, Y. Rogers, H. Sharp, Interaction design, APOGEO
• Robert Spence, Information Visualization, Design for Interaction –
2nd ed., Perason Educated Limited
• http://www.welie.com/patterns/index.php
• http://quince.infragistics.com/
• http://en.wikipedia.org/wiki/Mooers%27_Law
• sinestesia: http://teemingvoid.blogspot.com/2008/10/synesthesia-
and-cross-modality-in.html
• Ingegneria della conoscenza: http://en.wikipedia.org/wiki/
Knowledge_engineering
Monday, May 11, 2009 34