Slide 1: HTML5 Apps are the Future
@wolframkriesing Vodafone
Mittwoch, 6. Oktober 2010
Slide 2: One HTML5
many environments/features
+
tools :(
Mittwoch, 6. Oktober 2010
Slide 3: The Plan
• Where Are We? • Tools • Real Life Examples
Mittwoch, 6. Oktober 2010
Slide 4: The Plan
• Where Are We? • Tools • Real Life Examples
Mittwoch, 6. Oktober 2010
Slide 5: Some History
Mittwoch, 6. Oktober 2010
Slide 6: Symbian S60
Samsung H1 Samsung WRT (WebKit based) W3C Widgets, Opera, JIL GPS, Application
Android (Developer Client) JIL GPS, Audio, Acceleromter, FileSystem, etc. 2010
Opera Widgets
2009
Mittwoch, 6. Oktober 2010
Slide 7: What is a Widget?
Mittwoch, 6. Oktober 2010
Slide 8: Layout
index.html
Design
style.css
AJAX Library
Database
Mittwoch, 6. Oktober 2010
Slide 9: Layout
index.html
W3C Widget =
Icon
Design
style.css
AJAX Library
Configuration
config.xml
Database
Mittwoch, 6. Oktober 2010
Slide 10: What is a W3C Widget?
Mittwoch, 6. Oktober 2010
Slide 11: What is a W3C Widget?
Mittwoch, 6. Oktober 2010
Slide 12: What is a W3C Widget?
• HTML • CSS • JavaScript • config.xml • zip it • rename to *.wgt
Mittwoch, 6. Oktober 2010
Slide 13: It's Cross Platform Really!
Mittwoch, 6. Oktober 2010
Slide 14: Mittwoch, 6. Oktober 2010
Slide 15: The Plan
• Where Are We? • Tools • Real Life Examples
Mittwoch, 6. Oktober 2010
Slide 16: Android SDK
Mittwoch, 6. Oktober 2010
Slide 17: • install WRT inside • flexible device config • no device needed
Mittwoch, 6. Oktober 2010
Slide 18: DragonFly
Mittwoch, 6. Oktober 2010
Slide 19: catchy
Mittwoch, 6. Oktober 2010
Slide 20: Mittwoch, 6. Oktober 2010
Slide 21: function catchy(ns, fn){ return function(){ try{ ns[fn].apply(ns, arguments); }catch(e){ var err = []; for (var key in e){ if (!key || typeof key=="function") continue; err.push(key + ": " + e[key]); } alert(err.join("\n")); } } }
Mittwoch, 6. Oktober 2010
Slide 22: Mittwoch, 6. Oktober 2010
Slide 23: Opera Mobile
Mittwoch, 6. Oktober 2010
Slide 24: Mittwoch, 6. Oktober 2010
Slide 25: Desktop Tools
• Firebug DOM Inspection, etc. Debugging, • WebKit very good profiling, storage insight view Firebug like, • Opera natively Widgets • Google Chrome
Mittwoch, 6. Oktober 2010
Slide 26: Mobile Tools
• • • • • •
Mittwoch, 6. Oktober 2010
Vodafone WDK
Mac, Linux, Windows - Widget Packager, Emulator
Object Browser Android SDK DragonFly
Cross Platform Widget (even PhoneGap-built for Android)
Install Widget Runtime inside
Requires dev-build, Opera only (Symbian Runtime, Android)
Opera Mobile catchy
No widgets, but mobile
Catch errors, get more info, poor man's debugging
Slide 27: Other Tools
• JIL SDK Signing • Ripple Emulator Early version, JIL Widgets • ...
Mittwoch, 6. Oktober 2010
Slide 28: Object Browser
Mittwoch, 6. Oktober 2010
Slide 29: Mittwoch, 6. Oktober 2010
Slide 30: Mittwoch, 6. Oktober 2010
Slide 31: Mittwoch, 6. Oktober 2010
Slide 32: Mittwoch, 6. Oktober 2010
Slide 33: Open Source
• a developer must have • developer.vodafone.com • github
http://developer.vodafone.com/object-browser
http://github.com/wolframkriesing/object-browser
Mittwoch, 6. Oktober 2010
Slide 34: Demo
Object Browser, Gravitator, Icehockey
Mittwoch, 6. Oktober 2010
Slide 35: Thank you
@wolframkriesing
Mittwoch, 6. Oktober 2010
