User Experience Design in context of Graphic Design

9,575
-1

Published on

Please comment. User Experience Design presentation for the Graphic Design in Context uni module.

Thanks for watching.

Published in: Design, Business, Technology
3 Comments
21 Likes
Statistics
Notes
  • Great slide show and clear explanation for a graphic designer learning more about UX design. Simple, clean, concise. Thanks!
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Great preso, I would suggest that the yellow used throughout should be a bit darker in tone though... hurts my eyes. Apart from that its brilliant
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • great slide show, can I download and convert it to video for youtube using: http://www.powerpoint-to-video.org/leawo-powerpoint-to-video.html
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
9,575
On Slideshare
0
From Embeds
0
Number of Embeds
8
Actions
Shares
0
Downloads
386
Comments
3
Likes
21
Embeds 0
No embeds

No notes for slide

User Experience Design in context of Graphic Design

  1. User Experience Design in context of Graphic Design ~Jiri Jerabek~
  2. 01 The Aim of The Presentation →→explaining→the→term→“user→experience” →→what→is→the→aim→of→UX→design? →→how→UX→design→relates→to→graphic→design? →→examples→explaining→main→UX→design→→→ → → → principles →→historical→and→contemporary→confrontation→→ → → of→phone→interface→design→ →→concludes,→what→we→as→designers→should→→ → → → stick→to;→major→principles→of→UX→design
  3. What is User Experience Design?
  4. 02 Explaining term “User Experience” →→User→Experience→is→how→users→feel→when→→ → → → using→a→product→ →→if→they→like→or→dislike→using→it→ →→determines→if→they→will→use→it→again
  5. 03 What is the aim of UX Design? “ “It doesn’t matter if you used a device hundred times successfully - you will remember the unsuccessful attempt.” Donald→Norman
  6. →→the→main→goal→is→to→design→a→product→which→we→→ → will→be→able→to→use→not→only→with→a→success→ →→but→with→pleasure→as→well→ →→to→design→a→product→that→users→will→want→to→use→→ → again
  7. 04 How does it relate to Graphic Design? →→graphic→design→is→an→integral→part→of→the→→→ → → → concept→of→the→product→ →→thus→it→is→an→integral→part→of→user→experience→→→ “ → design→process “A picture is worth a thousand words. An interface is worth a thousand pictures.” Ben→Shneiderman
  8. →→the→user→interface→we→create→is→actually→a→→ → → → meeting→plane→of→user’s→needs→and→product’s→→ → features→ →→when→users→see→an→interface,→they→create→a→→ → → “conceptual→model”→in→their→mind→ →→that→means→they→try→to→imagine→how→the→ → product→works→and→what→they→have→to→do→to→→ → → make→the→desired→action;→ie.→to→play→a→game→on→→ → the→mobile→phone→ →→designers→know→how→the→product→works→so→→ → they→should→investigate→user’s→needs→and→→ → apply→these→findings→to→the→design→of→the→user→→ → interface→ →→designers→are→responsible→not→→only→for→how→→ → the→product→will→look→but→how→users→will→→ → interact→with→it
  9. 05 What does make a design successful? “ “People think it’s this veneer -- that the designers are handed this box and told, ‘Make it look good!’ That’s not what we think design is. It’s not just what it looks like and feels like. Design is how it works.” Steve→Jobs
  10. →→in→today’s→society,→good→design→is→synonym→→ → → for→aesthetics→ →→but→good→design→is→about→good→user→→ → → → → → experience “ “Appearance has a strong impact on functionality: An application that appears cluttered or illogical is hard to understand and use.” iPhone→Human→Interface→Guidelines
  11. →→decisions→leading→to→successful→design→aren’t→→ → accidental,→they→are→a→result→of→strategy→ → planning,→careful→research→and→user→testing→ →→it’s→very→important→to→research→who→we→design→→ → for→-→the→users→-→what→their→needs→and→→ → problems→are,→how→the→product→is→going→to→→ → help→them
  12. 06 So is it just about the users? →→we→do→not→design→only→to→satisfy→users’→needs,→→ → but→to→meet→needs→and→goals→of→ → the→manufacturers→as→well
  13. 07 What is UX Design about after all? →→UX→is→not→about→aesthetics→-→it’s→about→→ → understanding→user´s→behavior→and→needs→ →→but→aesthetics→is→important→ →→UX→is→not→user→interface→design→-→but→designing→ → → UI→is→an→integral→part→of→the→UX→Design→process→ →→it’s→a→design→discipline→concentrating→on→→ → finding→a→solution→to→make→a→product→which→→ → people→will→enjoy→using,→won’t→struggle→and→→ → will→want→to→use→again
  14. Historical & contemporary confrontation of telephone interface design
  15. 08 The history of a telephone interface →→the→history→of→a→telephone→dates→back→to→the→→ → invention→of→a→Morse→telegraph→in→the→first→half→→ → of→the→19th→century →→though→the→device→itself→had→pretty→simple→→→ → → interface,→it→wasn’t→very→user→friendly→ →→only→skilled→operators→with→knowledge→of→the→→ → → Morse→code→were→able→to→successfully→send→→ → and→receive→a→message→ →→the→operator→had→to→translate→the→message→into→→ → the→Morse→code→and→then→operate→a→bar→to→send→ → → the→message→to→the→receiver
  16. →→the→breakthrough→in→telecommunication→dates→→ → back→to→1876→when→Alexander→Graham→→ → Bell→was→awarded→a→patent→for→invention→of→a→→ → telephone→ →→the→interface→of→the→early→telephones→was→→ → quite→complicated→ →→an→operator→had→to→use→a→crank→to→rung→→ → the→telephone→on→the→other→end→of→the→line→ →→separated→earpiece→and→microphone→ →→no→dial,→just→2→telephones→connected→together
  17. →→the→evolution→of→the→telephone→continued→→ → and→brought→several→improvements→to→ → the→telephone’s→interface→ →→a→dial,→allowing→to→connect→to→other→→ → telephone→lines→in→user→friendly→way→ →→a→“switchhook”,→a→hook→on→which→an→→ → earpiece→was→hung→if→not→in→use→ →→a→seamless→handset→connecting→the→→ → earpiece→and→microphone
  18. 09 Modern office telephone →→in→the→2nd→half→of→20th→century,→rapid→evolution→→ → of→technology,→allowed→manufacturers→to→→ → introduce→new→functions→ →→competition→forced→the→manufacturers→→ → to→reduce→design→&→development→costs→ →→these→phones→brought→lots→of→different→functions,→→ → rows→of→similar→buttons→and→a→user→manual→you→had→→ → to→read→and→remember→how→to→use→all→these→functions→ →→user→was→forced→to→create→complex→conceptual→→ → models→-→which→buttons→in→what→order→to→press→to→call→→ → a→desired→function
  19. 10 Example Features→these→functions: -→headset→connection→with→line→button -→computer/fax→connector→and→mute→→button -→20→direct→non-volatile→memories -→On-hook→dialling→with→LED→indicator -→Speakerphone -→One-touch→memory→dialling→(on/off) -→Message→waiting→and→visual→ringing→indicator -→Hold,→headset→and→microphone→muting→have→LED→indicator -→Time→break→recall/earth→recall -→Adjustable→receiver,→ringer→and→speaker→volume -→PBX→message→waiting
  20. “ “The phone has some features (such as ringtones) where the manual doesn’t tell you how to set them. I had to contact their helpline, only to find out that the settings are hidden behind a screwed-on panel. There are speed dial buttons, but you can see from the picture of the phone that there isn’t a place beside the buttons to write names (they are 5mm apart). This phone seems to me to have poor usability overall. I wouldn’t buy it again. In fact, I’m shopping for a replacement, and I’ve only had this about 2 months.” The→Amazon.co.uk→user→“TreeHouseCoach”→(Oxford)
  21. What do I think is wrong from the User Experience point of view?
  22. 11 Conceptual models →→To→use→the→function,→users→have→to→press→→ → a→particular→button;→or→worse→a→sequence→of→→ → buttons→ →→ie.→*1→for→hold,→103#→to→call→a→colleague,→*3→to→→ → transfer→a→call,→and→finally→hang→up→ →→Basically,→I→need→to→remember→which→buttons→→ → should→I→use→in→what→order→to→perform→a→→ → desired→action.→This→is→a→conceptual→model→ →→Users→are→forced→to→create→such→conceptual→→ → models→for→every→action→they→want→to→perform,→→ → mainly→due→to→the→design→of→the→phone,→which→→ → is→nowhere→close→to→being→self-explanatory
  23. 12 Lack of Constraints →→User→has→no→guidance→what→buttons→in→what→→ → order→to→press,→apart→from→the→user→guide→ →→Errors→are→common→and→there→is→no→way→how→→ → to→precede→them.
  24. 13 Lack of Visibility →→All→buttons→are→often→similar→looking,→same→→ → size.→ →→Display→is→often→unused→or→shows→information→→ → not→relating→to→desired→action.→ →→No→indication→which→buttons→press→in→which→→ → situations.
  25. let’s have a look on Apple’s iPhone
  26. “ “Good design is also an act of commu- nication between the designer and the user, except that all the communication has to come about by the appearance of the device itself. The device must explain itself.” Donald→Norman
  27. 14 Metaphors →→iPhone’s→interface→is→built→around→“Metaphors”→→ → -→a→software→representation→of→the→object→or→→ → action→in→real→world.→ →→For→example→-→a→“Folder”→on→our→desktop→is→a→→ → software→metaphor→for→real→folder→we→use→to→→ → store→documents.
  28. →→When→a→Metaphor→is→used→as→a→part→of→ → the→interface,→user→can→easily→understand→the→→ → particular→function.→ →→Metaphors→are→self-explanatory→–→a→sort→of→→ → Holy→Grail→of→interface,→because→user→is→not→→ → forced→to→create→a→complicated→conceptual→→ → model,→but→immediatelly→sees,→what→the→→ → particular→function→is→for→or→uses→his→intuition→→ → to→perform→actions→in→the→same→way→he→would→→ → perform→them→in→a→real→world.
  29. 15 Direct Manipulation “ “A great user interface follows human interface design principles that are based on the way people—users—think and work, not on the capabilities of the device.” iPhone→OS→Reference→Library
  30. Users→operating→a→phone→with→classic→interface→with→ buttons→are→forced→to→create→conceptual→models. They→need→to→understand→and→remember→what→particular→ buttons→do,→how→to→get→the→cursor→to→the→desired→ location,→how→to→navigate→through→menu→etc. This→often→makes→using→a→phone→difficult→and→unnatural. In→contrast,→due→to→its→touch-screen→and→gestures,→ iPhone→users→can→perform→actions→just→with→their→fingers→ in→a→very→natural→way,→without→a→need→for→creating→ additional→conceptual→models.→ → People→feel→they→control→something→tangible,→not→ abstract.
  31. Conclusion
  32. 16 Questions to ask Questions→I→think→a→designer→should→ask→before→starting→ a→design→project: →→how→do→we→want→to→benefit→from→the→project?→ →→how→do→our→users→want→to→benefit→from→our→→ → project?→ →→who→are→the→users?→(demographic→and→→ → psychographic→research)→ →→what→are→our→users→needs?
  33. 17 Most important thing I have learned Designers→should→learn→more→about: →→how→people→think,→behave→and→interact→→ → (psychology,→human→-→computer→interaction)→ →→UX→design→and→Interactive→Design→methods→→ → and→process→ →→keep→learning→about→visual→communication,→→ → typography→and→graphic→design→in→general→-→→ → it’s→very→important→to→stay→informed→and→up→to→→ → date
  34. 18 Major design principles →→visibility→ →→affordance→ →→feedback→ →→constraints
  35. 19 Prototype & test →→prototype→and→test→your→design
  36. The End
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×