Dit is de samenvatting van de hele reader (hoofdstuk 1, 2 en 3) van Human Computer Interaction (HCI) voor de opleiding Communicatie en Multimedia Design, jaar 1. Ik heb dit gemaakt voor het tentamen. Bijna alles is in het Nederlands, behalve belangrijke termen.
Human Computer
Interaction
Hele Reader - Jaar 1
Layla van Hulst
,Inhoudsopgave
Chapter 1 – The Elements of User Experience ................................................................................................. 4
The Elements – Jesse James Garrett................................................................................................................... 4
User Experience Hierarchy of Needs model........................................................................................................ 4
Design Patterns .................................................................................................................................................. 5
Design Principles ................................................................................................................................................ 6
Design Principles Pt. 2 ........................................................................................................................................ 6
Introduction to Web Accessibility – Disabilities.................................................................................................. 7
Principles of Accessible Design ...................................................................................................................... 7
Navigating Content........................................................................................................................................ 7
Design for Keyboard-only and Assistive Technology Users ................................................................................ 7
Chapter Two – Tap is the new Click ................................................................................................................ 8
UI Paradigmas – The Evolution of User Interfaces ............................................................................................. 8
Classification of Interaction Styles ..................................................................................................................... 8
Interface Metaphors and Analogies ................................................................................................................... 9
How We Hold Our Handheld Devices ............................................................................................................... 10
Phone .......................................................................................................................................................... 10
Phablet ........................................................................................................................................................ 10
Tablets ......................................................................................................................................................... 11
Laptops ........................................................................................................................................................ 11
Lay-out for Handheld Devices .......................................................................................................................... 12
Fitts’ Law – Expandable Menus: Pull-Down, Square or Pie? ............................................................................ 12
Linear (or Drop-Down) Menus .................................................................................................................... 12
Rectangular (or Square) Menus .................................................................................................................. 13
Pie (or Radial) and Marking Menus ............................................................................................................. 13
Chrome (non-content) ...................................................................................................................................... 14
Maximize the Content-to-Chrome Ratio .......................................................................................................... 14
Touch Target Size – Go Big or Go Home ........................................................................................................... 15
Gestures in Touch User Interface ..................................................................................................................... 15
(Perceived) Affordance ..................................................................................................................................... 15
Discoverability of Gestures ............................................................................................................................... 16
Microinteractions – Triggers ............................................................................................................................ 16
Microinteractions – Feedback .......................................................................................................................... 17
Designing a VUI – Voice User Interface ............................................................................................................ 17
Chapter 3 – Forms are everywhere > Input and Forms Getting Input from Users ......................................... 19
Controls ............................................................................................................................................................ 20
Patterns ............................................................................................................................................................ 22
Pattern: Forgiving Format ........................................................................................................................... 22
Pattern: Structured Format ........................................................................................................................ 22
Pattern: Fill in the Blanks ............................................................................................................................ 22
Pattern: Input Hints .................................................................................................................................... 22
Pattern: Illustrated Choices ........................................................................................................................ 22
2
, Pattern: Input Prompt................................................................................................................................. 23
Pattern: Autocompletion ............................................................................................................................ 23
Pattern: Good Defaults ............................................................................................................................... 23
Specific Mobile Input Mechanisms ................................................................................................................... 24
Use Uniquely Mobile Input Mechanisms .......................................................................................................... 25
Organizing the Page ......................................................................................................................................... 25
Pattern: Responsive Disclosure .................................................................................................................. 26
Pattern: Responsive Enabling ..................................................................................................................... 26
Pattern: Animated Transitions ................................................................................................................... 27
Label Alignment in Forms ................................................................................................................................. 27
Right-Alined Labels ...................................................................................................................................... 27
Left-Aligned Labels: ..................................................................................................................................... 28
Labels Within Input ..................................................................................................................................... 28
Disabled Buttons Suck ...................................................................................................................................... 28
In-Page Editing ................................................................................................................................................. 29
Pattern: Single-Field Inline Edit .................................................................................................................. 29
Pattern: Multi-Field Inline Edit ................................................................................................................... 29
Pattern: Overlay Edit................................................................................................................................... 30
Error messages – Show the Solution ................................................................................................................ 31
Motivating users to give input – The Subtle Art of Seduction .......................................................................... 31
Coming on Too Strong – and how not to.......................................................................................................... 31
Design Better Forms ......................................................................................................................................... 32
3
, Chapter 1 – The Elements of User Experience
The Elements – Jesse James Garrett
Surface: buitenkant van een webpagina
(foto’s en tekst)
Functional: ideeën beginnen als functionele oplossing
voor een probleem.
Reliable: Vertrouwen van de bruikbaarheid of
vertrouwen van de gegevens. (Denk aan online een
kaartje kopen, dit moet te vertrouwen zijn.)
Usable and convenient: Het fijn en gemakkelijk maken
om te gebruiken.
Pleasurable: Waar gemak zich focust op cognitie, is dit
level gericht op emoties. Hoe kan iets emotioneel
boeiend en gedenkwaardig zijn?
Meaningful: Dit is persoonlijk en subjectief. (Apple is
meer dan alleen elektronica.)
4
Voordelen van het kopen van samenvattingen bij Stuvia op een rij:
Verzekerd van kwaliteit door reviews
Stuvia-klanten hebben meer dan 700.000 samenvattingen beoordeeld. Zo weet je zeker dat je de beste documenten koopt!
Snel en makkelijk kopen
Je betaalt supersnel en eenmalig met iDeal, creditcard of Stuvia-tegoed voor de samenvatting. Zonder lidmaatschap.
Focus op de essentie
Samenvattingen worden geschreven voor en door anderen. Daarom zijn de samenvattingen altijd betrouwbaar en actueel. Zo kom je snel tot de kern!
Veelgestelde vragen
Wat krijg ik als ik dit document koop?
Je krijgt een PDF, die direct beschikbaar is na je aankoop. Het gekochte document is altijd, overal en oneindig toegankelijk via je profiel.
Tevredenheidsgarantie: hoe werkt dat?
Onze tevredenheidsgarantie zorgt ervoor dat je altijd een studiedocument vindt dat goed bij je past. Je vult een formulier in en onze klantenservice regelt de rest.
Van wie koop ik deze samenvatting?
Stuvia is een marktplaats, je koop dit document dus niet van ons, maar van verkoper laylachlo. Stuvia faciliteert de betaling aan de verkoper.
Zit ik meteen vast aan een abonnement?
Nee, je koopt alleen deze samenvatting voor €5,48. Je zit daarna nergens aan vast.
