IAD 5 - les 1 - Context and challenges in mobile design

Interaction Design 201 Vragen of feedback? @ferrydendopper

Context & Challenges in Mobile Design


Module 5:Design for Mobile

Duur: 10 weken, 7 colleges


Programma

Week:1. Context & Challenges in Mobile Design2. Responsive Design3. Design for Touch4. Designing Apps5. Mobile Forms6. Mobile Usability Testing7. Toegankelijk ontwerpen


Lesstof

Tapworthy: Designing Great iPhone Apps Josh Clark

About Face 3Alan Cooper

( )


Beoordeling

Opdracht De website responsive ontwerpen. Een relevante app bedenken en ontwerpen.

Je werkt aan de opdrachten als tweetal.


Beoordeling opdracht

RESPONSIVE: Heb je een goed responsive systeem opgezet? (max. 20 punten)

RESPONSIVE: Heb je gebruikersinterface goed gedocumenteerd volgens de standaarden uit IAD? Heb je je ontwerpkeuzes goed onderbouwd? (max. 20 punten)

APP: Heb je een relevante toepassing bedacht waar studenten regelmatig op hun mobile device mee zouden interacteren? (max. 10 punten)

APP: Heb je een effectieve en gebruikersvriendelijke gebruikersinterface ontworpen? (max. 30 punten)

APP: Heb je gebruikersinterface goed gedocumenteerd volgens de standaarden uit IAD? Heb je je ontwerpkeuzes goed onderbouwd? (max. 20 punten)


Context & Challenges in Mobile Design


Nou ja, het scherm is gewoon wat kleiner…


Variaties in schermgrootte


Variaties in hardware


Touch screen Pointing device (joystick) Keyboard

((alfa)numeriek) Soft keys Dedicated buttons Camera Voice GPS Kompas Nabijheid sensor Oriëntatie sensor

Veel input devices


Visueel (LED-scherm) Auditief (speaker) Tactiel (trillen)

Output devices


Verbonden met…


De condities zijn totaal verschillend

http://unitid.nl/2009/09/ontwerpen-voor-het-mobiele-web/




http://www.slideshare.net/cxpartners/web-and-mobile-forms-design-userfriendly-2010-workshop





From: Tapworthy: Designing Great iPhone Apps by Josh Clark

http://www.amazon.com/dp/B003WQB2U6/ref=rdr_kindle_ext_tmb



http://www.amazon.com/s/ref=rdr_kindle_ext_aut?_encoding=UTF8&index=books&field-author=Josh%20Clark


Mobile Mindsets

I am micro-tasking

From: Tapworthy: Designing Great iPhone Apps by Josh Clark

I am local I am bored




http://www.amazon.com/s/ref=rdr_kindle_ext_aut?_encoding=UTF8&index=books&field-author=Josh%20Clark


Tablets: nieuwe context & uitdaging

Lean back vs lean forward Ander gebruik dan mobiel en

desktop: informatie ‘snacken’


Tablets responsible for the rebirth of reading, says The Economist

http://www.theverge.com/2011/12/15/2637699/economist-rebirth-reading-lean-back




The Economist:

Unlike the desktop and laptop web experience, these devices are allowing users to read at their leisure.

42 percent of tablet users regularly read in-depth articles, with another 40 percent reading them occasionally

Tablet users are three times more likely to read an article than watch a news video

A user's eye activity is far more focused on an iPad app than on a website





Ideaal voor front-office

Info opzoeken Notities maken Eenvoudige

handelingen

Dus hoe ontwerp je voor mobile?

Bouw een aparte mobiele site

Auto-redirect zoekopdrachten naar je mobiele site

Stuur gebruikers die meer info willen naar de desktop site

Schrap features en content die niet passen in de mobiele context

Link naar volledige site

Top ‘onderweg’ taken

De mobiele context

Onderweg Micro-taken

Multi-tasking

“Niemand zal onze energietarieven

ooit op zijn mobiel willen bekijken.”

“Het is volstrekt niet logisch dat gebruikers

dat allemaal gaan lezen op hun mobiel.”

“Mensen kunnen dit complexe formulier

toch veel beter invullen op hun pc?”

De mobiele context


Multi-tasking

De mobiele context


Multi-tasking

✘

van alle mensen met mobiel internet benadert het web primair via mobiel

31%

http://pewinternet.org/Reports/2012/Cell-Internet-Use-2012/Key-Findings.aspx



van 18-29 jarigen met mobiel internet benadert het web primair via mobiel.

45%




van mensen met een inkomen onder $25.000 heeft geen pc,

maar vaak wel een smartphone met internet.

60%




“If your information is not available on small screen, it doesn’t exist for all the people that rely on their

mobile phones for access.”

Pew Research

van de mensen gebruikt mobiel internet tijdens het televisiekijken.

86%




zegt te internetten op de wc.(dus 60% liegt)

39%




start een taak op het ene apparaat en voltooit het op een ander apparaat.

90%




Mensen kopen diamanten via mobiel

Mensen vullen complexe formulieren in

“Denk niet dat jij kunt raden welk deel van

jouw content een mobiele gebruiker wil.

Je zult verkeerd gokken.”

Karen McGrane

Contentpariteit

= =

“Als een gebruiker bij een webpagina kan komen op een desktop pc, moet hij

dezelfde pagina op dezelfde URL kunnen

bereiken op zijn mobiel.”

Brad Frost


The carry-principle

If only one device is in your pocket …

… you browse on this device.


De gevolgen voor het gebruikscenario:

• Beschikbaarheid: gebruikers zijn altijd beschikbaar voor interactie

• Beperkte 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

The carry-principle


Grootste knelpunten mobiele bruikbaarheid

Klein scherm Lastige invoer (vooral tekst) Langzame verbinding Ongeschikte sites

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

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

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

Ik wil een app!

van branded apps haalt de 1000

downloads niet

80%

Adaptieve

Systemen

Adaptieve

Systemen

Tijd

Plaats

Agenda

Big data: bv. weer, verkeer

Gedrags-patronen

Licht

Internet-verbinding

Geluid

Zoek historie

Adaptieve systemenluisteren naar de omgeving en leren de gedragspatronen van

de gebruiker.

Tijd

Plaats

Agenda

Verkeer

Gedrags-patronen

Licht

Internet-verbinding

Geluid

Zoek historie

Adaptieve systemenluisteren naar de omgeving en leren de gedragspatronen van

de gebruiker.begrijpen niet alleen de gebruikscontext, maar

anticiperen wat de gebruiker wil op specifieke momenten.

geven ‘just in time’ antwoord voordat je de vraag kunt typen

Google Now


Lezen

Reader: hoofdstuk 1


Vragen? Feedback?

[email protected]

@ferrydendopper

IAD 5 - les 1 - Context and challenges in mobile design

Design

Transcript of IAD 5 - les 1 - Context and challenges in mobile design