ONTWERPEN VOOR ANDROID

dinsdag 26 januari 2010

INGE KUIJPER

Nieuwe Garde Amsterdam www.nieuwegardeamsterdam.nl

@nieuwegardeAms

dinsdag 26 januari 2010

INTERNET GEBRUIK OP MOBIEL - WERELD

Bron: AdMob/Google, November 2009

Intro

dinsdag 26 januari 2010

WAT IS ANDROID?

dinsdag 26 januari 2010

Google’s open source Operating System voor het mobiele platform

Intro

dinsdag 26 januari 2010

Gelanceerd

oktober 2008

iPhone: juni 2007

Intro

dinsdag 26 januari 2010

TOESTELLEN

Wereldwijd Nederland

meer dan16 7

Intro

dinsdag 26 januari 2010

MARKET APP STORE

•Geen goedkeuringsproces, een applicatie is direct beschikbaar.

•Gebruikers kunnen applicaties alleen downloaden vanaf de telefoon

•Huidige status Android Market > 10.000 apps

•In het komende jaar wordt een vijfvoudige groei verwacht van Android apps op Market.

Intro

dinsdag 26 januari 2010

VOORSPELD

Android is in 2012 het op 1 na grootste smartphone platform (na Symbian)

Intro

dinsdag 26 januari 2010

GENERIEKE INTERFACE

HomeToon homescreen.

Search

SendBellen en mute.

MenuHet menu wordt geactiveerd door de Menu button. In dit menu (het Options menu) passen tot 6 items.

Back buttonMet de back button kan de gebruiker naar een vorig scherm navigeren of een actie ongedaan maken.

EndGesprek eindigen.

Trackball

Intro

dinsdag 26 januari 2010

TOESTELLEN IN NEDERLAND

T Mobile G1(HTC Dream)

HTC Magic HTC Hero HTC Tattoo240x320

Huawei U8220 / Pulse

Acer A1 / Liquid

Samsung Galaxy 17500

Intro

dinsdag 26 januari 2010

TOESTELLEN IN NEDERLAND

Sony Ericsson Xperia x10(480x854)

Motorola Milestone /Droid

(480x854)

Google Nexus one

(480x800px)

Intro

dinsdag 26 januari 2010

TOESTELLEN IN NEDERLAND

Sony Ericsson Xperia x10(480x854)

Motorola Milestone /Droid

(480x854)

Google Nexus one

(480x800px)Verwacht

Intro

dinsdag 26 januari 2010

SOFTWARE

Verschillende versies van het Android OS.

+

+

+

Etc.+1.5

1.6

2.0

Custom firmware: Telefoon aanbieders maken een eigen user interface laag.

Etc.

Fragmentatie

dinsdag 26 januari 2010

WAT BETEKENT DIT?

•Verzamel up-to-date informatie over de Android versies in de markt.

•Testen voor alle versies is altijd noodzakelijk.

•Android is grotendeels backwards compatible, tenzij je een nieuwe feature wilt gebruiken.

Voorbeeld: Android 2.0 biedt de Bluetooth API, die P2P interacties mogelijk maakt. Wil je hier een game voor ontwerpen, dan zal deze voorlopig alleen beschikbaar zijn voor gebruikers met Android 2.0.

Fragmentatie

dinsdag 26 januari 2010

HARDWARE

Hardware verschillen: schermformaten en resoluties,processor snelheid, geheugen capaciteit, camera kwaliteit, etc.

Klein Normaal Groot

Fragmentatie

dinsdag 26 januari 2010

WAT BETEKENT DIT?

•Kies een referentietoestel voor ontwerpers en ontwikkelaars.

•Ontwikkel minimaal met Android 1.6 (ondersteunt schalen) en test op 1.5.

•Test je applicatie op alle schermformaten.

•Let o.a. op: minimale grootte van touch targets bij kleinere schermen / hoge resolutie.

Fragmentatie

dinsdag 26 januari 2010

INTERACTIE ONTWERP

•UX ontwerprichtlijnen voor Android zijn summier.

•UI guidelines op Developers Blog erg technisch of gaan in op details voor visueel ontwerp.

•Best practices moeten zich nog ontwikkelen.

UX ontwerp

dinsdag 26 januari 2010

OPTIONS MENUUX ontwerp

dinsdag 26 januari 2010

OPTIONS MENUUX ontwerp

dinsdag 26 januari 2010

OPTIONS MENUUX ontwerp

dinsdag 26 januari 2010

CONTEXT MENUUX ontwerp

dinsdag 26 januari 2010

CONTEXT MENUUX ontwerp

dinsdag 26 januari 2010

TERUG NAVIGATIEUX ontwerp

dinsdag 26 januari 2010

TERUG NAVIGATIEUX ontwerp

dinsdag 26 januari 2010

ZOEKEN

Android Quick Search Box Zoeken binnen een app

UX ontwerp

dinsdag 26 januari 2010

ZOEKEN

Android Quick Search Box Zoeken binnen een app

UX ontwerp

dinsdag 26 januari 2010

ZOEKEN

Android Quick Search Box Zoeken binnen een app

UX ontwerp

dinsdag 26 januari 2010

WIDGETS / LIVE FOLDERSUX ontwerp

dinsdag 26 januari 2010

WIDGETS / LIVE FOLDERSUX ontwerp

dinsdag 26 januari 2010

WIDGETS / LIVE FOLDERSUX ontwerp

dinsdag 26 januari 2010

WIDGETS / LIVE FOLDERSUX ontwerp

dinsdag 26 januari 2010

IN DE PRAKTIJKUX ontwerp

dinsdag 26 januari 2010

IN DE PRAKTIJKUX ontwerp

dinsdag 26 januari 2010

IN DE PRAKTIJKUX ontwerp

dinsdag 26 januari 2010

IN DE PRAKTIJKUX ontwerp

dinsdag 26 januari 2010

IN DE PRAKTIJKUX ontwerp

dinsdag 26 januari 2010

IN DE PRAKTIJKUX ontwerp

dinsdag 26 januari 2010

IN DE PRAKTIJKUX ontwerp

dinsdag 26 januari 2010

IN DE PRAKTIJKUX ontwerp

dinsdag 26 januari 2010

TIPSUX ontwerp

dinsdag 26 januari 2010

TIPSUX ontwerp

dinsdag 26 januari 2010

TIPSUX ontwerp

Plaats geen navigatie of contextuele acties in de header.

dinsdag 26 januari 2010

TIPSUX ontwerp

Plaats geen navigatie of contextuele acties in de header.

dinsdag 26 januari 2010

TIPSUX ontwerp

Plaats geen navigatie of contextuele acties in de header.

Gebruik het Options menu consistent, indien passend voor hoofdnavigatie.

dinsdag 26 januari 2010

TIPSUX ontwerp

Plaats geen navigatie of contextuele acties in de header.

Gebruik het Options menu consistent, indien passend voor hoofdnavigatie.

Gebruik het contextmenu, maar altijd voor acties die ook benaderbaar zijn vanuit het scherm zelf.

dinsdag 26 januari 2010

TIPSUX ontwerp

Plaats geen navigatie of contextuele acties in de header.

Gebruik het Options menu consistent, indien passend voor hoofdnavigatie.

Gebruik het contextmenu, maar altijd voor acties die ook benaderbaar zijn vanuit het scherm zelf.

‘Toast messages’ kunnen gebruikt worden voor feedback, ook tijdens het laden van een scherm.

dinsdag 26 januari 2010

RICHTLIJNEN ZIJN NODIG

“ The choice lies between getting caught up in the excitement of the fad du jour or asking ourselves the difficult question of what foundational principles am I following, or establishing, with the work that I am currently doing.”

Dakota Reese BrownBoxes and Arrows, Four Key Principles of Mobile User Experience Design

Richtlijnen

dinsdag 26 januari 2010

GEBRUIKERS

•Intieme relatie gebruiker en mobiele toestel.

•Gebruikerscontext is wisselend gedurend gebruik.

•Gebruik is kort en sporadisch: verdeelde aandacht.

•Dezelfde applicatie kan door de gebruiker op verschillende devices gebruikt worden.

• ....

Richtlijnen

dinsdag 26 januari 2010

TOESTELLEN

•Kleine schermen vragen om een compacte UI (iPhone 320x480)

•Vingers zijn groter dan een muis: geef touch targets min 1cm doorsnee.

•De hand bedenkt een deel van de interface

•Data invoeren is omslachtig: minimaliseer toetsenbord invoer, bied keuzes.

•....

Richtlijnen

dinsdag 26 januari 2010

SCHETS TEMPLATESTools

dinsdag 26 januari 2010

WIREFRAME TEMPLATESTools

dinsdag 26 januari 2010

PROTOTYPINGTools

dinsdag 26 januari 2010

UNITID ZOEKT INTERACTION DESIGNERS

matthijs@unitid.nl of rick@unitid.nl

www.unitid.nl

dinsdag 26 januari 2010

Biedt de openheid van het Android platform mogelijkheden voor het ontstaan van betere UX oplossingen?

DISCUSSIE

dinsdag 26 januari 2010

ANDROID BRONNENDesigining for iPhone, Android en Blackberryhttp://danielmckenzie.com/blog/2009/07/31-flavors-designing-for-iphone-android-and-blackberry-platforms/

Android Developers blog en user interface guidelineshttp://developer.android.com/guide/practices/ui_guidelines/index.html

Perfect Code: How to marry visual and interaction design the Android wayhttp://www.youtube.com/watch?v=wdGHySpipyA

iPhone Human Interface Guidelineshttp://developer.apple.com/iphone/index.action

AdMob metricshttp://metrics.admob.com

Tap is the New Clickhttp://www.kickerstudio.com/blog/2008/09/tap-is-the-new-click-presentation/

Designing gestural interfaces, Dan Safferhttp://www.designinggesturalinterfaces.com

dinsdag 26 januari 2010