Ontwerpen voor Android

ONTWERPEN VOOR ANDROID

dinsdag 26 januari 2010

INGE KUIJPER

Nieuwe Garde Amsterdam www.nieuwegardeamsterdam.nl

@nieuwegardeAms


http://www.nieuwegardeamsterdam.nl

http://www.nieuwegardeamsterdam.nl

INTERNET GEBRUIK OP MOBIEL - WERELD

Bron: AdMob/Google, November 2009

Intro


WAT IS ANDROID?


Google’s open source Operating System voor het mobiele platform

Intro


Gelanceerd

oktober 2008

iPhone: juni 2007

Intro


TOESTELLEN

Wereldwijd Nederland

meer dan16 7

Intro


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


VOORSPELD

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

Intro


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


TOESTELLEN IN NEDERLAND

T Mobile G1(HTC Dream)

HTC Magic HTC Hero HTC Tattoo240x320

Huawei U8220 / Pulse

Acer A1 / Liquid

Samsung Galaxy 17500

Intro



Sony Ericsson Xperia x10(480x854)

Motorola Milestone /Droid

(480x854)

Google Nexus one

(480x800px)

Intro



Sony Ericsson Xperia x10(480x854)

Motorola Milestone /Droid

(480x854)

Google Nexus one

(480x800px)Verwacht

Intro


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


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


HARDWARE

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

Klein Normaal Groot

Fragmentatie


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


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


OPTIONS MENUUX ontwerp


CONTEXT MENUUX ontwerp


TERUG NAVIGATIEUX ontwerp


ZOEKEN

Android Quick Search Box Zoeken binnen een app

UX ontwerp


WIDGETS / LIVE FOLDERSUX ontwerp


IN DE PRAKTIJKUX ontwerp


TIPSUX ontwerp


TIPSUX ontwerp

Plaats geen navigatie of contextuele acties in de header.


TIPSUX ontwerp


Gebruik het Options menu consistent, indien passend voor hoofdnavigatie.


TIPSUX ontwerp



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


TIPSUX ontwerp



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.


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


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


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


SCHETS TEMPLATESTools


WIREFRAME TEMPLATESTools


PROTOTYPINGTools


UNITID ZOEKT INTERACTION DESIGNERS

[email protected] of [email protected]

www.unitid.nl


mailto:[email protected]

mailto:[email protected]

http://www.unitid.nl

http://www.unitid.nl

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

DISCUSSIE


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


http://danielmckenzie.com/blog/2009/07/31-flavors-designing-for-iphone-android-and-blackberry-platforms/

http://danielmckenzie.com/blog/2009/07/31-flavors-designing-for-iphone-android-and-blackberry-platforms/

http://developer.android.com/guide/practices/ui_guidelines/index.html

http://developer.android.com/guide/practices/ui_guidelines/index.html

http://www.youtube.com/watch?v=wdGHySpipyA

http://www.youtube.com/watch?v=wdGHySpipyA

http://developer.apple.com/iphone/index.action

http://developer.apple.com/iphone/index.action

http://metrics.admob.com

http://metrics.admob.com

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

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

http://www.designinggesturalinterfaces.com

http://www.designinggesturalinterfaces.com

Ontwerpen voor Android

Design

Transcript of Ontwerpen voor Android