Von iOS zu AndroidDer Weg eines App-Designs

Tim Roes | inovex GmbH

Über mich

Tim Roes

inovex GmbH | Mobile Development

www.timroes.de

Über diesen Vortrag

What NOT to do

What to do

How to do it

What NOT to do

What to do

Schritt 1: Design Styleguides lesen

https://developer.apple.com/library/ios/design

https://developer.android.com/design

Schritt 2: Zielplattform benutzen

Wahlweise Schritt 1 und 2 vertauschen

Schritt 3: Bookmarks aufräumen

Phonegap

Cordova

$CrossPlatformFramework

Schritt 4: Portieren, nicht kopieren

How to do it

Beispielanwendung: Day One

Quelle: https://itunes.apple.com/us/app/day-one-journal-diary/id421706526

Struktur analysieren

Theme

Branding

Akzentfarben

Logo in ActionBar

Navigation Drawer

Hauptnavigation

Erst bei mehreren Elementen

Navigationselemente,

keine Aktionen

Collapse/Expand

Counters

Navigation: Spinner

Alternative Ansicht

auf dieselben Daten

Ggf. gefilterte Daten

Navigation: Tabs

Bei wenigen

Navigationspunkten

Oft auch für

alternativer Ansicht

Aktionen

Action Buttons

Kontextbezogen

i

Overflow

Bei zu wenig Platz

Selten genutzte Aktionen

Einstellungen

Hilfe

Icons

Standard Icons nutzen, wenn möglich

Listen: GridView

Gut geeignet

für Vorschaubilder

Skalierbar

Listen: ListView

Keine Listcarets

Suche

Aktionen II

Split Action Bar

Nicht verwechseln mit

iOS Bottom Tabs

Swipen zum Wechseln

Up vs. Back Navigation

Zeitlich vs. hierarchisch

eigentlich …

Außerdem…

Umsetzungsdetails

Verschiedene Screendensities (mdpi, hdpi, xhdpi, …)

Android Asset Studio

Responsive Design

Design Candies

Notifications, Widgets

und vieles mehr …

Wichtige Ressourcen

Google+

+NickButcher, +RomanNurik, +AdamKoch (Google)

+JuhaniLehtimäki, +TaylorLing

YouTube: Android Design in Action

www.androiduipatterns.com