Upload
mayflower-gmbh
View
1.867
Download
4
Embed Size (px)
DESCRIPTION
Weit mehr als die Hälfte der Erdbevölkerung hat täglichen Zugriff auf ein mobiles Gerät. Zwei Mrd. dieser Geräte besitzen einen Zugang zum Internet. Bereits heute greifen mehr Leute auf das Internet über ein mobiles Gerät zu, als mit einem Desktop-Computer. Handys sind heutzutage die meist verwendeten Geräte. Kein anderes Medium ist so persönlich und kontext-spezifisch wie das Handy. Da wundert es nicht, wenn bereits seit vielen Jahren gesagt wird, Mobile ist "The Next Big Thing".In diesem Vortrag werden Ihnen die verschiedenen Möglichkeiten aufgezeigt, Content für Mobile Geräte zur Verfügung zu stellen. Dank Webtechnologien stehen dafür sämtliche Optionen zur Verfügung. Erläutert wird der Prozess einer App-Entwicklung unter anderem am Beispiel Piwik Mobile. Der Fokus wird auf iOS und Android liegen.
Citation preview
© 2010 Mayflower GmbH
Wir freuen uns über Ihre Teilnahme!
Das Webinar startet um 14:00 Uhr(auch der Ton wird dann erst angeschaltet!)
© 2010 Mayflower GmbH
Herzlich Willkommenzum Mayflower Webinar!
02. Dezember 2010
Mayflower GmbH I 3
I Seit 2008 bei MayflowerI Senior DeveloperI Co-Developer der offiziellen
Piwik Mobile App für iOS & AndroidI Aktuelle Projekte:
• SevenGames• Sat1Spiele
Referent: Thomas Steur
Mayflower GmbH I 4
I Deutschlands führender PHP- und OpenSource Dienstleister
I mit Schwerpunkt auf Premium-Web- und Software-Entwicklung
I im agilen Umfeld
I für Mittelstand und Großkonzerne
Mayflower GmbH
Mayflower GmbH I 5
I Winterpause im Januar 2011
I 03. Februar 2011„Javasscript: Best practise debugging und logging“ von Martin Ruprecht, Developer bei Mayflower
I März 2011„ Was wir im Scrum-Team vom ProductOwner erwarten!“von Jo Brunner, Senior Developer bei Mayflower
URL: http://mayflower.de/de/ressourcen/webinare
Folgetermine
© Mayflower GmbH 2010
Mobile Anwendungsentwicklung mit Webtechnologien
Thomas Steur I 02. Dezember 2010
Mayflower GmbH I 2
Mobile ist ein riesiger Markt
Mayflower GmbH I 3
Mobile Betriebssysteme – ein Auszug
I iOS Objective-C
I Android Java/C
I BlackBerry Java
I Palm webOS HTML5 / CSS / JavaScript
I symbian C++ / Java
I Windows Phone 7 C# / VB.net
I Samsung Bada C++
Mayflower GmbH I 4
Warum Mobile Apps mit Webtechnologien?
I Web ist auf nahezu allen Geräteklassen verfügbar
I Hauptsächlich einmalige Entwicklungskosten
I Kenntnisse sind bereits vorhanden
I Schnelle Entwicklung
>> Niedrige Kosten
Mayflower GmbH I 5
Problem: Fragmentierung der Hardware
I Verschiedene Auflösungen und Ausrichtungen
I Wie viele Buttons? Anordnung der Buttons?
I Touch?
I Verfügbare Leistung von CPU/GPU?
I Wie wird das Gerät bedient?
I Sensoren?
Mayflower GmbH I 6
Problem: Cross Browser
I > 100 verschiedene Browser
I Teilweise nur HTML
I Teilweise CSS1 oder CSS2
I HTML5 & CSS3
I Nicht alle Geräte unterstützbar
u.v.m.
Mayflower GmbH I 7
Welche Geräte soll ich unterstützen?
Mayflower GmbH I 8
Mobile Internetzugriffe – Deutschland
StatCounter http://gs.statcounter.com
Mayflower GmbH I 9
Mobile Internetzugriffe – Nordamerika
StatCounter http://gs.statcounter.com
Mayflower GmbH I 10
Mobile Internetzugriffe – Weltweit
StatCounter http://gs.statcounter.com
Mayflower GmbH I 11
Was nutzen Ihre User?
Mayflower GmbH I 12
Möglichkeiten mit Webtechnologien
Mayflower GmbH I 13
Auf Desktop optimierte Webseite
I Usability suboptimal
I Langsam, aufgrund Datenmenge und Renderzeit
I Nur neuere Geräte können damitumgehen
Mayflower GmbH I 14
Auf Mobile optimierte Webseite
I Einfachere Struktur / Design
I Weniger Inhalte
I Usability ist bereits besser
I Unterstützt mehrere Geräte
Mayflower GmbH I 15
Mobile Web Apps
I Webseite mit einem Viewport
I Größere Buttons
I Gute Usability
I Nicht alle Hardware Features, aber viele
I Eher für spezifische Geräteklassen
Mayflower GmbH I 16
Wie?
Mayflower GmbH I 17
Web Applikation – erste Schritte
I HTML5 & CSS3
I Headless Browser
I Zoom ausschalten
I Eigenes Icon
I Startbildschirm
Mayflower GmbH I 18
Web Applikation – offline Verfügbarkeit
I Offline Storage (LocalStorage) für Anwenderdaten
I Manifest Cache für Applikation
I Applikation komplett offline verfügbar
I Daten synchronisieren sobald Internet verfügbar
Mayflower GmbH I 19
Web Applikation
I Geolocation
I Audio
I Video
I Touch Events
Mayflower GmbH I 20
Web Applikation – UI
I Canvas
I CSS3
I Mehr Infos zu HTML5 http://slides.html5rocks.com
http://mugtug.com/sketchpad/
Mayflower GmbH I 21
Frameworks für Web Apps
I Sencha Touch http://sencha.com/products/touch
I jQTouch http://jqtouch.com
I jQuery Mobile http://jquerymobile.com
Mayflower GmbH I 22
Native Applikationen
I Natives Look & Feel
I Sehr gute Usability
I Monetarisierung
I Schnell
I Erweiterte Funktionalitäten
I Plattformspezifisch
I Updates nicht sofort verfügbar
Mayflower GmbH I 23
Warum nicht Web und Native Applikationen vereinen?
Mayflower GmbH I 24
PhoneGap
I Web Applikation in einem nativen Container
I Apps werden erstellt mit HTML5, CSS3, JavaScript
I Eine Code Basis für viele Plattformen
I http://phonegap.com
Mayflower GmbH I 25
PhoneGap
Nicht alle Plattformen werden gleich unterstützt
http://www.phonegap.com/about
Mayflower GmbH I 26
Welche Vorteile gewinne ich, welche verliere ich dadurch?
Mayflower GmbH I 27
Titanium Mobile
I Native Apps mit Webtechnologien
I iOS & Android
I BlackBerry & Google TV ab Q1 2011
I Zweitgrößter Application Publisher im Apple Store
Mayflower GmbH I 28
Titanium Mobile
I Eine Code Basis
I JavaScript API
I Auch HTML5/CSS3 möglich
I http://appcelerator.com
Mayflower GmbH I 29
Was heißt das genau?
Mayflower GmbH I 30
Titanium Mobile – Native Look & Feel
I TableView
I Tabs
I Picker
I Form-Elemente
I Dashboard
I Gestures
Mayflower GmbH I 31
Titanium Mobile – erweiterte Funktionalitäten
I Sensoren
I Kamera (auch Aufnehmen)
I Kontakte
I iAd
I Dateisystem
I Datenbank
I Maps
Mayflower GmbH I 32
Web oder Native App?
I Es gibt nicht die EINE Antwort
I Es kommt auf die Anforderungen an
I Wenn Native: PhoneGap oder Titanium Mobile?
Empfehlung: Zuerst Web App danach Native App
Mayflower GmbH I 33
Was Sie noch wissen sollten...
Mayflower GmbH I 34
Zugriff auf Daten
I REST API + JSON
I JSON kann mit JavaScript einfach weiter verarbeitet werden
["am","be","bg","ca","cs","da","de","el","en","es"]
http://demo.piwik.org/?module=API&method=LanguagesManager.getAvailableLanguages&format=JSON
Mayflower GmbH I 35
W-Fragen (Context)
I Wer sind meine User?
I Welche Geräte werden am meisten verwendet?
I Was für ein Verhalten kann ich erwarten?
I Wo/wann wird meine App verwendet?
I Wie viel Zeit haben meine User zur Verfügung?
I Welches Bedürfnis erfüllt meine App?
I Was ist das primäre Ziel meiner User?
Mayflower GmbH I 36
Prototyping
I Papier und Bleistift
I Pencil für Firefox, Mac & Windowshttp://pencil.evolus.vn
I Balsamiq http://balsamiq.com
I Fireworks
Mayflower GmbH I 37
UI Tipps
I Es gibt nicht die richtige/falsche UI, nur: was ist richtig für Ihre User
I User wollen meistens natives Look & Feel
I UI nicht einfach von anderen Plattformen portieren
I Verwenden von einheitlichen Icons
I Ein Designer ist sein Geld wert!!!
Mayflower GmbH I 38
Links
I UI Guidelines für Mobile und Tablet Web App Design http://www.mobilexweb.com/blog/ui-guidelines-mobile-tablet-design
I Webinar HTML5 für PHP Developer http://mayflower.de/de/ressourcen/webinare/html5
Mayflower GmbH I 39
Und was können wir für Sie tun?
02.12.10 Mayflower GmbH 40
Vielen Dank für Ihre Aufmerksamkeit!
Kontakt Thomas Steur
+49 931 35965 1155
Mayflower GmbH
Pleichertorstr. 2
97070 Würzburg
© 2010 Mayflower GmbH
Folgetermine: 03. Februar 2011 / März 2011
URL: http://mayflower.de/de/ressourcen/webinare
Haben Sie noch Fragen?