Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Mobile Apps
                           Cross Platform

                               Wolfram Kriesing
                   ...
We open the mobile web.




Donnerstag, 4. März 2010
Donnerstag, 4. März 2010
Landscape
                           http://www.flickr.com/photos/tillwe/146242691/

Donnerstag, 4. März 2010
Landscape
                           http://www.flickr.com/photos/tillwe/146242691/

Donnerstag, 4. März 2010
30th July 2009
                                  14 Stores
                           23rd September 2009
                ...
Cross Platform



Donnerstag, 4. März 2010
Objective-C           Symbian C   Java




                           Java     .NET      ...
Donnerstag, 4. März 2010
HTML




Donnerstag, 4. März 2010
Engine of the web

                           http://www.flickr.com/photos/robadob/88901885/




Donnerstag, 4. März 2010
Why HTML?


                           •lot of devs
                           •easy to write
                           •...
iPhone - First usable mobile browser




                           http://www.flickr.com/photos/chris_radcli!/2947219465/
...
71% of all phones
                           have a modern xTML web browser.




                                  http://...
App Store
                           without Apple!


Donnerstag, 4. März 2010
all the (smart)phones have browsers



                                HTML works everywhere!




                        ...
http://www.flickr.com/photos/halfbisqued/2353845688




                                                 =
                ...
What is a Widget?



Donnerstag, 4. März 2010
Donnerstag, 4. März 2010
}?
Donnerstag, 4. März 2010
Types of "Apps"
                    • Preinstalled
                    • Native App (from "some" app store)
              ...
Types of "Apps"
                    • Preinstalled
                    • Native App (from "some" app store)
              ...
Layout
                                        index.html




                                                     Design
...
Layout
                                        index.html




         W3C Widget =
                                      ...
What is a W3C Widget?

                    • HTML
                    • CSS
                    • JavaScript
             ...
DONE!           http://www.flickr.com/photos/sundazed/2704578067/


Donnerstag, 4. März 2010
On any phone?



Donnerstag, 4. März 2010
HTML
                                  tive
                              na




Donnerstag, 4. März 2010
W3C Widgets
                                            ti ve
                                          na

              ...
W3C Widgets




                                            ...yes
                               not purely

            ...
Almost for free

                    • Facebook widget
                    • Dashboard widget
                    • Websit...
A Phone is ...



Donnerstag, 4. März 2010
http://www.flickr.com/photos/kratz/1984004945/

Donnerstag, 4. März 2010
http://www.flickr.com/photos/mbiddulph/3087388964/

Donnerstag, 4. März 2010
http://www.flickr.com/photos/redstamp/4222841946/




Donnerstag, 4. März 2010
•      Camera

                    •      Compass

                    •      GPS

                    •      Acceleromete...
Multiple Ways
                    • W3C Spec
                           http://w3.org/2009/dap/



                    • J...
Runtimes
                                                                                  Nokia S60
                    •...
PhoneGap
                           "An express goal of the PhoneGap project
                                is for the pr...
http://phonegap.pbworks.com/Roadmap


Donnerstag, 4. März 2010
Some numbers

                    • iPhone App = 364 kB
                    • JavaScript, HTML, CSS, media = 124 kB
      ...
EventNinja



Donnerstag, 4. März 2010
Events,           Layout
                                        index.html


                    a Calendar

            ...
http://bit.ly/webdev-events

Donnerstag, 4. März 2010
Donnerstag, 4. März 2010
Donnerstag, 4. März 2010
Donnerstag, 4. März 2010
http://uxebu.com/blog/2010/01/25/humanapi-the-browser-in-the-real-world/

Donnerstag, 4. März 2010
thx

                             http://uxebu.com

                               Wolfram Kriesing, uxebu

              ...
Upcoming SlideShare
Loading in …5
×

Mobile-Times 2010: Cross Platform Apps

2,065 views

Published on

The base of cross platform is HTML, which exists on every phone with a browser. Slides show how W3C widgets are the center for our cross platform approach.

Published in: Technology, Design
  • Be the first to comment

Mobile-Times 2010: Cross Platform Apps

  1. 1. Mobile Apps Cross Platform Wolfram Kriesing uxebu Donnerstag, 4. März 2010
  2. 2. We open the mobile web. Donnerstag, 4. März 2010
  3. 3. Donnerstag, 4. März 2010
  4. 4. Landscape http://www.flickr.com/photos/tillwe/146242691/ Donnerstag, 4. März 2010
  5. 5. Landscape http://www.flickr.com/photos/tillwe/146242691/ Donnerstag, 4. März 2010
  6. 6. 30th July 2009 14 Stores 23rd September 2009 23 Stores 2nd December 2009 26 Stores http://bit.ly/distimo-appstores Donnerstag, 4. März 2010
  7. 7. Cross Platform Donnerstag, 4. März 2010
  8. 8. Objective-C Symbian C Java Java .NET ... Donnerstag, 4. März 2010
  9. 9. HTML Donnerstag, 4. März 2010
  10. 10. Engine of the web http://www.flickr.com/photos/robadob/88901885/ Donnerstag, 4. März 2010
  11. 11. Why HTML? •lot of devs •easy to write •common •easy to test •stable standard •widely spread Donnerstag, 4. März 2010
  12. 12. iPhone - First usable mobile browser http://www.flickr.com/photos/chris_radcli!/2947219465/ Donnerstag, 4. März 2010
  13. 13. 71% of all phones have a modern xTML web browser. http://bit.ly/tomiahonen-2010-almanac Donnerstag, 4. März 2010
  14. 14. App Store without Apple! Donnerstag, 4. März 2010
  15. 15. all the (smart)phones have browsers HTML works everywhere! low hanging fruit Donnerstag, 4. März 2010
  16. 16. http://www.flickr.com/photos/halfbisqued/2353845688 = W3C Widget, Vodafone360 App Donnerstag, 4. März 2010
  17. 17. What is a Widget? Donnerstag, 4. März 2010
  18. 18. Donnerstag, 4. März 2010
  19. 19. }? Donnerstag, 4. März 2010
  20. 20. Types of "Apps" • Preinstalled • Native App (from "some" app store) • Website limited access to phone resources • W3C Widget access by widget runtime • Wrapped W3C Widget access depends on it's runtime Donnerstag, 4. März 2010
  21. 21. Types of "Apps" • Preinstalled • Native App (from "some" app store) • Website limited access to phone resources • W3C Widget access by widget runtime • Wrapped W3C Widget access depends on it's runtime Donnerstag, 4. März 2010
  22. 22. Layout index.html Design style.css AJAX Library Database Donnerstag, 4. März 2010
  23. 23. Layout index.html W3C Widget = Design Icon style.css Configuration AJAX Library config.xml Database Donnerstag, 4. März 2010
  24. 24. What is a W3C Widget? • HTML • CSS • JavaScript • config.xml • zip it • rename to *.wgt Donnerstag, 4. März 2010
  25. 25. DONE! http://www.flickr.com/photos/sundazed/2704578067/ Donnerstag, 4. März 2010
  26. 26. On any phone? Donnerstag, 4. März 2010
  27. 27. HTML tive na Donnerstag, 4. März 2010
  28. 28. W3C Widgets ti ve na HTML tive na Donnerstag, 4. März 2010
  29. 29. W3C Widgets ...yes not purely but great HTML support Donnerstag, 4. März 2010
  30. 30. Almost for free • Facebook widget • Dashboard widget • Website widget • TV Widget • ... Donnerstag, 4. März 2010
  31. 31. A Phone is ... Donnerstag, 4. März 2010
  32. 32. http://www.flickr.com/photos/kratz/1984004945/ Donnerstag, 4. März 2010
  33. 33. http://www.flickr.com/photos/mbiddulph/3087388964/ Donnerstag, 4. März 2010
  34. 34. http://www.flickr.com/photos/redstamp/4222841946/ Donnerstag, 4. März 2010
  35. 35. • Camera • Compass • GPS • Accelerometer • Calendar • Email • Address book • Watch • Alarm clock • ... Donnerstag, 4. März 2010
  36. 36. Multiple Ways • W3C Spec http://w3.org/2009/dap/ • JIL Spec http://www.jil.org/ • BONDI Spec http://bondi.omtp.org/ Donnerstag, 4. März 2010
  37. 37. Runtimes Nokia S60 • JIL Spechttp://www.jil.org/ • BONDI Spec http://bondi.omtp.org/ iPhone • W3C Spec http://w3.org/2009/dap/ Android • PhoneGap http://phonegap.pbworks.com/ • Nokia WRT http://bit.ly/nokia-WRT-APIs Blackberry • Appcelerator http://www.codestrong.com/timobile/api/ Windows Mobile Donnerstag, 4. März 2010
  38. 38. PhoneGap "An express goal of the PhoneGap project is for the project to not exist." Open Source Donnerstag, 4. März 2010
  39. 39. http://phonegap.pbworks.com/Roadmap Donnerstag, 4. März 2010
  40. 40. Some numbers • iPhone App = 364 kB • JavaScript, HTML, CSS, media = 124 kB • that means PhoneGap+SDK foot print = 240 kB Donnerstag, 4. März 2010
  41. 41. EventNinja Donnerstag, 4. März 2010
  42. 42. Events, Layout index.html a Calendar Design Icon style.css Database Configuration AJAX Library config.xml Donnerstag, 4. März 2010
  43. 43. http://bit.ly/webdev-events Donnerstag, 4. März 2010
  44. 44. Donnerstag, 4. März 2010
  45. 45. Donnerstag, 4. März 2010
  46. 46. Donnerstag, 4. März 2010
  47. 47. http://uxebu.com/blog/2010/01/25/humanapi-the-browser-in-the-real-world/ Donnerstag, 4. März 2010
  48. 48. thx http://uxebu.com Wolfram Kriesing, uxebu wolfram@uxebu.com http://twitter.com/uxebu http://twitter.com/wolframkriesing Donnerstag, 4. März 2010

×