Mobile WebApps

32
Mobile WebApps [email protected] twitter: @luebken Mittwoch, 30. März 2011

description

 

Transcript of Mobile WebApps

Page 1: Mobile WebApps

Mobile [email protected]

twitter: @luebken

Mittwoch, 30. März 2011

Page 2: Mobile WebApps

Mittwoch, 30. März 2011

Page 3: Mobile WebApps

Mittwoch, 30. März 2011

Page 4: Mobile WebApps

WebApp / HTML5 App ?

Eine App auf Basis von Webstandards wie

HTML5, CSS3 und JavaScript mit guter Integration

in das Gerät.

Mittwoch, 30. März 2011

Page 5: Mobile WebApps

Canvas

Video Drag&Drop

NewMarkup

Audio

Cache Manifest

HTML5 Spec

http://dev.w3.org/html5/spec/

Mittwoch, 30. März 2011

Page 6: Mobile WebApps

CSS3Web Workers

Web Storage

Web SQL Database

Web SocketsGeolocation

MicrodataDevice API and File API

http://www.sencha.com/blog/

Weitere Technologien

Mittwoch, 30. März 2011

Page 7: Mobile WebApps

Die “IDE”

Mittwoch, 30. März 2011

Page 8: Mobile WebApps

Was macht eine App aus?m

UI / UX

Icon

Offline

Appstore

Performance

Geo

Kamera

Mittwoch, 30. März 2011

Page 9: Mobile WebApps

UI / UX

Mittwoch, 30. März 2011

Page 10: Mobile WebApps

Mittwoch, 30. März 2011

Page 11: Mobile WebApps

CSS Animation

Mittwoch, 30. März 2011

Page 12: Mobile WebApps

• Deklarativ

• Breite Platform-Unterstützung

• Progressive-Enhancement

• Große Nachfrage

• OpenSource, MIT / GPL V2

• Auf GitHub verfügbar

Mittwoch, 30. März 2011

Page 13: Mobile WebApps

Mittwoch, 30. März 2011

Page 14: Mobile WebApps

Mittwoch, 30. März 2011

Page 15: Mobile WebApps

• Programmatisch

• Gut für Smartphone optimiert

• Nur für Smartphones

• Dual-Linzenz: GPL & Kommerziell

• Kostenlos

Touch

Mittwoch, 30. März 2011

Page 16: Mobile WebApps

iUI

WinkToolkitTouch

Frameworks

Mittwoch, 30. März 2011

Page 17: Mobile WebApps

Eigenes Icon

Mittwoch, 30. März 2011

Page 18: Mobile WebApps

Geolocation

Mittwoch, 30. März 2011

Page 19: Mobile WebApps

Offline

Cache Manifest

CACHE MANIFEST# Rev 2010-12-03

/index.html/itagile_logo.png/jqtouch/jqtouch/jqtouch.min.css/jqtouch/themes/jqt/img/toggleOn.png/jqtouch/themes/jqt/img/toolbar.png/jqtouch/themes/jqt/img/whiteButton.png

NETWORK:/api/

if the file changeseverything gets

revalidated

resources that should be cached

whitelist that shouldn’t be cached

LocalStorage

http://www.w3.org/TR/html5/offline.html http://dev.w3.org/html5/webstorage/Mittwoch, 30. März 2011

Page 20: Mobile WebApps

Appstore

& Geräte

Mittwoch, 30. März 2011

Page 21: Mobile WebApps

• Minimale native Hülle

• Entwicklung pur mit Webstandards

• OpenSource

• Akzeptiert

• Iterative Entwicklung

Mittwoch, 30. März 2011

Page 22: Mobile WebApps

Mittwoch, 30. März 2011

Page 23: Mobile WebApps

Mittwoch, 30. März 2011

Page 24: Mobile WebApps

Automatische Builds

Mittwoch, 30. März 2011

Page 25: Mobile WebApps

Performance

Mittwoch, 30. März 2011

Page 26: Mobile WebApps

Mittwoch, 30. März 2011

Page 27: Mobile WebApps

Mittwoch, 30. März 2011

Page 28: Mobile WebApps

Mittwoch, 30. März 2011

Page 29: Mobile WebApps

Progressive Enhancement?

Mittwoch, 30. März 2011

Page 30: Mobile WebApps

WebKit != WebKit

http://www.quirksmode.org/webkit.html

85% Smartphone Market Share

http://radar.oreilly.com/2010/05

Zielplattform Webkit

Mittwoch, 30. März 2011

Page 31: Mobile WebApps

lanyrd.com/scmzz

Mittwoch, 30. März 2011

Page 32: Mobile WebApps

“Agile

Developer

Skills”

-Kurs

Verlosung a

m Stand

im Wert

von 1950 €

twitter: @luebken

Mittwoch, 30. März 2011