Mon Paris Web à moi

Paris Web, 1er jour

Arrivé sur place le jeudi à 9H30, je manque malheureusement la première conférence de Daniel Glazman sur « Le tournant des CSS vers le layout ». Dommage, mais un petit répit pour retrouver tout le monde et prendre un peu la mesure de l’évènement. Le lieu tout d’abord, facile d’accès et complètement adapté à ce genre d’évènement. On y retrouve des écrans d’informations indiquant le planning de la journée, 3 salles de tailles diverses. Le hall est accueillant, on peut y faire une pause café/croissant,  observer la conférence en live, et surtout échanger, discuter confronter….

Utilisez les APIs Web d’aujourd’hui pour créer les interfaces de demain

Ma première conférence : Utilisez les APIs Web d’aujourd’hui pour créer les interfaces de demain par Luz Caballero

Elle nous présente 2 démos au travers du code. La première est une application ou l’utilisateur peut à l’aide de son téléphone, faire bouger un modèle 3D (une théière en l’occurrence). Elle nous montre donc les différents éléments de l’architecture (mobile-serveur-client). On y voit comment :

• Au niveau du téléphone, on ouvre une websocket pour envoyer au serveur les informations d’orientations
• Au niveau du serveur, on broadcast les informations à l’aide d’un serveur node.js
• Au niveau du client, on écoute les messages pour appliquer  les angles à la théière.

Elle nous montre ensuite comment faire du webGL à l’aide de threejs

• création de la scène
• mise en place des caméras
• mise en place des lumières
• chargement du modèle

La 2ème démonstration consistait en une application permettant de “naviguer” dans un décor à l’aide de mouvements du visage. Grâce à une caméra Kinect, les mouvements sont récupérés et interprétés. Le reste de la démonstration reprenait les informations concernant la gestion du modèle 3D.

Au final, cette présentation était intéressante. On lui a demandé si elle avait observé des limites sur le nombre d’utilisateurs connectés pour le broadcast et elle nous a parlé d’une autre application ou ils avaient constaté qu’au-delà de 10 personnes ça ramait.

Responsive Web Design: Clever Tricks and Techniques

J’ai ensuite assisté à la présentation :  Responsive Web Design: Clever Tricks and Techniques par Vitaly Friedman

Il s’agissait essentiellement d’un retour sur la mise en place de process de Responsive Design pour la version mobile du site http://www.smashingmagazine.com/. Vitaly nous a donc parlé :

• De PNG sprite vs SVG sprite et de l’utilisation de em pour être indépendant de la résolution.
• De Flex box
• Du conditional loading (conditional CSS)  à l’aide de pseudo élément qui indique la media queries concernée et que l’on récupère via js pour ajouter du contenu
• De RESS ou la mise en place de RD et de server side component. Il s’agit de mettre en place grâce à Mustache des templates adaptés à la résolution.
• Les responsive design Pattern: en plus des problématiques de redimensionnement il faut utiliser les capacités du mobile (géoloc, local storage…)

La présentation évoquait également les problèmes non résolus :

• les formulaires
• les images
• les performances
• le debug
• la maintenance

Et enfin on a eu un cas d’étude sur la gestion des typos.

Au final une présentation un peu décousue, mais largement compensée par les talents de l’orateur.

Creative Technologist, Web Evangelist, Developer Advocate !?!

A 12H25 me voilà à la présentation de Florian (Creative Technologist, Web Evangelist, Developer Advocate !?!). Un démarrage un peu stressé mais il s’est tout de suite immergé et tout a coulé tout seul.

Puis vint le moment de  la pause repas avec un super buffet à base de canapés, sushi, saumon, fromages, desserts. Il y avait de tout, en quantité suffisante par rapport au nombre de participants.

Applications mobiles : utiliser le web

Après 4 cafés et 5 cigarettes me voilà de retour pour : Applications mobiles : utiliser le web par Bruno Michel et Anne-Sophie Tranchet 

L’idée générale de la conférence était un retour d’expérience sur la mise en place d’une application mobile de lecture de livre électronique. Ils avaient des besoins d’offline, de performances et de sécurité par rapport au format (ePub) utilisé. Les sujets évoqués dans l’ordre :

• le choix entre web et natif
• Le cas de l’hybride (web compilé en natif)
• le déploiement (store versus web)
• Les évolutions
• Pour les développeurs
  • langage plus simple (HTML, JS, CSS)
  • cross browser
• Les tests avec le device et JSConsole

Intéressant, mais j’ai les ai trouvé très optimistes quand je vois les galères que l’on rencontre sur ce type de projets.

Scrum vu des petites tranchées

J’enchaine avec la présentation de Scrum vu des petites tranchées par Stéphane Langlois

Alors difficile et à mon avis inutile de faire un retour d’une présentation qui ne peut s’appréhender qu’en live. Saluons l’exercice et l’audace de Stéphane pour sa présentation complètement décalée. En effet au bout de 1mn30 il se dirige vers le fond de la salle où il avait installé un board géant sur lequel il fixe des “post it” correspondant en fait au déroulement de sa présentation. Dans une ambiance très agile il propose les points (ou pas) tout en répondant à nos nombreuses questions. Par forcément hyper formateur mais vraiment un bon moment.

Influence du Bauhaus dans le digital par l’exemple

Et je termine avec la présentation de Guillaume Abel (Influence du Bauhaus dans le digital par l’exemple). Il m’a vraiment bluffé car il a presque réussit à passer 60 slides en 15mn tout en faisant des jokes. Bravo !!!

Voilà, fin de la première journée et je rentre en commençant à sentir monter le stress, car demain c’est moi sur l’estrade.

Paris Web, 2eme jour

J’arrive un peu anxieux, car à 10H c’est ma présentation sur l’amélioration continue. J’avoue, je suis un peu stressé mais au final, cela se passe plutôt bien et j’ai le droit à ma séance de questions-réponses.

C’était  une très bonne expérience qui me motive pour proposer un nouveau sujet l’année prochaine.

WebGL, la 3D, c’est maintenant dans votre navigateur

J’enchaine avec la présentation WebGL, la 3D, c’est maintenant dans votre navigateur par Stéphane Verdier

C’était un état des lieux des possibilités de WebGL aujourd’hui.

Stéphane a parlé :

• de la 3D avant (DHTML, plugin Flash …)
• de maintenant avec HTML5 et les canvas
• des prérequis en terme de matériel et de navigateurs
• des étapes de mise en place (structure, lumière, caméra…)
• des outils de modélisation (maya, 3D max…)

Il nous a montré aussi des démos dans différents domaines (modélisation de voiture, jeux, science, astronomie…)

C’était une présentation sympa, forcement avec des points communs avec la celle de Luz Caballero.

Le livre numérique : et si c’était du web ?

Ensuite à 12H c’était: Le livre numérique : et si c’était du web ? par Mikael Randy

Mikael nous explique les similitudes entre le livre numérique et le web avec :

• la convergence des supports (tablettes, navigateurs)
• la convergence des outils (HTML, CSS et JS)
• la complémentarité ou quand le livre pousse l’utilisateur vers le site

Mais malgré ces caractéristiques communes, Mikael parle aussi du format propre (l’ePub) avec

• des métadonnées spécifiques (note de bas de page)
• un mode déconnecté indispensable
• un matériel spécifique
• la version 3 de l’ePub adapté à la BD

La deuxième partie de la présentation était plus axée sur les avantages du livre numérique avec :

• l’interactivité: on a vu comment le livre numérique permettait de repenser le contenu (animation, sous histoires)
• l’accessibilité
• la « nomadité » (ça ne se dit pas tellement ça)
• la taille compacte

Bon j’avoue, à cette présentation j’ai un peu trollé en me posant comme farouche défenseur du format papier et en évoquant “un conflit de génération”.

Mais au final, je suis quand même curieux de tester le format et j’envisage donc l’achat d’une de ces liseuses…..

Et c’est avec le sourire que Mikael m’a offert le livre papier de la session…

1 + 1 = 3, le « pair programming » appliqué au web

A 12H25 c’était : 1 + 1 = 3, le « pair programming » appliqué au web par Stéphane Angel et Mathieu Pillard

Un bon retour d’expérience sur la mise en place du pair programming avec :

• le principe

• les bénéfices (productivité, motivation; qualité….)
• La mise en place
• Les difficultés (fatigue, relations humaines…)
• L’évangélisation

Très bien, surtout sur un sujet que j’affectionne particulièrement. Par contre la taille réduite de leur équipe (2 personnes) ne permet pas vraiment de se projeter sur des projets d’envergures. Je leur ai demandé s’ils pensaient qu’un binôme senior/junior pouvait être un frein au bon fonctionnement et ils m’ont répondus que non. À leur sens si le senior prend sur lui de ne pas trop “materner” le junior, c’est au contraire très formateur.

Application cache

A 14H, j’assiste à  la présentation: Application cache par Jake Archibald

Il s’agissait d’une présentation assez technique sur l’utilisation de l’application cache.

La présentation était argumentée de schéma logique de chargement pour expliquer le comportement du navigateur. Impossible de le retranscrire ici (et j’avoue que j’ai été perdu par moment…). Je vous livre donc en vrac les points que j’ai retenu :

• La mise en place du cache:
  • la définition manifest dans la page html
  • le fait que cette page soit automatiquement cachée
  • le support dans les navigateurs (message de confirmation pour Firefox)
• les problèmes de rafraichissements :
  • si une mise en cache échoue toute la mise en cache échoue
  • la mise en place de commentaires dans le cache manifest pour reloader les ressources (et non des changements de nom de fichier)
  • la nécessité de 2 refresh pour avoir la nouvelle ressource
• La gestion en js avec des listeners et une api pour swaper le cache
• Le contenu du cache manifest
• la gestion des ressources à cacher ou pas avec la section NETWORK
• l’utilisation de FALLBACK pour afficher certaines pages…
• Le conditionnal js où l’on détecte la feature pour charger du JavaScript seulement dans le cas où le cache est présent

Bref une présentation assez pointue, convaincante sur la difficulté à mettre en place l’application cache. Et chapeau pour la cinématique, c’était très fluide. J’aurais quand même dû prendre les écouteurs pour la traduction…

J’avoue que j’ai ensuite pas mal séché les présentations suivantes car je me suis lancé dans une discussion avec Stéphane Langlois sur la mise en place de Scrum dans des équipes novices.

Fast Mobile UIs

Je retrouve donc le banc de l’amphi pour la dernière présentation avec Fast Mobile UIs par Horia Dragomir

Il s’agissait de différentes astuces pour optimiser les webapp mobiles en travaillant sur :

• La rapidité de chargement
  • Il faut adapter le contenu par rapport à la bande passante
  • Il faut minimiser le nombre et le poids des requêtes http
• La rapidité d’exécution
  • Il faut préconiser l’utilisation de JavaScript natif et pas de frameworks

  • Il faut favoriser l’utilisation de la propagation des événements avec un event listener

  • Il faut effectuer au maximum les animations en CSS
• La réactivité de l’interface
  • Les problématiques de click : onclick versus les touch events (utilisation de hammer.js)
  • Des règles CSS à mettre en place: pointer-events:none; user-select:none; user-drag:none;

Une bonne présentation avec pas mal de tips.

Lightning talks

Et enfin les séances des Lightning talks animés par Robin Berjon et Daniel Glazman

Alors le principe:

une dizaine d’orateurs qui ont chacun 4mn pour nous présenter ….  quelque chose. Alors on a eu :

• une parodie de la lettre de Renan Luce sur le thème du projet interprété en live à la guitare (chapeau)

• 4 minutes accessibles, par Sébastien Delorme : un dialogue avec un lecteur d’écran
• Plus de code, moins de licence, par Thomas Zilliox
• comment rendre un mini évènement accessible avec les moyens du bord (qui a d’ailleurs gagné la session) …

Je ne vais pas refaire la liste mais c’était vraiment un moment très sympa avec du rire de l’émotion, bref très loin de l’image geek de ce type de conférence.

Au final j’ai passé deux très bonnes journées et je repars avec des goodies et une superbe bouteille de champagne. Je regrette juste un peu l’absence de présentations plus techniques mais je pense que c’était plus le thème des ateliers. C’était mon premier Paris Web mais surement pas mon dernier…