Hoorcollege 1 IAD2 0910Q1

Ontwerpen voor mobiele interfaces

Bronnen

Nieuwe modulepagina IAD2:

http://vakgroep.cmd.hro.nl/iad/iad2_0910q1

/

Nou ja, het scherm is gewoon wat kleiner…

‘Personal Communication Devices’Persoonlijk, gericht op één

identificeerbaar persoonCommunicatief, gebruikt voor

communicatie en verbonden met een netwerk op verschillende manieren

Handheld, draagbaar en te bedienen met één hand

Direct wakker te maken door gebruiker of netwerk

‘The Carry Principle’De gevolgen voor het apparaat:

Vorm: klein, draadloos, op batterijen

Features: alles in één functionaliteit

Capaciteiten: altijd een fractie van desktop computers

User interface: single window interface (transient posture)

Proliferatie: geen ‘one size fits all’

‘The Carry Principle’De gevolgen voor het

gebruikscenario:Beschikbaarheid: gebruikers zijn

altijd beschikbaar voor interactieBeperkte aandacht: gebruikers zijn

veelal met meer bezig dan interactie

Veranderend sociaal gedrag: gebruikers raken minder betrokken bij directe omgeving en blijven meer ‘op afstand’ betrokken

Verbonden met…

Variaties target hardware

Input devices

Touch screenPointing device (joystick)Keyboard (numeriek,

alphanumeriek)Soft keysDedicated buttonsCameraVoiceGPSKompasNabijheid sensor (iPhone)Oriëntatie sensor

Indeling mobiele ‘user experience’ volgens Nielsen

Vooral gebaseerd op schermgrootte

‘Feature phones’‘Smart phones’‘Touch-screen phones’

Hoe groter het scherm, hoe beter de bruikbaarheid

‘Mobile User Experience’ volgens Nielsen

The Mobile User Experience Is Miserable

Mobile Web 2009 = Desktop Web 1998

Uit: http://www.useit.com/alertbox/mobile-usability.html

Belangrijkste knelpunten mobiele bruikbaarheidKlein schermLastige invoer (vooral tekst)Langzame verbindingOngeschikte sites

Uit: http://www.useit.com/alertbox/mobile-usability.html

Schermen

ResolutiePitch (dpi, pixelgrootte)Ook spraak als output

modaliteit

Gestural Interfaces

Touchscreen vs. Free-form

Ergonomics of Interactive Gestures"Hands are underrated. Eyes

are in charge, mind gets all the study, and heads do all the talking. Hands type letters, push mice around, and grip steering wheels, so they are not idle, just underemployed."

—Malcolm McCullough, Abstracting Craft

(from: Saffer, 2009)

Ergonomics of Interactive GesturesLimitations due to anatomy,

physiology and mechanics of the human body (kinesiology)

Left-handedness (7-10%)FingernailsScreen Coverage

Designing Touch TargetsNo smaller than 1x1cm in an

ideal world

In a not so ideal world:Iceberg TipsAdaptive Targets

Designing Touch TargetsBut even spaciously sized

targets can be tricky…

Patterns for Touchscreens and Interactive Surfaces

Tap to open/activate

Patterns for Touchscreens and Interactive Surfaces

Tap to select

Patterns for Touchscreens and Interactive Surfaces

Drag to move object

Patterns for Touchscreens and Interactive Surfaces

Slide to scroll

Patterns for Touchscreens and Interactive Surfaces

Spin to scroll

Patterns for Touchscreens and Interactive Surfaces

Pinch to shrink and spread to enlarge

Patterns for Free-Form Interactive Gestures

Proximity activates/deactivates

Patterns for Free-Form Interactive Gestures

Point to select/activate

Patterns for Free-Form Interactive Gestures

Rotate to change state

Patterns for Free-Form Interactive Gestures

Shake to change

Patterns for Free-Form Interactive Gestures

Tilt to move

Interesting demos