UX 101(+ IxD & ID)

Vicky Teinaki

vicky@vickyteinaki.com@vickytnz

What is UxD?(user experience design)

IXDA mailing list Nov 2007

Luke W. ‘UX Rationalisation’ This and following examples at http://www.lukew.com/FF/entry.asp?156

» TriggerSome circumstance triggers a need and a corresponding expectation of satisfaction.» ExpectationWhat does the user expect to do, how do they expect to do it, what do they expect to get out of it in the end?» ProximityHow close is the user to the necessary part of the system? Are they on the right webpage, near the instore kiosk, or next to the information desk at the airport?» AwarenessDoes the user notice the necessary part of the system - the link, the kiosk, or the information desk? Or are they distracted by something else, like a spinning logo?» ConnectionDoes the user make the connection between their need and the neccessary part of the system? Do the system cues match their expectation so that they can make this connection and then act on it?» ActionCan the user take action, or is there a mismatch with how they expected to act and the actual action required?» ResponseThe system provides a response to the user's action - is it the expected response? Does it meet the need?» EvaluationThe user compares the response with the expection. Based on this comparison, the user will adjust their expectations.- If expectations are managed well, and are met consistently, the user will continue the cycle until their initial need is satisfied. - If expectations are not met, the user will stop using the system and try other channels or abandon the goal for the time being.

The Experience Cycle model © 2003-2004 Jess McMullin. All rights reserved.The Experience Cycle model synthesizes work from three sources: » Don Norman's work with mapping and subsequent cognitive walkthrough methods. » The AIDA model from marketing literature - Awareness, Interest, Desire, Action. » The notion of cyclical adjustment of expectation reflects the game theory notion of repeated expected utility. This has been explored in the interactive domain with work done at PARC on information foraging.

Expectation»»

»»

»

»»Ev

aluat

ion

Resp

onse

Action Connection

Aw

areness

ProximityThe User's

Experience Cycle

Trigger»

The user experience is not one simple action - it is an interconnected cycle of attempting to satisfy hopes, dreams, needs, and desires. This takes the shape of individuals comparing their expectations to the outcomes generated by their interaction with a system. Managing expections then becomes key to successfully providing a satisfying "return on experience" that delights users and generates shared, sustainable value.

The Elements of the User's Experience

!"#$%#&'()%#$%'%(*'+"#,'-%*)+*)$)./'/#0.%01%/")%2$)*)3+)*#).,)%1#)-4%5'$)4%0.%&6%07.%,00*4#.'/)$8%*)1)*).,)$'.4%+)*,)+/#0.$9%:/%#$%.0/%'%+*),#$)%70*;8%52/%.)#/")*7)*)%/"0$)%1#*$/%&'+$%&'4)%56%<)4#/)**'.)'.,"'*/0(*'+")*$9

!"#$%4#'(*'&%#$%5'$)4%0.%0.)%'$$2&+/#0.=%)>)*6/"#.(#.%/")%?$)*%@3+)*#).,)%1#)-4%*'.()$%5)/7)).%5#/$%'.4'/0&$8%'.4%+0#./$%+*)40&#.'./-6%/0%/")%5*'#.%0*%/")%")'*/9

!")%&'+%4#$+-'6$%1#>)%4#11)*)./%/6+)$%01%)-)&)./$=%+)0+-)87)5%*)$02*,)$8%+*01)$$#0.'-%(*02+$8%+*042,/$%'.44#$,#+-#.)$8%'.4%/70%'3#$=%)&0/#0.'-A*'/#0.'-%'.4%'.'-0(A4#(#/'-9%@>)*6%)-)&)./%"'$%5)).%+-',)4%$0&)7")*)%#./")%/)**#/0*6%5'$)4%0.%#/$%.'/2*)9

B)--07%#$%2$)4%10*%+*',/#,)$%'.4%4#$,#+-#.)$9%!")#*,00*4#.'/)$%'*)%'$$#(.)4%5'$)4%50/"%0.%/")%&)/"04$2$)4%'.4%/")#*%02/,0&)$9

C*)).%#$%2$)4%10*%+)0+-)%;.07.%#.%/")%1#)-4%10*%/")#*,0./*#52/#0.$8%.)7%#4)'$%0*%0*#(#.'-%>#)7+0#./$9

D-2)%#$%2$)4%10*%+*01)$$#0.'-%(*02+$=%'$$0,#'/#0.$8102.4'/#0.$8%,0&&2.#/#)$8%)/,9

E#.;%#$%2$)4%10*%0.-#.)%*)$02*,)$%/"'/%011)*%0*#(#.'-%,0./)./'.4%'*)%*)-)>'./%10*%2$)*%)3+)*#).,)%+*',/#/#0.)*$9

F)4%#$%2$)4%10*%+*042,/$8%7"#,"%'*)%/")%02/,0&)$%01%/")4#$,#+-#.)$%#.>0->)4%#.%2$)*%)3+)*#).,)9

:/%#$%'$$2&)4%/"'/%/")*)%'*)%&'.6%)-)&)./$%&#$$#.(%#./"#$%*)+*)$)./'/#0.9%G2*/")*%>)*$#0.$%,02-4%#.,-24)%'4#11)*)./%'3#8%,'/)(0*#)$%0*%'.%#.,*)'$)4%.2&5)*%01%+0#./$4#$+-'6)49%!"#$%70*;%#$%0+).%10*%*)>#$#0.$%'.4*)10*&2-'/#0.$9

G0*%,0&&)./$8%H2)$/#0.$%0*%,*#)$%'502/%/")%?$)*@3+)*#).,)%I0$&0$8%$).4%'.%)&'#-%&)$$'()%/0=

J'>#)*%I'K'4',0$&0$L/)**)&0/09.)/

,0$&0$=%.9%/")%2.#>)*$)*)('*4)4%'$%'.%0*4)*-68"'*&0.#02$%7"0-)9

!")%?$)*%@3+)*#).,)%I0$&0$%M>N9NO%P%+)*$0.'-%*)+*)$)./'/#0.%01%02*%$+',)

+'2-%&#Q;$).''*

'/0&$%R%'.'-0(%R%&),"'.#,

")'*/%R%)&0/#0.'-%R%$25Q),/#>) 5*'#.%R%*'/#0.'-%R%05Q),/#>)

5#/$%R%4#(#/'-%R%)-),/*0.#,

;'.$)#%).(#.))*#.(

#.10*&'/#0.%4)$#(.

#.10*&'/#0.%'*,"#/),/2*)

2$'5#-#/6%).(#.))*#.(

#./)*',/#0.%4)$#(.

)3+)*#).,)%4)$#(.

+*042,/%4)$#(.

('&)%4)$#(. ",#

)&0/#0.%4)$#(.

"2&'.%1',/0*$

+*042,/#>#/6%$01/7'*)

)A,0&&)*,)%$#/)$

"'*47'*)

'++-#'.,)$

('&)$

).>#*0.&)./$

7)5$#/)$

$#(.$

#.$/*2,/#0.%-)'1-)/$

#.$/*2,/#0.'-%4)$#(.

#.10*&'/#0.%'++-#'.,)$

'#1#'

2+''#+0

,'4#2$

,"#A7)5

$#(#'A-

'#('

4)$#(.%'.4%)&0/#0.%$0,9

#)'

"1)$

'.4*)7%4#--0.

$/)>)%;*2( Q'*)4%$+00-

5).%$,".)#4)*&'.

.'/"'.%$")4*011

&'*;%"2*$/

$,0//%&,-024

+'/%Q0*4'.

$,0//%7)#$$

Q'>#)*%,'K'4'

)47'*4%/21/)

*#,"'*4%$'2-%72*&'.

'-'.%,00+)*

Q)$$)%Q'&)$%('**)/

+)/)*%&)*"0-S

-02#$)%1)*(2$0.

Q';05%.#)-$).,"*#$/#.'%704/;)

-02#$%*0$).1)-4+)/)*%&0*>#--)

40.'-4%.0*&'.

1'5#0%$)*(#0

+#)/)*%4)$&)/

Q#.700%;#&

Q)11%*'$;#.

2#)

2$)#/',#'

QQ(9.)/

2$'5#-#/6%.)7$

.#/*0(-#,)*#.)

/)**)&0/09.)/

Q&'*H2)S

#.104)$#(.

#$0+#3)-

&#.#A4

",#%7)5

2$'5-)%7)5

(*'.,0&0

'-S'4090*(

503)$%'.4%'**07$

2$'5#-#/69(0>

)>0-/

(004%)3+)*#).,)

'%-#$/%'+'*/

#5&%)'$)%01%2$)

#.10>#$

2$'59%&)/"9%/00-503

,00+)*%#.$#("/$

5)$/%01%,"#7)5%'.4%$#(#'A-

'./)..')42'*40%&'.,"0.

,)$'*%&'*/#.

&#/$20%.'('&',"#

'#.4'9#.10

;)6%/0%/"#$%4#'(*'&=

',/#>#/#)$%'.4%4#$,#+-#.)$

+)0+-) +*01)$$#0.'-%(*02+$

0.-#.)%*)$02*,)$+*042,/$

'./)..''.4*)7%4#--0.'-S'4090*('-'.%,00+)*'#+0'#.4'9#.10'#(''#1#'',#''%-#$/%'+'*/

4)$#(.%'.4%)&0/#0.%$0,9,00+)*%#.$#("/$,"*#$/#.'%704/;),"#A7)5,)$'*%&'*/#.,'4#2$503)$%'.4%'**07$5)$/%01%,"#7)5%'.4%$#(#'A-5).%$,".)#4)*&'.'++-#'.,)$

7)5$#/)$2$)#/2$'5-)%7)52$'5#-#/69(0>2$'5#-#/6%.)7$2$'59%&)/"9%/00-5032$'5#-#/6%).(#.))*#.(2+'2#)

/)**)&0/09.)/$/)>)%;*2(

$#(.$$#(#'A-$,0//%7)#$$$,0//%&,-024*#,"'*4%$'2-%72*&'.+*042,/#>#/6%$01/7'*)+*042,/%4)$#(.

+#)/)*%4)$&)/+)/)*%&0*>#--)+)/)*%&)*"0-S+'2-%&#Q;$).''*+'/%Q0*4'..#/*0(-#,)*#.).'/"'.%$")4*011&#/$20%.'('&',"#&#.#A4&'*;%"2*$/

-02#$)%1)*(2$0.-02#$%*0$).1)-4;'.$)#%).(#.))*#.(Q&'*H2)SQQ(9.)/Q#.700%;#&Q)$$)%Q'&)$%('**)/Q)11%*'$;#.Q'>#)*%,'K'4'Q'*)4%$+00-

Q';05%.#)-$).#$0+#3)-#./)*',/#0.%4)$#(.#.$/*2,/#0.%-)'1-)/$#.$/*2,/#0.'-%4)$#(.#.10>#$#.10*&'/#0.%4)$#(.#.10*&'/#0.%'*,"#/),/2*)#.10*&'/#0.%'++-#'.,)$#.104)$#(.

#)'#5&%)'$)%01%2$)"2&'.%1',/0*$"1)$",#%7)5",#"'*47'*)(*'.,0&0(004%)3+)*#).,)('&)$

('&)%4)$#(.1'5#0%$)*(#0)3+)*#).,)%4)$#(.)>0-/).>#*0.&)./$)&0/#0.%4)$#(.)47'*4%/21/))42'*40%&'.,"0.)A,0&&)*,)%$#/)$40.'-4%.0*&'.

$/,

$/,

IXDA mailing list Nov 2007Dan Saffer ‘The Disciplines of User Experience’ http://www.kickerstudio.com/blog/2008/12/the-disciplines-of-user-experience/

Curiosity, passion, and empathy are traits that user experience designers share [along with] a desire to achieve balance … most notably between logic and emotion ….To create truly memorable and satisfying experiences, a UX designer needs to understand how to create a logical and viable structure for the experience and needs to understand the elements that are importance to creating an emotional connection with the product’s users.

“

”Unger , R., Chandler, C. (2009) A Project Guide to UX Design: For User Experience Designers in the Field or in the Making - p6

So how does this relate to product

design?

Design a thing by considering it in its next largest context - a chair in a room, a room in a house, a house in an environment, environment in a

city plan.

“

”Henning Fischer, ‘Design Strategy on a Shoestring’ https://admin.na4.acrobat.com/_a829239006/p77669266/

Eliel Saarinem

Context =

Context = story

Mad Men “The Carousel” http://www.youtube.com/watch?v=R2bLNkCqpuY&feature=player_embedded

Sony Handycam http://portfolio.tyo-id.co.jp/handycam/

Adaptive Path/Mozilla Labs ‘Aurora’ http://vimeo.com/1450211

http://adaptivepath.com/aurora/themes.php

Macro

Micro

Starfire: A Vision of Office Computing (1992, for 2004)http://www.asktog.com/starfire/

Apple Knowledge Navigatorhttp://www.uie.com/articles/knowledge_navigator/

Nokia Morphhttp://www.nokia.com/about-nokia/research/demos/the-morph-concept

Nokia 888http://www.nokia888.com/

Context = steps

Young, I (2009) Mental Models http://www.flickr.com/photos/rosenfeldmedia/sets/72157603511616271/

Mental Models

Mental ModelsYoung, I (2009) Mental Models http://www.flickr.com/photos/rosenfeldmedia/sets/72157603511616271/

Context = people

Personas (designing for Clevis)Cooper, A. (1999) The Inmates Are Running the Asylum

Personas (designing for Clevis)Cooper, A. (1999) The Inmates Are Running the Asylum

Context = language

Godwin, K. (2008) Designing for the Digital Age

Cooper Office Phone - ‘Designing for the Digital Age’ and http://www.cooper.com/insights/concept_projects/office_phone.html

Design Language(Cooper Studio)

Context = reality

The reality of iMode - Bill Moggridge

Innovationsforum 2007 http://interface.fh-potsdam.de/innoforum/english/09_video.php?vidName=809546 (9:23-11:00)

People didn’t get it.For about 15 seconds.

“

”Scott Jenson, Google

Stanford HCI Seminar 2007 ‘Why Phones Are Not Computers’ http://www.youtube.com/watch?v=Mz9MELz1F-o (32:50-36:00)

✍

SCAD- Freescale Collaboration http://iact.in/?p=104

The Service Designers - The UX Workshophttp://www.theuxworkshop.tv/the-service-designers/

Kim Gowdin - UStream IXDA - Designing a Unified Experiencehttp://www.ustream.tv/recorded/1419557

Adaptive Path: calling all experience design clipshttp://www.adaptivepath.com/blog/2008/03/24/calling-all-experience-design-video-clips/

Free to read UX bookshttp://www.theuxbookmark.com/links/books/

Kicker Studiohttp://www.kickerstudio.com/blog/2009/03/case-study-gestural-entertainment-center-for-canesta/

Behaviour As The Engine Of Interaction Designhttp://www.slideshare.net/dansaffer/designing-from-the-insideout-behaviour-as-the-engine-of-product-design

Robert Fabricant - Behaviour Is Our Medium (Interaction 09)http://vimeo.com/3730382

Futuristic Interfaces on Displayhttp://www.technologyreview.com/blog/editors/23940/

Dynamically changing buttons on a physical display (Infosthetics)http://infosthetics.com/archives/2009/05/providing_dynamically_changeable_physical_buttons_on_a_visual_display.html

Stewart Brand - How Buildings Learn (6 part series)http://video.google.com/videoplay?docid=8639555925486210852

Communicating through video (concepting)http://johnnyholland.org/magazine/2009/07/communicating-ux-through-video-2-concepting/

http://www.boxesandarrows.com

http://www.ixda.org http://www.vimeo.com/user1128734

http://www.johnnyholland.org

http://www.uie.com/brainsparks/topics/podcasts/

http://www.slideshare.net/vickyteinakitwitter: @vickytnz