72
iks Thementag „Mobile Applikationen – Es lebe die Vielfalt?!“ 20.11.2012 Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung Autor: Jan Laußmann

Mobile Applikationen: Cross-Plattform-Entwicklung

Embed Size (px)

DESCRIPTION

Mobile Applikationen für Smartphones und Tablets sind aus der Geschäftswelt nicht mehr wegzudenken: Mitarbeiter und Geschäftspartner können mobil in Unternehmensprozesse eingebunden werden, Kunden mit mobilen Applikationen auf Daten und Dienstleistungen zugreifen. Oder Neukunden werden durch mobile Applikationen erst auf das Unternehmen aufmerksam.

Citation preview

Page 1: Mobile Applikationen: Cross-Plattform-Entwicklung

iks Thementag

„Mobile Applikationen – Es lebe die Vielfalt?!“

20.11.2012

Möglichkeiten, Vorteile und Grenzen der

Cross-Plattform-Entwicklung

Autor:

Jan Laußmann

Page 2: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 3 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Agenda

Warum Cross-Plattform entwickeln?

Hybrid Apps in der freien Wildbahn

Aufwand für die Entwicklung von Hybrid Apps

Die 3 größten Probleme bei der Hybrid App Entwicklung lösen

Hybrid Apps und der Apple Store - gibt es Probleme?

Grenzen der Hybrid App Entwicklung

Entscheidung treffen: Native App oder Hybrid App?

Page 3: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 4 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Agenda

Warum Cross-Plattform entwickeln?

Hybrid Apps in der freien Wildbahn

Aufwand für die Entwicklung von Hybrid Apps

Die 3 größten Probleme bei der Hybrid App Entwicklung lösen

Hybrid Apps und der Apple Store - gibt es Probleme?

Grenzen der Hybrid App Entwicklung

Entscheidung treffen: Native App oder Hybrid App?

Page 4: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 5 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

So wird App Entwicklung oft dargestellt

Page 5: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 6 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Aber das ist falsch!

Page 6: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 7 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Die Entwicklung macht den Löwenanteil aus

Page 7: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 8 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Und bei mehreren Plattformen…

Page 8: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 9 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Probleme der nativen App Entwicklung

Die App muss X mal komplett neu programmiert werden

– X mal Entwicklungskosten

– X mal Wartungskosten (Bugfixes)

Multiple Ansprechpartner

– Abstimmungsaufwand

– Einarbeitung z.B. in Backendkommunikation

Die Apps unterscheiden sich

– Qualität

– Benutzerführung

– Features

– …

Page 9: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 10 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Das bietet Cross-Plattform-Entwicklung

Page 10: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 11 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Native Apps

Cross-Plattform: nein

– Java (Android)

– Objective-C (iOS)

Performance: schnell

Sichtbarkeit im App Store: ja

Platz auf dem Startbildschirm: ja

Page 11: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 12 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Native Apps

Offline Funktionalität: ja

Daten lokal speichern: ja

Zugriff auf Gerätesensoren: ja

– Kamera

– Geolocation

– …

Kommunikation mit anderen Anwendungen: ja

– Adressbuch

– Kalender

– …

Page 12: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 13 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Web Apps

Cross-Plattform: ja

– HTML 5

– CSS 3

– JavaScript

Performance: mittel

Sichtbarkeit im App Store: nein

Platz auf dem Startbildschirm: ja, aber …

Page 13: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 14 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Web Apps auf dem Startbildschirm

Page 14: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 15 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Web Apps auf dem Startbildschirm

Page 15: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 16 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Web Apps auf dem Startbildschirm

Page 16: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 17 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Web Apps auf dem Startbildschirm

Page 17: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 18 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Web Apps auf dem Startbildschirm

Page 18: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 19 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Web Apps auf dem Startbildschirm

Page 19: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 20 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Web Apps auf dem Startbildschirm

Page 20: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 21 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Web Apps

Offline Funktionalität: ja (HTML5 Application Cache), aber ...

Daten lokal speichern: ja via HTML5 Browser Datenbank

(Indexed DB, Web Storage oder Web SQL)

Zugriff auf Gerätesensoren: nein, bis auf Geolocation

Kommunikation mit anderen Anwendungen: nein

Page 21: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 22 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Überblick Native App vs. Web App

Native App Web App

Cross-Plattform nein ja

Performance schnell mittel

App Store ja nein

Startbildschirm ja ja, aber

Offline ja jein

Datenbank ja ja

Sensoren ja jein

Adressbuch etc. ja nein

Page 22: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 23 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Hybrid Apps

Hybrid Apps vereinen das Beste aus beiden Welten:

Cross-Plattform

Alle Smartphone Features nutzen

Page 23: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 24 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Hybrid Apps

Hybrid Apps bestehen aus:

Web App

– Cross-Plattform

Nativen Container (Verpackung) für Web App

– Alle Smartphone Features nutzen

Page 24: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 25 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Nativer Container

Den nativen Container kann man sich

als Spezial-Browser vorstellen

Keine URL Leiste oder ähnliches

Sondern nur der Teil des Browsers

der die Web App anzeigt

Page 25: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 26 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Nativer Container: PhoneGap

Adobe

Open Source

Gut dokumentiert

Große Community

Android, iOS, Black Berry, Windows Phone

Page 26: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 27 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

PhoneGap API

„Brücke“ (API) zwischen Web App und nativen Funktionen

APIs für die viele Smartphone Features wird direkt mitgeliefert

– Adressbuch

– Barcode Scanner

– Beschleunigungssensor

– U.v.m.

Kann mit eigenen APIs beliebig erweitert werden

Page 27: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 28 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Alternativen zu PhoneGap

Appcelerator / Titanium

– JavaScript

– Native Apps

Mono Touch / Mono for Android

– C#

– View nicht Cross-Plattform

Page 28: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 29 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Überblick: Native App vs. Hybrid App vs. Web App

Native App Hybrid App Web App

Cross-Plattform nein ja ja

Performance schnell mittel mittel

App Store ja ja nein

Startbildschirm ja ja ja, aber

Offline ja ja jein

Datenbank ja ja ja

Sensoren ja ja jein

Adressbuch etc. ja ja nein

Page 29: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 30 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Agenda

Warum Cross-Plattform entwickeln?

Hybrid Apps in der freien Wildbahn

Aufwand für die Entwicklung von Hybrid Apps

Die 3 größten Probleme bei der Hybrid App Entwicklung lösen

Hybrid Apps und der Apple Store - gibt es Probleme?

Grenzen der Hybrid App Entwicklung

Entscheidung treffen: Native App oder Hybrid App?

Page 30: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 31 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Wikipedia (PhoneGap)

Page 31: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 32 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Wikipedia

Mit PhoneGap entwickelt

Android

https://play.google.com/store/apps/details?id=org.wikipedia

iOS

https://itunes.apple.com/us/app/wikipedia-mobile/id324715238

BlackBerry

http://appworld.blackberry.com/webstore/content/105171/

Page 32: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 33 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

BBC Olympics (PhoneGap)

Page 33: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 34 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

BBC Olympics

Mit PhoneGap entwickelt

Android

https://play.google.com/store/apps/details?id=uk.co.bbc.sos2012uk

iOS

https://itunes.apple.com/gb/app/bbc-olympics/id538520463

BlackBerry

http://appworld.blackberry.com/webstore/content/119787/

Page 34: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 35 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

http://phonegap.com/app/

Page 35: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 36 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

LinkedIn (eigene Entwicklung)

Page 36: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 37 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

LinkedIn

Keine PhoneGap App, aber Hybrid

Android

https://play.google.com/store/apps/details?id=com.linkedin.android

iOS

https://itunes.apple.com/de/app/linkedin/id288429040

Page 37: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 38 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Agenda

Warum Cross-Plattform entwickeln?

Hybrid Apps in der freien Wildbahn

Aufwand für die Entwicklung von Hybrid Apps

Die 3 größten Probleme bei der Hybrid App Entwicklung lösen

Hybrid Apps und der Apple Store - gibt es Probleme?

Grenzen der Hybrid App Entwicklung

Entscheidung treffen: Native App oder Hybrid App?

Page 38: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 39 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Wo bietet Cross-Plattform-Entwicklung Vorteile?

Hier kann man sparen

– App Entwicklung

– Wartung / Bugfixes

– Neue Features / Updates

Immer dort wo programmiert wird

Das ist von der Entwicklungsmethode unabhängig

– Planung

– Tests

– Rollout

Immer dort wo nicht programmiert wird

Page 39: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 40 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Höherer Aufwand als Nativ bei:

Interface Gestaltung

– Android und iOS nehmen hier dem Entwickler viel Arbeit ab

– Mobile CSS Frameworks stecken noch in den Kinderschuhen

Deshalb ist es aufwändiger gute User Interfaces mit HTML/

CSS zu gestalten als mit Android oder iOS

Performance Tuning

– Bei nativer Entwicklung vernachlässigbar

– Bei Cross-Plattform-Entwicklung dringend notwendig!

Page 40: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 41 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Grobe Schätzung - Daumenregel

X = Aufwand 1 Native App

– Läuft auf 1ner Plattform

X * 1.5 = Aufwand Hybrid App

– Läuft auf allen Plattformen

Page 41: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 42 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Beispiel 1 für Daumenregel (Aufwand Entwicklung)

Native App für Android und iOS

– 1 * Aufwand X für Android

– 1 * Aufwand X für iOS

– Gesamtaufwand = 2X

Dieselbe App als Hybrid App

– 1 * 1.5-facher Aufwand

– Läuft auf Android und iOS

– Gesamtaufwand: 1.5X

Sparpotenzial: 25%

– Oder andersherum: nativ ist 33% teurer

Page 42: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 43 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Beispiel 2 für Daumenregel (Aufwand Entwicklung)

Native App für Android und iOS und Facebook App

– 1 * Aufwand X für Android

– 1 * Aufwand X für iOS

– 1 * Aufwand X für Facebook App

– Gesamtaufwand = 3X

Dieselbe App als Hybrid App

– 1 * 1.5-facher Aufwand

– Läuft auf Android, iOS und als Facebook App

– Gesamtaufwand: 1.5X

Sparpotenzial: 50%

– Oder andersherum: nativ ist 100% teurer

Page 43: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 44 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Benötigte Entwickler-Skills

Für die Web App

– JavaScript

– HTML

– CSS

Für den nativen Container

– Cross-Plattform Frameworks (z.B. PhoneGap)

– Java (Android)

– Objective-C (iOS)

Page 44: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 45 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Code Metriken

Beispiel Servicepoint App

Cross-Plattform Code: ~95%

Nativer Code: ~5%

Page 45: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 46 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Entwicklungs-Plattformen für Hybrid App

iOS

– Mac mit OS X und Xcode

Windows Phone

– PC mit Windows und Visual Studio

Android

– Entwicklung überall möglich

Alternative: PhoneGap Cloud Build

Page 46: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 47 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Agenda

Warum Cross-Plattform entwickeln?

Hybrid Apps in der freien Wildbahn

Aufwand für die Entwicklung von Hybrid Apps

Die 3 größten Probleme bei der Hybrid App Entwicklung lösen

Hybrid Apps und der Apple Store - gibt es Probleme?

Grenzen der Hybrid App Entwicklung

Entscheidung treffen: Native App oder Hybrid App?

Page 47: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 48 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Problem 1: feststehender Header / Footer

Page 48: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 49 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Problem 1: feststehender Header / Footer

CSS Support für feststehende Elemente ist auf alten Geräten

nicht vorhanden

Mit JavaScript permanente Elemente neu zu positionieren führt

zu flackern der Elemente und trägen Anwendungen

Diverse Bugs bei CSS / JavaScript Lösungen

– Fixierte Elemente scrollen doch mit

– Fixierte Elemente verschwinden

– Eingabefelder schieben sich über fixierte Elemente

– Tabben in Eingabefeldern funktioniert nicht richtig

Page 49: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 50 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Lösung: native Header / Footer

Nativen Header / Footer mit Cross-Plattform App kombinieren

– Nativer Header / Footer ist fixiert

– Gesamte Cross-Plattform App scrolled dazwischen

Zwar nur 95% Cross-Plattform

Aber man bekommt dafür natives Look & Feel geschenkt

– Sieht wie eine native App aus

– Das Scrollen fühlt sich nativ an

Page 50: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 51 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Cross-Plattform App mit nativem Header

Page 51: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 52 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Native Look & Feel

DHL Servicepoint

Hybrid

Google Books

Nativ

Google Drive

Nativ

Page 52: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 53 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Einschub vor Problem 2: Single Tap

Page 53: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 54 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Einschub vor Problem 2: Double Tap

Page 54: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 55 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Problem 2: Klickverzögerung

Wenn in einem mobilen Browser getapped wird, wartet

der Browser ca. 400ms ob ein zweiter Tap folgt (Double Tap)

Wenn ein zweiter Tap folgt zoomed der Browser auf diese Stelle

Wenn kein zweiter Tap folgt feuert der Browser ein Click Event

Die App fühlt sich ungewohnt träge an

Page 55: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 56 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Lösung: Den ersten Tap direkt als Click interpretieren

Auch Hybrid Apps sollen sich..

– …nicht wie mobile Websites anfühlen (was sie technisch sind),

– …sondern wie native Apps

Also: Direkt der erste Tap muss als Klick interpretiert werden

– Ohne Wartezeit

Das gibt PhoneGap nicht direkt her

Doch es gibt passende JavaScript Libraries

– z.B. Google Fast-Button

https://github.com/alexblack/google-fastbutton

Page 56: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 57 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Problem 3: Animationen

Bei der klassischen Webentwicklung werden Animationen

mit JavaScript realisiert

Smartphones sind aber leistungsschwächer als Desktop PCs

Animationen sehen ruckelig aus

Page 57: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 58 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Problem 3: Animationen

Animationen sind nicht nur für Spiele wichtig

Animationen bei Business Anwendungen:

– Seitenwechsel

– Tooltips einblenden

– …

Auf Animationen kann man nicht einfach verzichten

Page 58: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 59 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Lösung: CSS3

CSS3 Animationen sind hardwarebeschleunigt

Smartphones / Computer

– Hauptprozessor (CPU)

– Grafikkarte (GPU)

JavaScript Animationen: allgemeiner Hauptprozessor

CSS3 Animationen: spezialisierte Grafikkarte

Bringt 2-3 fache Beschleunigung

Page 59: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 60 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Agenda

Warum Cross-Plattform entwickeln?

Hybrid Apps in der freien Wildbahn

Aufwand für die Entwicklung von Hybrid Apps

Die 3 größten Probleme bei der Hybrid App Entwicklung lösen

Hybrid Apps und der Apple Store - gibt es Probleme?

Grenzen der Hybrid App Entwicklung

Entscheidung treffen: Native App oder Hybrid App?

Page 60: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 61 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Hybrid Apps und der Apple Store

PhoneGap:

„Apple hat eine technische Überprüfung durchgeführt und PhoneGap

Apps verstoßen nicht gegen die AGB des Apple Stores“

Aber Hybrid Apps wurde schon die Freigabe im Apple Store

verweigert!

Wie passt das zusammen?

Page 61: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 62 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Gründe für Ablehnung

Human Interface Guidelines: Reconsider Web-Based Designs:

– Focus your app

– Design for touch

– Let people scroll

Apple’s App Store Review Guidelines

– Apps that are […] simply web sites bundled as Apps [...] may be

rejected.

– Apps that are simply web clippings, content aggregators, or a

collection of links, may be rejected.

Page 62: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 63 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Hybrid Apps und der Apple Store - Fazit

Hybrid Apps dürfen in den Apple Store

Für Hybrid Apps gelten dieselben Bedingungen wie

für native Apps

Man darf es sich nicht zu einfach machen!

Page 63: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 64 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Agenda

Warum Cross-Plattform entwickeln?

Hybrid Apps in der freien Wildbahn

Aufwand für die Entwicklung von Hybrid Apps

Die 3 größten Probleme bei der Hybrid App Entwicklung lösen

Hybrid Apps und der Apple Store - gibt es Probleme?

Grenzen der Hybrid App Entwicklung

Entscheidung treffen: Native App oder Hybrid App?

Page 64: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 65 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Grenzen der Cross-Plattform-Entwicklung

Das größte Problem ist die Performance

Auf guten Smartphones sind Hybrid Apps kaum von nativen

Apps zu unterscheiden

Aber auf alten, leistungsschwachen Geräten sind Hybrid Apps

relativ langsam

In der Regel alle 2 Jahre ein neues Smartphone

Page 65: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 66 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Grenzen der Cross-Plattform-Entwicklung

Native Look & Feel

Beispiel Checkboxen

– Android

– iOS

Für Cross-Plattform muss ein Kompromiss gefunden werden

Page 66: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 67 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Facebook – das Ende von HTML5?

Erst native App

Dann bis ca. August 2012 Hybrid App

Seit dem wieder zurück auf native App

Mark Zuckerberg:

“I think the biggest mistake that we made, as a company, is betting too

much on HTML5 as opposed to native”

Page 67: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 68 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Grenzen der Cross-Plattform-Entwicklung

Facebooks Hauptproblem: eine riesige Datenmenge

In Kombination mit:

– 1. Debugging

“The lack of tooling in mobile browsers makes it very difficult to

dig down and find out what the real issues are.”

– 2. Scrolling performance

“This is one of our most important issues. It's typically a problem on

the newsfeed and on Timeline which use infinite scrolling”

Für sehr große Datenmengen sind native Apps besser geeignet

Page 68: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 69 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Agenda

Warum Cross-Plattform entwickeln?

Hybrid Apps in der freien Wildbahn

Aufwand für die Entwicklung von Hybrid Apps

Die 3 größten Probleme bei der Hybrid App Entwicklung lösen

Hybrid Apps und der Apple Store - gibt es Probleme?

Grenzen der Hybrid App Entwicklung

Entscheidung treffen: Native App oder Hybrid App?

Page 69: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 70 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Entscheidung treffen: Native App oder Hybrid App?

Hybrid Apps

– Wirtschaftlich sinnvoll

– Technisch machbar

Wird deshalb in Zukunft im Focus liegen

Ausnahmen

– Nur eine Plattform

– Aufwändigere Animationen (Spiele)

– Kein Kompromiss bei native Look & Feel möglich

– Sehr große Datenmengen (Facebook)

Page 70: Mobile Applikationen: Cross-Plattform-Entwicklung

Seite 71 / 73 iks Thementag: Mobile Applikationen - Möglichkeiten, Vorteile und Grenzen der Cross-Plattform-Entwicklung

Weiterführende Literatur

PhoneGap

http://w ww.phonegap.com

Page 71: Mobile Applikationen: Cross-Plattform-Entwicklung

Fragen?

Page 72: Mobile Applikationen: Cross-Plattform-Entwicklung

www.iks-gmbh.com