SlideShare ist ein Scribd-Unternehmen logo
1 von 53
Downloaden Sie, um offline zu lesen
WAC
                          HTML5 Apps




                         @wolframkriesing
                             @uxebu


Mittwoch, 18. Mai 2011
We open the mobile web.



                             @wolframkriesing

Mittwoch, 18. Mai 2011
http://www.flickr.com/photos/andresrueda/2276197032/

Mittwoch, 18. Mai 2011
JavaScript                             AJAX
                                 FrontEnd
       Usability                 UserExperience

                         CSS      mobile
        Browser                             Web2.0
                          dojo
                  TouchScroll    OpenSource
Mittwoch, 18. Mai 2011
Mittwoch, 18. Mai 2011
Cross Platform        WebWorks
            Mobile Apps
                                                   anyware

            W3C Widgets        Hybrid Apps

                Mobile Web Apps                     360 Apps


                                  universal apps


                          HTML5 Apps
               Opera Widgets


Mittwoch, 18. Mai 2011
Mittwoch, 18. Mai 2011
Landscape
                         http://www.flickr.com/photos/tillwe/146242691/

Mittwoch, 18. Mai 2011
Landscape
                         http://www.flickr.com/photos/tillwe/146242691/

Mittwoch, 18. Mai 2011
Objective-C             Symbian C   Java

                         Java    .NET       ...

Mittwoch, 18. Mai 2011
€
                             €     €

                         €   €   €€€...




Mittwoch, 18. Mai 2011
HTML




Mittwoch, 18. Mai 2011
Engine of the web

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




Mittwoch, 18. Mai 2011
€




Mittwoch, 18. Mai 2011
€
                         Web Technologies




Mittwoch, 18. Mai 2011
Mittwoch, 18. Mai 2011
Mittwoch, 18. Mai 2011
Mittwoch, 18. Mai 2011
Mittwoch, 18. Mai 2011
Mittwoch, 18. Mai 2011
Mittwoch, 18. Mai 2011
Mittwoch, 18. Mai 2011
So, what is WAC?



Mittwoch, 18. Mai 2011
Wait a bit!



Mittwoch, 18. Mai 2011
First: Widgets!



Mittwoch, 18. Mai 2011
W3C Widget,
                                      Layout
                                      index.html




       HTML5 App,
                   =
        WAC App,                                   Design
           ...                      Icon           style.css




                                                           Configuration
                                    AJAX Library               config.xml




                         Database




Mittwoch, 18. Mai 2011
A Phone is ...



Mittwoch, 18. Mai 2011
http://www.flickr.com/photos/kratz/1984004945/

Mittwoch, 18. Mai 2011
http://www.flickr.com/photos/mbiddulph/3087388964/

Mittwoch, 18. Mai 2011
http://www.flickr.com/photos/redstamp/4222841946/




Mittwoch, 18. Mai 2011
•   Camera

                     •   Compass

                     •   GPS

                     •   Accelerometer

                     •   Calendar

                     •   Email

                     •   Address book

                     •   Watch

                     •   Alarm clock

                     •   ...



Mittwoch, 18. Mai 2011
Multiple Ways
                     • W3C Spec
                         http://w3.org/2009/dap/



                     • JIL Spec / WAC
                         http://www.jil.org
                         http://www.wholesaleappcommunity.com



                     • BONDI Spec
                         http://bondi.omtp.org/




Mittwoch, 18. Mai 2011
JIL 1.2.2
                         WAC 1.0


Mittwoch, 18. Mai 2011
System Info

                                                             Contacts
                Network Info


                   Phone Info                                Camera
                         File
                                                              Audio
                         GPS                        SMS, MMS, ...


                                 http://bit.ly/vf-jil-docs

Mittwoch, 18. Mai 2011
if (Widget.Device.PowerInfo.isCharging){
              alert("Battery is charging");
          }


     var player = Widget.Multimedia.AudioPlayer;
                                  i nd
                               nm
     player.open("myAudioFile.mp3");
                             i
     player.play(1);   ke ep


     if (Widget.Device.RadioInfo.isRoaming){
         alert("Money Money Money");
     }



Mittwoch, 18. Mai 2011
JIL 1.2.2
                         WAC 2.0


Mittwoch, 18. Mai 2011
72 Members




Mittwoch, 18. Mai 2011
http://public.wholesaleappcommunity.com/redmine/embedded/wac2pubrev/index.html

Mittwoch, 18. Mai 2011
Device APIs




Mittwoch, 18. Mai 2011
Accelerometer




Mittwoch, 18. Mai 2011
Camera




Mittwoch, 18. Mai 2011
FileSystem




Mittwoch, 18. Mai 2011
Contact




Mittwoch, 18. Mai 2011
WAC+HTML5!!!



Mittwoch, 18. Mai 2011
Do you see any video, audio?

                            <audio> <video>

                             HTML

Mittwoch, 18. Mai 2011
So!?



Mittwoch, 18. Mai 2011
Offline




                         http://www.flickr.com/photos/joelogon/5495742853/
Mittwoch, 18. Mai 2011
http://dev.w3.org/html5/spec/Overview.html#dom-navigator-online
       http://dev.w3.org/html5/webstorage/             http://www.w3.org/TR/IndexedDB/
Mittwoch, 18. Mai 2011
localStorage




                           isOnline




Mittwoch, 18. Mai 2011
isBattery
   isCharging
   level
   timeRemaining




                         http://www.flickr.com/photos/scalespeeder/2328220277/
Mittwoch, 18. Mai 2011
http://www.w3.org/TR/battery-status/

Mittwoch, 18. Mai 2011
So, is WAC the future?



Mittwoch, 18. Mai 2011
Thank you



                          Wolfram Kriesing

                           http://apparat.io
                          http://embedjs.org


Mittwoch, 18. Mai 2011

Weitere ähnliche Inhalte

Ähnlich wie WAC

Ähnlich wie WAC (9)

NEXT11, Puzzle pieces of our mobile web approach
NEXT11, Puzzle pieces of our mobile web approachNEXT11, Puzzle pieces of our mobile web approach
NEXT11, Puzzle pieces of our mobile web approach
 
Mobile Webapps Entwicklung
Mobile Webapps EntwicklungMobile Webapps Entwicklung
Mobile Webapps Entwicklung
 
HTML5 Update (am Internet-Briefing)
HTML5 Update (am Internet-Briefing)HTML5 Update (am Internet-Briefing)
HTML5 Update (am Internet-Briefing)
 
EmbedJS
EmbedJSEmbedJS
EmbedJS
 
HTML5 JavaScript APIs
HTML5 JavaScript APIsHTML5 JavaScript APIs
HTML5 JavaScript APIs
 
bephpug - varnish & co
bephpug - varnish & cobephpug - varnish & co
bephpug - varnish & co
 
HTML5 Update [Vortrag bei der NZZ]
HTML5 Update [Vortrag bei der NZZ]HTML5 Update [Vortrag bei der NZZ]
HTML5 Update [Vortrag bei der NZZ]
 
Mobile Webapps Motivation
Mobile Webapps MotivationMobile Webapps Motivation
Mobile Webapps Motivation
 
Bibliotheken im Spannungsfeld zwischen Nutzungsmessung und Datenschutz
Bibliotheken im Spannungsfeld zwischen Nutzungsmessung und DatenschutzBibliotheken im Spannungsfeld zwischen Nutzungsmessung und Datenschutz
Bibliotheken im Spannungsfeld zwischen Nutzungsmessung und Datenschutz
 

Mehr von wolframkriesing

JavaScript The Language Meetup - Async functions
JavaScript The Language Meetup - Async functionsJavaScript The Language Meetup - Async functions
JavaScript The Language Meetup - Async functionswolframkriesing
 
Our react-native experiences at crewmeister
Our react-native experiences at crewmeisterOur react-native experiences at crewmeister
Our react-native experiences at crewmeisterwolframkriesing
 
ES6 katas - talk given at enterjs
ES6 katas - talk given at enterjsES6 katas - talk given at enterjs
ES6 katas - talk given at enterjswolframkriesing
 
TDD for Kids - VLCjs (Valencia Spain, July 2015)
TDD for Kids - VLCjs (Valencia Spain, July 2015)TDD for Kids - VLCjs (Valencia Spain, July 2015)
TDD for Kids - VLCjs (Valencia Spain, July 2015)wolframkriesing
 
ES6Katas.org - an introduction and the story behind
ES6Katas.org - an introduction and the story behindES6Katas.org - an introduction and the story behind
ES6Katas.org - an introduction and the story behindwolframkriesing
 
TDD with Google Spreadsheets #enterjs 2015
TDD with Google Spreadsheets #enterjs 2015TDD with Google Spreadsheets #enterjs 2015
TDD with Google Spreadsheets #enterjs 2015wolframkriesing
 
TDD with Google Spreadsheets
TDD with Google SpreadsheetsTDD with Google Spreadsheets
TDD with Google Spreadsheetswolframkriesing
 
Refactoring out of the mess
Refactoring out of the messRefactoring out of the mess
Refactoring out of the messwolframkriesing
 
Day2 - Refactoring (Lecture SS 2015)
Day2 - Refactoring (Lecture SS 2015)Day2 - Refactoring (Lecture SS 2015)
Day2 - Refactoring (Lecture SS 2015)wolframkriesing
 
Day1 - TDD (Lecture SS 2015)
Day1 - TDD (Lecture SS 2015)Day1 - TDD (Lecture SS 2015)
Day1 - TDD (Lecture SS 2015)wolframkriesing
 
react.js - DOM as it was meant
react.js - DOM as it was meantreact.js - DOM as it was meant
react.js - DOM as it was meantwolframkriesing
 
Pixelplant - WebDev Meetup Salzburg
Pixelplant - WebDev Meetup SalzburgPixelplant - WebDev Meetup Salzburg
Pixelplant - WebDev Meetup Salzburgwolframkriesing
 
Presentation Mobile Monday Munich, March 2012
Presentation Mobile Monday Munich, March 2012Presentation Mobile Monday Munich, March 2012
Presentation Mobile Monday Munich, March 2012wolframkriesing
 
Webtestsuite black berrydevcon
Webtestsuite black berrydevconWebtestsuite black berrydevcon
Webtestsuite black berrydevconwolframkriesing
 
JavaScript Tools (PHPConference 2011, Berlin)
JavaScript Tools (PHPConference 2011, Berlin)JavaScript Tools (PHPConference 2011, Berlin)
JavaScript Tools (PHPConference 2011, Berlin)wolframkriesing
 
HTML5 Apps - Mobile Developer Summit Bangalore
HTML5 Apps - Mobile Developer Summit BangaloreHTML5 Apps - Mobile Developer Summit Bangalore
HTML5 Apps - Mobile Developer Summit Bangalorewolframkriesing
 

Mehr von wolframkriesing (20)

JavaScript The Language Meetup - Async functions
JavaScript The Language Meetup - Async functionsJavaScript The Language Meetup - Async functions
JavaScript The Language Meetup - Async functions
 
Our react-native experiences at crewmeister
Our react-native experiences at crewmeisterOur react-native experiences at crewmeister
Our react-native experiences at crewmeister
 
ES6 katas - talk given at enterjs
ES6 katas - talk given at enterjsES6 katas - talk given at enterjs
ES6 katas - talk given at enterjs
 
TDD for Kids - VLCjs (Valencia Spain, July 2015)
TDD for Kids - VLCjs (Valencia Spain, July 2015)TDD for Kids - VLCjs (Valencia Spain, July 2015)
TDD for Kids - VLCjs (Valencia Spain, July 2015)
 
ES6Katas.org - an introduction and the story behind
ES6Katas.org - an introduction and the story behindES6Katas.org - an introduction and the story behind
ES6Katas.org - an introduction and the story behind
 
TDD with Google Spreadsheets #enterjs 2015
TDD with Google Spreadsheets #enterjs 2015TDD with Google Spreadsheets #enterjs 2015
TDD with Google Spreadsheets #enterjs 2015
 
Baby steps
Baby stepsBaby steps
Baby steps
 
TDD with Google Spreadsheets
TDD with Google SpreadsheetsTDD with Google Spreadsheets
TDD with Google Spreadsheets
 
ECMAScript 6 for real
ECMAScript 6 for realECMAScript 6 for real
ECMAScript 6 for real
 
Refactoring out of the mess
Refactoring out of the messRefactoring out of the mess
Refactoring out of the mess
 
Day2 - Refactoring (Lecture SS 2015)
Day2 - Refactoring (Lecture SS 2015)Day2 - Refactoring (Lecture SS 2015)
Day2 - Refactoring (Lecture SS 2015)
 
Day1 - TDD (Lecture SS 2015)
Day1 - TDD (Lecture SS 2015)Day1 - TDD (Lecture SS 2015)
Day1 - TDD (Lecture SS 2015)
 
react.js - DOM as it was meant
react.js - DOM as it was meantreact.js - DOM as it was meant
react.js - DOM as it was meant
 
Pixelplant - WebDev Meetup Salzburg
Pixelplant - WebDev Meetup SalzburgPixelplant - WebDev Meetup Salzburg
Pixelplant - WebDev Meetup Salzburg
 
Better Code through TDD
Better Code through TDDBetter Code through TDD
Better Code through TDD
 
April JavaScript Tools
April JavaScript ToolsApril JavaScript Tools
April JavaScript Tools
 
Presentation Mobile Monday Munich, March 2012
Presentation Mobile Monday Munich, March 2012Presentation Mobile Monday Munich, March 2012
Presentation Mobile Monday Munich, March 2012
 
Webtestsuite black berrydevcon
Webtestsuite black berrydevconWebtestsuite black berrydevcon
Webtestsuite black berrydevcon
 
JavaScript Tools (PHPConference 2011, Berlin)
JavaScript Tools (PHPConference 2011, Berlin)JavaScript Tools (PHPConference 2011, Berlin)
JavaScript Tools (PHPConference 2011, Berlin)
 
HTML5 Apps - Mobile Developer Summit Bangalore
HTML5 Apps - Mobile Developer Summit BangaloreHTML5 Apps - Mobile Developer Summit Bangalore
HTML5 Apps - Mobile Developer Summit Bangalore
 

WAC