• Save
0515 UiGathering Talk - Interaction Design by Stanley
Upcoming SlideShare
Loading in...5
×
 

0515 UiGathering Talk - Interaction Design by Stanley

on

  • 3,510 views

 

Statistics

Views

Total Views
3,510
Views on SlideShare
2,828
Embed Views
682

Actions

Likes
31
Downloads
0
Comments
0

12 Embeds 682

http://mony.pixnet.net 297
http://uxmap.net 171
http://soldiers1.wordpress.com 73
http://soldiers.tumblr.com 51
http://morethanorequalto.blogspot.com 51
http://acdesignlab.blogspot.com 21
http://www.slideshare.net 7
http://localhost 4
url_unknown 3
http://webcache.googleusercontent.com 2
http://acdesignlab.blogspot.tw 1
https://www.google.com.tw 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    0515 UiGathering Talk - Interaction Design by Stanley 0515 UiGathering Talk - Interaction Design by Stanley Presentation Transcript

    •    School  of  Informa-on  University  of  Michigan  
    •  •   •   •   •     
    •  (Interac-on  Design,  IxD)  ?  
    • The  prac-ce  of  designing  interac-ve  digital  products,  environments,  systems,  and  services   (by  Cooper  et  al.,  About  Face)  
    • Designing  interac-ve  products  to  support  people  in  their  everyday  and  working  lives   (by  Preece  et  al.,  Interac.on  Design,  2002)  
    • Interac-on  design  (abbreviated  as  IxD)  defines  the  structure  and  content  of  communica-on  between  two  or  more  interac-ve  "beings"  to  understand  each  other.     (by  McCullough,  Digital  Ground,  2004)  
    • ?   IxD  HCI   (Human-­‐Computer  Interac-on)  UX   (User  Experience)  UE   (Usability  Engineering)   UI   (User  Interface)  UCD   (User-­‐Centered  Design)  HCD   (Human-­‐Centered  Design)   IA   (Informa-on  Architecture)  
    • IxD UX   Content   Form   Informa-on  Architects   Industrial  designers   Copywriters   Graphic  designers   Animators   Sound  designers   Behavior   Interac-on  Designers  UX  Elements   Cooper  et  al.  About  Face  
    • ?  
    •   Vannevar  Bush,  As  We  May  Think,  1945  hWp://www.youtube.com/watch?v=c539cK58ees&feature=related  
    • hWp://www.weeplaces.com/sha-­‐hwang/  
    •  
    • Iden-fy  needs/   establish   requirement  (Re)Design   Evaluate   Build  an   interac-ve   version   Final  Product   Preece  et  al.  Interac.on  Design  
    • >  Iden.fy  needs/establish  requirement   Iden-fy  needs/   establish   requirement   Design  Requirement  Analyzing,  Highligh-ng,  and   Project  Ini-a-on   Priori-zing   Design   Design   Idea   High-­‐level  goal  &  design  requirement  Request   Problem   ini-a-on   User  Study  (contextual  inquiry,   interview,  diary,  etc  )   Compara-ve   Analysis   Interpreta-on  (sequence,  flow,   ar-fact,  culture,  physical)   Persona   Analyzing,  Highligh-ng,  Priori-zing  
    • >  Iden.fy  needs/establish  requirement   User  Study  (contextual  inquiry,   Interpreta-on  (sequence,  flow,   interview,  diary,  etc  )   ar-fact,  culture,  physical)   Contextual  Inquiry   Affinity  Diagram  /   coding  Interview  /  Focus  group   Sequence  model   Diary  Study  
    • >  Iden.fy  needs/establish  requirement  Compara-ve  Analysis   Mee-ng  Tool  
    • >  Iden.fy  needs/establish  requirement  Compara-ve  Analysis   Mee-ng  Tool  
    • >  Iden.fy  needs/establish  requirement   Analyzing,  Highligh-ng,  Priori-zing  Persona   Group  
    • >    (Re)Design  &  Build  Prototype   Iden-fy  needs/  Design  requirement  &   establish   ideas   requirement   Scenario  /  Storyboard   (Re)Design   Sketch   Prototype   Ideate   Iterate   Build  an   interac-ve   version  
    • >    (Re)Design  &  Build  Prototype   Scenario  /  Storyboard  hWp://taehok.com/night/?page_id=64  
    • >    (Re)Design  &  Build  Prototype   Scenario  /  Storyboard  hWp://taehok.com/night/?page_id=64  
    • >    (Re)Design  &  Build  Prototype   Sketch  hWp://taehok.com/night/?page_id=64  
    • >    (Re)Design  &  Build  Prototype   Buxton,   Sketching   User   Experience, 2007  
    • >    (Re)Design  &  Build  Prototype   Buxton,  Sketching  User  Experience,2007  
    • >    (Re)Design  &  Build  Prototype  Prototype   Prototypes   ?  
    • >    (Re)Design  &  Build  Prototype  Prototype   Prototypes  as  “Filters”   (Lim  &  Stolterman.  2008)  
    • >    (Re)Design  &  Build  Prototype   Prototype   Appearance   Data   Func-onality   Interac-vity   Spa-al  structure  hWp://taehok.com/night/?page_id=64  
    • >    (Re)Design  &  Build  Prototype   Prototype   Role  Implementa-on   Look  and  Feel  (Houde  &  Hill  ,  1997)  
    • >    (Re)Design  &  Build  Prototype  Prototype   ?  
    • >    (Re)Design  &  Build  Prototype   Prototype    hWp://farm3.sta-c.flickr.com/2384/2652071069_745clbb8e_o.jpg   hWp://www.iteamnm.com/images/0691_18.jpg  
    • >    Evaluate   Iden-fy  needs/  Design  requirement  &   establish   ideas   requirement   (Re)Design   Evaluate   Build  an   interac-ve   version  
    • >    Evaluate   Usability  Inspec-on   Tes-ng   Others   Methods   Heuris-c   Usability  Tes-ng   GOMS   Evalua-on   Cogni-ve  A/B  Tes-ng   Wizard  of  OZ   Walkthrough   Speed  Da-ng   Replay  
    • >    (Re)Design  &  Build  Prototype   Usability  Tes-ng  Usefulness,  Efficiency,  Effec-veness,  Sa-sfac-on,  Accessibility  hWp://farm3.sta-c.flickr.com/2384/2652071069_745clbb8e_o.jpg   hWp://www.doublejumpmedia.com/wp-­‐content/uploads/2009/05/
    • >    (Re)Design  &  Build  Prototype   Wizard  of  Oz   Speed  Da-ng  hWp://farm3.sta-c.flickr.com/2384/2652071069_745clbb8e_o.jpg   hWp://www.doublejumpmedia.com/wp-­‐content/uploads/2009/05/
    • >    (Re)Design  &  Build  Prototype     1.   ” ”  2.     3.     4.    
    • >    (Re)Design  &  Build  Prototype     1.   ” ”  2.     3.     4.    
    • Iden-fy  needs/   establish   requirement  (Re)Design   Evaluate   Build  an   interac-ve   version   Final  Product   process” ” ?   Preece  et  al.  Interac.on  Design  
    • “technology  as  experience”   McCarthy  &  Wright,  2007  
    • Iden-fy  needs/   establish   requirement  (Re)Design   Evaluate   Build  an   interac-ve   version   Final  Product  
    • Iden-fy  needs/   establish   Understand   requirement  (Re)Design   Evaluate   Build  an   interac-ve   version   Final  Product  
    • Case1:  Whereabout  Clock   Symbol  of  togetherness   and  connectedness   (Sellen  et  al.  2006)  
    • Case2:  SmartHome  Feel  likes  to  be  a  good  parent   (Davidoff  et  al.  2007)  
    • :  1. ,    2.  3. , ,    4.  5.  
    • Iden-fy  needs/   establish   Understand   requirement   (Re)Design   Evaluate   Build  an   interac-ve   version  Design  Principles   Final  Product  
    • Gulfs  of  Evalua-on  &  Execu-on   Inten-ons   evalua-on  Execu-on  Gulf   Goals   Interface   Interface   Evalua-on  Gulf   Physical  System   by  Don  Norman  
    • Make  use  of  conven.on!!  
    • What  is  a  browser?  What  features  and  func-onality  a   browser  “should”  have?  
    • Conceptual  Model  
    • Designers’  mental   Users’  mental   model   model   Conceptual  Model  
    • Gmail   Move  to   Labels  ?   Designers’  mental   model:  label   Users’  mental   model:  folder  
    • Signifier  
    • hWp://heroswelcome.com/images/P/Dental-­‐mirror-­‐1.jpg  
    • hWp://www.dental-­‐teeth.com/wp-­‐content/uploads/2010/10/dental-­‐handpiece.jpg  
    • hWp://www.henkesasswolf.de/uploads/tx_exojavagal/Henke_Dent_2000SA_01.jpg  
    • hWp://chrisocp.files.wordpress.com/2010/01/hammer3.jpg  
    • “simpler-­‐looking  does  not  always   translate  to  simplicity  of  use”   by  Don  Norman  
    • “complexity  is  a  fact  of  the  word,  simplicity  is  in  the  mind”   by  Don  Norman  
    • Even  simple-­‐look  things  are  complex  
    • Social  Signifier  
    • Recommender  &  Reputa-on  system  
    • System  Feedback  
    • Error  Preven.on  &  Recover  
    • slips   Undo  Slips  
    • Recover  mistakes  
    • Flexibility  
    • Effort  Minimiza.on  
    • ,    .  
    •  
    • ” ”  
    •  
    •  
    •  
    •  
    •    
    • Thank  you