Mardi 17 Novembre 2009
                                       Paris, la Défense




Google Wave et HTML5
La révolution en marche ?
  Marianne JULLIEN,
  Consultante
  Valtech Technology
  marianne.jullien@valtech.fr

  Bruno MARCHESSON,
  Consultant sénior
  Valtech Technology
  bruno.marchesson@valtech.fr
La révolution en marche…




          • Première partie : HTML5


          • Deuxième partie : Google Wave




                                            2
HTML5 - Sommaire


    • Origines et objectifs

    • Les principales nouveautés

    • Etats des lieux et perspectives




                                        3
Historique

Les grandes dates
     • 1997 : sortie de HTML4
         •   1999 : mise à jour de la spécification (il y a 10 ans … )


     • 2000 : arrivée de XHTML 1.0

     • 2004 : le Web 2.0 est né & le WhatWG est créé

     • 2007 : Reprise du travail sur HTML5 du WhatWG par le W3C

     • 2008 : Premier brouillon HTML5



                                                                         4
Présentation

HTML5 : normalisation du modèle de programmation des applications
Web 2.0 / RIA
     • Simplification du développement Web
     • Emergence d’une nouvelle génération d’application Web




     • Deux syntaxes possibles : HTML et XML
     • Auteurs principaux : Ian Hickson et David Hyatt



                                                               5
HTML5 - Sommaire


    • Origines et objectifs

    • Les principales nouveautés

    • Etats des lieux et perspectives




                                        6
Apport sémantique


                    <header>

        <nav>       <section>    <aside>



                    <header>


                    <article>


                    <footer>




                      <footer>




                                           7
Nouvelles balises

Eléments interactifs
     •   Progress : progression d’une tâche
     •   Dialog : échange entre personnes
     •   Details : zone additionnelle d’affichage à la demande
     •   Datagrids : grille de données avec opérations natives
     •   …

Enfin de vrais formulaires…




                                                                 8
Une multitude d’APIs

Javascript : un langage naturel
                                  HTML5   Javascript
     • API Drag & Drop




     • API Géolocalisation




                                                 9
Multimédia

Balises <video> et <audio>
     • Problématique des codecs




Canvas                       Source : http://htmlfive.appspot.com/static/gifter.html




                                                                            10
Des RIAs plus faciles à développer

Amélioration des performances avec les Web Workers
     • Exécution du code Javascript dans différents threads
     • Pages plus réactives

Support des Web Sockets couplés aux événements serveurs
     • A la Comet

Gestion de l’historique et du bouton back

Stockage des données hors ligne - mode offline
     • Base de données embarquée
     • Cache applicatif



                                                              11
HTML5 - Sommaire


    • Origines et objectifs

    • Les principales nouveautés

    • Etats des lieux et perspectives




                                        12
Aujourd’hui

 Pouvons nous créer actuellement une application HTML5 ?

      • Un support variable des navigateurs …




                                              Source : http://a.deveria.com/caniuse/
          • Chrome Frame pour IE
          • Emulation par Javascript


      • Les appareils mobiles

      • Possible donc mais reste difficile à maintenir pour l’instant

                                                                         13
Perspectives

Future distinction entre les RIAs « pure web » et « par plugin »

Progression des frameworks Javascript

Amélioration et mise à niveau des navigateurs




                                                                   14
Conclusion

HTML5 apparaît très prometteur

     • Nouvelles fonctionnalités, nouveaux éléments, plusieurs APIs
       intéressantes, mode offline, création d’animations facilité…

     • Emergence de nouveaux paradigmes de développements

     • Date de sortie de la spécification ?

     • Il existe déjà des exemples …




                                                                      15
La révolution en marche…




                           16
Google Wave - Sommaire


    • Présentation générale

    • L’architecture et les APIs

    • Démonstration

    • Cas d’utilisation et perspectives




                                          17
Origines

Projet Walkabout par les frères Lars et Jens Rasmussen

Annoncé au cours du Google I/0 du 28 Mai 2009
     • Actuellement en édition limitée
     • 25000 invitations en Juin 2009 puis 100000 le 30 Septembre 2009

Leur but est de repenser le modèle de communication d’après les
outils de communication actuels (emails, messageries, wikis, forums,
irc…)

            “What e-mail would be like if we invented it today ?”




                                                                    18
Qu’est-ce que Google Wave ?

Outil collaboratif
      • Combinaison de Gmail, Google Talk, Google Docs…
      • A mi-chemin entre une conversation et un document




                                                            19
Gmail aux premiers abords




                            20
Terminologie

    • Wave
       • Blip
       • Wavelet


    • Extensions
       • Robots
       • Gadgets


    • Embed wave

    • Ping




                   21
Google Wave - Sommaire


    • Présentation générale

    • L’architecture et les APIs

    • Démonstration

    • Cas d’utilisation et perspectives




                                          22
Produit
Trois couches (les 3 P)
                                      Plateforme         Protocole

Produit
     • Application web développé en GWT
     • Utilisation nouveautés HTML5

Plateforme
     • Ouverte et extensible constituée de plusieurs APIs
            •   Extensions (robots et gadgets)
            •   Embed (blogs)


Protocole
     • Stockage, Partage
     • Accès concurrents
     • Open Source


                                                                     23
Deux types d’extensions

Les robots                                Les gadgets

     • Participant à part entière              • Elément statique
     • Interaction avec la Wave                • Interaction avec les
         •   Modification ou complétion            utilisateurs
             d’un blip                         •   Fonctionne sur le client
     • Réponse à des                           •   Technologie cliente
       événements liés à la Wave
                                                    •   GWT, Flex, Python…
         •   Cron possible
     • Fonctionne sur un serveur
         •   Google App Engine




                                                                        24
Embed Wave

Intégration d’une Wave à une application web
Google Wave - Sommaire


    • Présentation générale

    • L’architecture et les APIs

    • Démonstration

    • Cas d’utilisation et perspectives




                                          26
Démonstration




                VIDEO


                        27
Google Wave - Sommaire


    • Présentation générale

    • L’architecture et les APIs

    • Démonstration

    • Cas d’utilisation et perspectives




                                          28
Premiers retours

Points forts
      •   Logiciel libre
      •   Collaboration en temps réel
      •   Documents permanents et exportables
      •   Système fédéré


Limites
      •   Interface peu intuitive
      •   Difficilement configurable
      •   Gestion des droits utilisateurs
      •   Instable
           •   mais c’est une preview limitée…




                                                 29
Quelques cas d’utilisation possibles
Travail collaboratif
      • Revue de documents
      • Prise de décision
      • Brainstorming

Fédération du SI
      • Intégration des ressources
        d’entreprise dans une wave,


Suivi temps réel
      • Traduction
      • Cours de bourse
      • …



                                       30
Conclusion

Plateforme de communication révolutionnaire

Beaucoup de potentiels
     • Déjà des concurrents (Mozilla Raindrop…)

Nouveau standard de communication ?



                       - Bon Wave ☺ -




                                                  31

Tk02 Google Wave Et Html5 Fr

  • 1.
    Mardi 17 Novembre2009 Paris, la Défense Google Wave et HTML5 La révolution en marche ? Marianne JULLIEN, Consultante Valtech Technology marianne.jullien@valtech.fr Bruno MARCHESSON, Consultant sénior Valtech Technology bruno.marchesson@valtech.fr
  • 2.
    La révolution enmarche… • Première partie : HTML5 • Deuxième partie : Google Wave 2
  • 3.
    HTML5 - Sommaire • Origines et objectifs • Les principales nouveautés • Etats des lieux et perspectives 3
  • 4.
    Historique Les grandes dates • 1997 : sortie de HTML4 • 1999 : mise à jour de la spécification (il y a 10 ans … ) • 2000 : arrivée de XHTML 1.0 • 2004 : le Web 2.0 est né & le WhatWG est créé • 2007 : Reprise du travail sur HTML5 du WhatWG par le W3C • 2008 : Premier brouillon HTML5 4
  • 5.
    Présentation HTML5 : normalisationdu modèle de programmation des applications Web 2.0 / RIA • Simplification du développement Web • Emergence d’une nouvelle génération d’application Web • Deux syntaxes possibles : HTML et XML • Auteurs principaux : Ian Hickson et David Hyatt 5
  • 6.
    HTML5 - Sommaire • Origines et objectifs • Les principales nouveautés • Etats des lieux et perspectives 6
  • 7.
    Apport sémantique <header> <nav> <section> <aside> <header> <article> <footer> <footer> 7
  • 8.
    Nouvelles balises Eléments interactifs • Progress : progression d’une tâche • Dialog : échange entre personnes • Details : zone additionnelle d’affichage à la demande • Datagrids : grille de données avec opérations natives • … Enfin de vrais formulaires… 8
  • 9.
    Une multitude d’APIs Javascript: un langage naturel HTML5 Javascript • API Drag & Drop • API Géolocalisation 9
  • 10.
    Multimédia Balises <video> et<audio> • Problématique des codecs Canvas Source : http://htmlfive.appspot.com/static/gifter.html 10
  • 11.
    Des RIAs plusfaciles à développer Amélioration des performances avec les Web Workers • Exécution du code Javascript dans différents threads • Pages plus réactives Support des Web Sockets couplés aux événements serveurs • A la Comet Gestion de l’historique et du bouton back Stockage des données hors ligne - mode offline • Base de données embarquée • Cache applicatif 11
  • 12.
    HTML5 - Sommaire • Origines et objectifs • Les principales nouveautés • Etats des lieux et perspectives 12
  • 13.
    Aujourd’hui Pouvons nouscréer actuellement une application HTML5 ? • Un support variable des navigateurs … Source : http://a.deveria.com/caniuse/ • Chrome Frame pour IE • Emulation par Javascript • Les appareils mobiles • Possible donc mais reste difficile à maintenir pour l’instant 13
  • 14.
    Perspectives Future distinction entreles RIAs « pure web » et « par plugin » Progression des frameworks Javascript Amélioration et mise à niveau des navigateurs 14
  • 15.
    Conclusion HTML5 apparaît trèsprometteur • Nouvelles fonctionnalités, nouveaux éléments, plusieurs APIs intéressantes, mode offline, création d’animations facilité… • Emergence de nouveaux paradigmes de développements • Date de sortie de la spécification ? • Il existe déjà des exemples … 15
  • 16.
    La révolution enmarche… 16
  • 17.
    Google Wave -Sommaire • Présentation générale • L’architecture et les APIs • Démonstration • Cas d’utilisation et perspectives 17
  • 18.
    Origines Projet Walkabout parles frères Lars et Jens Rasmussen Annoncé au cours du Google I/0 du 28 Mai 2009 • Actuellement en édition limitée • 25000 invitations en Juin 2009 puis 100000 le 30 Septembre 2009 Leur but est de repenser le modèle de communication d’après les outils de communication actuels (emails, messageries, wikis, forums, irc…) “What e-mail would be like if we invented it today ?” 18
  • 19.
    Qu’est-ce que GoogleWave ? Outil collaboratif • Combinaison de Gmail, Google Talk, Google Docs… • A mi-chemin entre une conversation et un document 19
  • 20.
  • 21.
    Terminologie • Wave • Blip • Wavelet • Extensions • Robots • Gadgets • Embed wave • Ping 21
  • 22.
    Google Wave -Sommaire • Présentation générale • L’architecture et les APIs • Démonstration • Cas d’utilisation et perspectives 22
  • 23.
    Produit Trois couches (les3 P) Plateforme Protocole Produit • Application web développé en GWT • Utilisation nouveautés HTML5 Plateforme • Ouverte et extensible constituée de plusieurs APIs • Extensions (robots et gadgets) • Embed (blogs) Protocole • Stockage, Partage • Accès concurrents • Open Source 23
  • 24.
    Deux types d’extensions Lesrobots Les gadgets • Participant à part entière • Elément statique • Interaction avec la Wave • Interaction avec les • Modification ou complétion utilisateurs d’un blip • Fonctionne sur le client • Réponse à des • Technologie cliente événements liés à la Wave • GWT, Flex, Python… • Cron possible • Fonctionne sur un serveur • Google App Engine 24
  • 25.
    Embed Wave Intégration d’uneWave à une application web
  • 26.
    Google Wave -Sommaire • Présentation générale • L’architecture et les APIs • Démonstration • Cas d’utilisation et perspectives 26
  • 27.
  • 28.
    Google Wave -Sommaire • Présentation générale • L’architecture et les APIs • Démonstration • Cas d’utilisation et perspectives 28
  • 29.
    Premiers retours Points forts • Logiciel libre • Collaboration en temps réel • Documents permanents et exportables • Système fédéré Limites • Interface peu intuitive • Difficilement configurable • Gestion des droits utilisateurs • Instable • mais c’est une preview limitée… 29
  • 30.
    Quelques cas d’utilisationpossibles Travail collaboratif • Revue de documents • Prise de décision • Brainstorming Fédération du SI • Intégration des ressources d’entreprise dans une wave, Suivi temps réel • Traduction • Cours de bourse • … 30
  • 31.
    Conclusion Plateforme de communicationrévolutionnaire Beaucoup de potentiels • Déjà des concurrents (Mozilla Raindrop…) Nouveau standard de communication ? - Bon Wave ☺ - 31