Post on 27-Jan-2015
description
HCI to UX to HCI
rEì 0 CebE 01cLà I GenrA (IvrIà dgI Ud I Esi)
indexHello
Passato
Apple
Presente
Futuro
HelloUna mia breve presentazione
• Area Web = Cristiano Rastelli & Liliana Bragadin
• miei clienti diretti + freelance per agenzie
• attivita' = lavoro + passione
• ogni lavoro e' un progetto a se'
• web-oriented da oltre 15 anni
Chi sono
Competenze
interaction/ux design
interface & web design
web development
Strumenti
DEVELOPMENT TEST & DEBUGDESIGN
Alcuni esempi del mio lavoro
Siti web
Il Foglio Quotidiano Editoria
Il Foglio Quotidiano Editoria
Multiutility Energia
Multiutility Energia
Multiutility Energia
CT Crane Industria
CA Scale PMI
TM Sportmanagement Sport
TM Sportmanagement Sport
Elena Ziletti Servizi
Scuola Chizzolini Educazione
Scuola Chizzolini Educazione
WEBdeBS No-profit
Mosaico (Banca Intesa) Intranet
NoSQL Day / Node.js Conf / For Real Conf Eventi
Maya Spettacolo
Camillo Blog Personali
Alcuni esempi del mio lavoro
Applicazioni
Codice Plastico User-Interface
N.D.A.
Codice Plastico User-Interface
N.D.A.
Codice Plastico User-Interface
N.D.A.
Codice Plastico User-Interface
N.D.A.
Codice Plastico User-Interface
N.D.A.
Eliwell User-Interface
N.D.A.
Evoluzione Telematica User-Interface
N.D.A.
I progetti di cui ci occupiamo
piccoli
medi
grandiprogetti {
Quello che voglio raccontarvi oggi...
job-oriented
Quello che voglio raccontarvi oggi...
job-oriented
PassatoHuman-Computer-Interaction
Il mio primo impatto con l'HCI
Il mio primo impatto con l'HCI
icon-based interfaces
Il mio primo impatto con l'HCI
touch-screens
Il mio primo impatto con l'HCI
Il mio primo impatto con l'HCI
Mac System 7
Il mio primo impatto con l'HCI
Mac System 7
1992
Il mio primo impatto con l'HCI
decine di anniepoche geologiche nell'informatica
praticamente stiamo parlando di
La mia sensazione e' stata questa...
1700
1900
Il mio primo impatto con l'HCI
tutto da buttare?
Approcci empirici, non regole matematiche!
Metodi di lavoro
Metodi di lavoro
ATTENZIONE: anche questi possono diventare obsoleti !
"The man on the mirror"
vs.
La relazione uomo-macchina
Approccio meccanicistico
La relazione uomo-macchina
uomo macchina
L'uomo e' un essere complesso
L'uomo non e' [solo] un essere razionale
I miei primi passi come UX designer
Usability
C'era una volta l'usabilita'
Un grosso malinteso
accessibilevs.
usabile
Linee guida per l'accessibilita'
Le presenti linee guida spiegano come rendere i contenuti web accessibili a persone disabili.
Accessibilita'
• interlocutori: persone disabili = disabilita'
• scopo: accesso ai contenuti
• azioni messe in atto:
• semantica del codice
• contenuti alternativi per dare maggiore significato
• comandi/interazioni che facilitino la navigazione
• compatibilita' con qualsiasi hardware/software
Le disabilita' possono essere codificate
Linee guida per l'usabilita'
?
Usabilita' / Interlocutori
users / utenti
Usabilita' / Scopo
websites / applications
Usabilita' / Azioni
• navigabilita'
• interattivita'
• completezza dei contenuti
• organizzazione delle informazioni
• efficacia comunicativa
• attrattiva grafica
• tempi di attesa
Usabilita' / Azioni
• navigabilita'
• interattivita'
• completezza dei contenuti
• organizzazione delle informazioni
• efficacia comunicativa
• attrattiva grafica
• tempi di attesa
?
La guerra dei browser
Flash, le intro animate e le RIA
Please, wait loading...
the loadbar of death
Un problema inaspettato
interattivovs.
usabile
L'avvento dello user-experience design
UX design
Le diverse facce della UX
Gli elementi dello UX design
Le colonne dello UX design
La ruota del valore della UX
L'importanza della UX
L'iceberg dello UX design
Il percorso dello UX design
Il terreno dello UX design
Perche' tutti questi schemi?
“Se nessuno me lo chiede, lo so.Se voglio spiegarlo a chi me lo chiede,
non lo so più.”
S. Agostino
La UX come semi-cosa. Karim Ben Hamida – UX conference 2011
Una definizione che estende e include altre discipline
“I invented the term UX because I thought human interface and usability were
too narrow. I wanted to cover all aspects of the person’s experience with
the system including industrial design, graphics, the interface, the physical
interaction, and the manual.”
Donald Norman
La UX come semi-cosa. Karim Ben Hamida – UX conference 2011
Una definizione classica
“User experience is about how a person feels about using a product,
system or service.Is subjective in nature, because it’s
about an individual’s feelings and thoughts about the system.
Is dynamic, because it changes over time as the circumstances change.”
Wikipedia
Una definizione minimale
“It’s all about People, their Activities, and the Context of those activities.”
Stephen P. Anderson
La mia definizione, con una domanda
“Dovendo dare al maggior numero di utenti la miglior esperienza possibile nell’impiego di una applicazione,
quali strumenti decido di utilizzare?”
La UX per come la conosco io
Architettura delle informazioni
Etnografia Psicologia
Content strategy Copywriting
Interaction design Motivational design
Marketing
User-testing
Trovabilità Usabilità
Gamification
Personas Scenari
Storytelling Tono
Empatia
User-centered design
Prototipazione rapida Metodi agili Iterazioni
Visual design Tipografia Colore Estetica
Metriche
Griglie
Business
La mela che ha cambiato il mondo
Le rivoluzioni: iPhone e iPad
I prodromi della rivoluzione
I prodromi della rivoluzione
Diverse sfaccettature della stessa rivoluzione
Il secondo segno di una rivoluzione?
La musica in formato digitale?
+
Applicazione per gestire una libreria di canzoni?
+
Uno negozio dove acquistare brani?
+
Una serie di accessori "cool"?
+
Una scelta di possibili colori?
E' tutto questo assieme!
device "perfetti"
applicazione iTunes
negozio iTunes
sincronizzazione
catalogo immenso di contenuti
semplicita' nell'acquisto
one click pay
search & download
disponibilita' di accessori
+
E' tutta una questione di eco-sistema
The iTunes world
L'eco-sistema dell'esperienza
L'eco-sistema dell'esperienza
Giardinetto della felicita'
Cosa pensate che siano le "app"?
Cosa hanno in comune?
Amore per la bellezza
Amore per la bellezza
Un "dettaglio" apparentemente inutile
Un "dettaglio" apparentemente inutile
Un semplice led lampeggiante?
Breathing status LED indicatorUnited States Patent 6658577
“A new and improved status LED indicatorprovides a pleasing visual appeal. An embodiment of the present invention includes a sleep-mode indicator for laptop computers.The LED indicator is energized by pulse-width modulated electrical pulses. The effect of these pulses on the indicator varies in intensity and mimics a rhythm typical of breathing.It is another aspect of the invention to provide an electrical apparatus that generates a sleep-mode indicator blinking pattern based on a sinusoidal function using PWM (pulse width modulation) designs.”
La porta sul mondo
La porta sul mondo
L'impatto di Apple sul nostro lavoro
Il costo della qualita'
perfezione
sforzo = tempo = denaro
qualitàperfezione
sforzo = tempo = denaro
qualità
Il costo della qualita'
perfezione
sforzo = tempo = denaro
qualitàperfezione
sforzo = tempo = denaro
qualità
...a parità di tempo dedicato
incrementi diversidi qualità...
1
10
10 10
15 minuti di pausa