App vs. Widget

                       HTML5 Apps
                           Wolfram Kriesing
                            ...
App vs. Widget

                       HTML5 Apps
                           Wolfram Kriesing
                            ...
We open the mobile web.




Montag, 17. Mai 2010
Montag, 17. Mai 2010
Montag, 17. Mai 2010
Montag, 17. Mai 2010
Landscape
                       http://www.flickr.com/photos/tillwe/146242691/

Montag, 17. Mai 2010
Landscape
                       http://www.flickr.com/photos/tillwe/146242691/

Montag, 17. Mai 2010
30th July 2009
                              14 Stores
                       23rd September 2009
                        ...
Cross Platform



Montag, 17. Mai 2010
Montag, 17. Mai 2010
Objective-C       Symbian C   Java




                       Java     .NET      ...
Montag, 17. Mai 2010
HTML




Montag, 17. Mai 2010
Engine of the web

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




Montag, 17. Mai 2010
iPhone - First usable mobile browser




                       http://www.flickr.com/photos/chris_radcli!/2947219465/

Mon...
http://uxebu.com/blog/2010/04/27/touchscroll-a-scrolling-layer-for-webkit-mobile/

Montag, 17. Mai 2010
Montag, 17. Mai 2010
App Store
                       without Apple!


Montag, 17. Mai 2010
What is a Widget?



Montag, 17. Mai 2010
Montag, 17. Mai 2010
}?
Montag, 17. Mai 2010
Layout
                                    index.html




                                                 Design
        ...
Layout
                                    index.html




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




Montag, 17. Mai 2010
What is a W3C Widget?




Montag, 17. Mai 2010
What is a W3C Widget?

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


Montag, 17. Mai 2010
On any phone?



Montag, 17. Mai 2010
HTML
                              tive
                          na




Montag, 17. Mai 2010
W3C Widgets
                                        ti ve
                                      na

                      ...
W3C Widgets




                                        ...yes
                           not purely

                    ...
Almost for free

                       • Facebook widget
                       • Dashboard widget
                      ...
Almost for free

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



Montag, 17. Mai 2010
http://www.flickr.com/photos/kratz/1984004945/

Montag, 17. Mai 2010
http://www.flickr.com/photos/mbiddulph/3087388964/

Montag, 17. Mai 2010
http://www.flickr.com/photos/redstamp/4222841946/




Montag, 17. Mai 2010
•   Camera

                       •   Compass

                       •   GPS

                       •   Accelerometer

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



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


Montag, 17. Mai 2010
EventNinja



Montag, 17. Mai 2010
Events,      Layout
                                      index.html


                       a Calendar

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

Montag, 17. Mai 2010
Montag, 17. Mai 2010
Montag, 17. Mai 2010
Montag, 17. Mai 2010
http://uxebu.com/blog/2010/01/25/humanapi-the-browser-in-the-real-world/

Montag, 17. Mai 2010
Want to see it in action?


                          Download it from your store.


                                  Con...
thx

                         http://uxebu.com

                           Wolfram Kriesing, uxebu

                      ...
Upcoming SlideShare
Loading in...5
×

App vs. Widget, HTML5 Apps - cross platform

12,243

Published on

Slides from the Mobile Moday Developer Day Munich about "App vs. Widget - HTML5 Apps".
We show how to get to multiple platforms with the standard web technologies HTML, JavaScript and CSS.

Published in: Technology, Design
1 Comment
9 Likes
Statistics
Notes
No Downloads
Views
Total Views
12,243
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
227
Comments
1
Likes
9
Embeds 0
No embeds

No notes for slide

App vs. Widget, HTML5 Apps - cross platform

  1. 1. App vs. Widget HTML5 Apps Wolfram Kriesing uxebu Montag, 17. Mai 2010
  2. 2. App vs. Widget HTML5 Apps Wolfram Kriesing uxebu Montag, 17. Mai 2010
  3. 3. We open the mobile web. Montag, 17. Mai 2010
  4. 4. Montag, 17. Mai 2010
  5. 5. Montag, 17. Mai 2010
  6. 6. Montag, 17. Mai 2010
  7. 7. Landscape http://www.flickr.com/photos/tillwe/146242691/ Montag, 17. Mai 2010
  8. 8. Landscape http://www.flickr.com/photos/tillwe/146242691/ Montag, 17. Mai 2010
  9. 9. 30th July 2009 14 Stores 23rd September 2009 23 Stores 2nd December 2009 26 Stores http://bit.ly/distimo-appstores Montag, 17. Mai 2010
  10. 10. Cross Platform Montag, 17. Mai 2010
  11. 11. Montag, 17. Mai 2010
  12. 12. Objective-C Symbian C Java Java .NET ... Montag, 17. Mai 2010
  13. 13. HTML Montag, 17. Mai 2010
  14. 14. Engine of the web http://www.flickr.com/photos/robadob/88901885/ Montag, 17. Mai 2010
  15. 15. iPhone - First usable mobile browser http://www.flickr.com/photos/chris_radcli!/2947219465/ Montag, 17. Mai 2010
  16. 16. http://uxebu.com/blog/2010/04/27/touchscroll-a-scrolling-layer-for-webkit-mobile/ Montag, 17. Mai 2010
  17. 17. Montag, 17. Mai 2010
  18. 18. App Store without Apple! Montag, 17. Mai 2010
  19. 19. What is a Widget? Montag, 17. Mai 2010
  20. 20. Montag, 17. Mai 2010
  21. 21. }? Montag, 17. Mai 2010
  22. 22. Layout index.html Design style.css AJAX Library Database Montag, 17. Mai 2010
  23. 23. Layout index.html W3C Widget = Design Icon style.css Configuration AJAX Library config.xml Database Montag, 17. Mai 2010
  24. 24. What is a W3C Widget? Montag, 17. Mai 2010
  25. 25. What is a W3C Widget? Montag, 17. Mai 2010
  26. 26. What is a W3C Widget? • HTML • CSS • JavaScript • config.xml • zip it • rename to *.wgt Montag, 17. Mai 2010
  27. 27. DONE! http://www.flickr.com/photos/sundazed/2704578067/ Montag, 17. Mai 2010
  28. 28. On any phone? Montag, 17. Mai 2010
  29. 29. HTML tive na Montag, 17. Mai 2010
  30. 30. W3C Widgets ti ve na HTML tive na Montag, 17. Mai 2010
  31. 31. W3C Widgets ...yes not purely but great HTML support Montag, 17. Mai 2010
  32. 32. Almost for free • Facebook widget • Dashboard widget • Website widget • TV Widget • ... Montag, 17. Mai 2010
  33. 33. Almost for free • Facebook widget • Dashboard widget • Website widget • TV Widget • ... Montag, 17. Mai 2010
  34. 34. A Phone is ... Montag, 17. Mai 2010
  35. 35. http://www.flickr.com/photos/kratz/1984004945/ Montag, 17. Mai 2010
  36. 36. http://www.flickr.com/photos/mbiddulph/3087388964/ Montag, 17. Mai 2010
  37. 37. http://www.flickr.com/photos/redstamp/4222841946/ Montag, 17. Mai 2010
  38. 38. • Camera • Compass • GPS • Accelerometer • Calendar • Email • Address book • Watch • Alarm clock • ... Montag, 17. Mai 2010
  39. 39. Multiple Ways • W3C Spec http://w3.org/2009/dap/ • JIL Spec http://www.jil.org/ • BONDI Spec http://bondi.omtp.org/ Montag, 17. Mai 2010
  40. 40. 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 Montag, 17. Mai 2010
  41. 41. PhoneGap "An express goal of the PhoneGap project is for the project to not exist." Open Source Montag, 17. Mai 2010
  42. 42. http://phonegap.pbworks.com/Roadmap Montag, 17. Mai 2010
  43. 43. EventNinja Montag, 17. Mai 2010
  44. 44. Events, Layout index.html a Calendar Design Icon style.css Database Configuration AJAX Library config.xml Montag, 17. Mai 2010
  45. 45. http://bit.ly/webdev-events Montag, 17. Mai 2010
  46. 46. Montag, 17. Mai 2010
  47. 47. Montag, 17. Mai 2010
  48. 48. Montag, 17. Mai 2010
  49. 49. http://uxebu.com/blog/2010/01/25/humanapi-the-browser-in-the-real-world/ Montag, 17. Mai 2010
  50. 50. Want to see it in action? Download it from your store. Contact us. Montag, 17. Mai 2010
  51. 51. thx http://uxebu.com Wolfram Kriesing, uxebu wolfram@uxebu.com http://twitter.com/uxebu http://twitter.com/wolframkriesing Montag, 17. Mai 2010
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×