3 jours au Web2Day 2019 : Notre curiosité rassasiée ?

web2day 2019

Et ça y est le web2day touche Ă  sa fin. 3 jours qui sont passĂ©s comme chaque annĂ©e Ă  une grande vitesse, pour faire dans l’original Smile with tongue out
Chez DevToBeCurious, vous le savez maintenant, nous aimons autant pousser un langage pour dĂ©couvrir ses nouveautĂ©s, ou ses particularitĂ©s, nous aimons aussi dĂ©couvrir toujours plus d’outils, de langages, de frameworks.
Et cette annĂ©e encore, on a reçu de beaux cadeaux (et c’est mĂȘme pas encore noĂ«l).

 

Des précompilateurs, des frameworks

Ca fait plusieurs mois qu’on se prĂ©pare chez Dev to be curious pour dĂ©couvrir les concurrents d’Angular. Nous vous avions d’ailleurs prĂ©sentĂ© un framework bien sympa : Quasar, avec Vue.js.

 

NuxtJs, un framework pour Vue.js

Nous avons l’opportunitĂ© d’avoir une confĂ©rence faite par le crĂ©ateur de Nuxt.js : un framework utilisant Vue.js.

Son but, tout comme Quasar, c’est de dĂ©velopper des applications universelles, avec du javascript.

Et la prĂ©sentation nous a donnĂ© bien envie d’aller nous pencher plus en dĂ©tail sur ce framework, et le comparer avec Quasar.

 

Vue avec webpack et Babel

 

React native

Résultat de recherche d'images pour "react native"

Ce framework permet de faire des applications mobiles, avec du React ! Pour les fans de React, c’est sĂ»r, c’est l’idĂ©al.
Nous avons des retours d’expĂ©riences pour l’utilisation de ce moteur, dans la crĂ©ation d’applications mobiles.

 

En rĂ©sumĂ©, nous avons la crĂ©ation pour une mĂȘme application de :

– un projet android
– un projet xcode
– un projet react / js

 

Et il existe des bridges qui permettent de faire la conversion entre le code natif React Js vers le code natif de l’OS (android ou iPhone).

A priori, de ce que nous avons retenu, c’est un bon outil qui tient ses promesses à plus de 90%.

Cependant, quelques problÚmes ont été relevés durant les conférences autour de React native :

– quand problĂšme : par moment, avoir les 3 compĂ©tences react / android / ios
perfs décevantes sous android : si code mal ecrit : ça se ressent bcp sous android (react native a été fait de base pour ios ?).
De plus, le temps de chargement js s’ajoute au temps de chargement de l’appli.
(aller voir l’idĂ©e de webpack : dĂ©couper le chargement des fichiers, suivant les besoins)
api décevantes : react navigation tente de corriger les problemes
– problĂšmes de montĂ©es en version : on multiplie par 3 les prob
en plus, dépendant de babel (exemple quand on est passé à Babel 7)
– certains moments : environnement pas stable

 

Son concurrent : Flutter

VoilĂ  quelques semaines, nous nous Ă©tions fixĂ©s comme challenge d’installer Flutter. L’installation s’était avĂ©rĂ©e un peu douloureuse 
 surtout durant l’installation des extensions, et de l’installation d’Android Studio.

Dart

 

Cependant, en comparaison de React Native, une autre confĂ©rence nous a confirmĂ© que, une fois passĂ© le cap qu’on code en dart, l’expĂ©rience de dĂ©veloppement avec Flutter est beaucoup plus agrĂ©able.

Si l’on devait mettre en place match entre les deux plateformes, selon le speaker que l’on a vu, c’est bien Flutter qui gagnerait, pour ces raisons :

– c’est mieux pensĂ© pour une application de base, pour des pocs, pour une application startup

– ca va de paire : il existe dĂ©jĂ  de nombreux composants prĂ©créés pour nous

– les performances seraient meilleures que React native

– la prise en compte de tout le workflow de dĂ©veloppement se passe vraiment bien (intĂ©gration d’outils dĂ©jĂ  prĂ©vus, propre Ă  Flutter)

 

La dĂ©couverte d’un nouveau monde CSS

Chez Dev to be curious, nous adorons le web, bootstrap, le js, les frameworks javascript (Vue.js, React et Angular), le css 3, 


Et pourtant durant la conférence sur la rétrospective du CSS, nous avons pris une claque !

 

Nous avons dĂ©couvert tout un monde nouveau, qui s’oriente de plus en plus vers du DEVoCSS que tu CSS pur.

Vous connaissez sans doute LESS, SASS.

Nous avons découvert un monde web du cÎté intégration HTML/CSS extraordinaire :

post css
nanocss
design tokens
emotion

 

Des concepts, des bonnes pratiques

Améliorer les notifications de nos applications

Aujourd’hui, nous recevons tellement de notifications que cela devient une souffrance. Nous subissons ces sollicitations, et donc on fait comme si nous devions les accepter.

 

Rappelons ici une stat annoncĂ©e par le confĂ©rencier : 71% des utilisateurs dĂ©sinstallent app Ă  cause notifs. C’est Ă©norme !

 

Le conférencier nous a apporté des notions essentielles pour mieux notifier :

  1. Cherchez à n’utiliser que 16 mots : une sorte de ligne directrice
  2. Ne notifier que quand c’est essentiel et nĂ©cessaire (les infos de mise Ă  jour auto du serveur ne servent Ă  rien)
  3. Notifier par rapport Ă  un contexte (s’il pleut par exemple, ne pas me demander de sortir pour jouer Ă  un jeu type RĂ©alitĂ© augmentĂ©e)
  4. Personnaliser au plus possible les messages
  5. Regrouper par mĂȘme type de message, plutĂŽt que de polluer par info reçu du serveur
  6. Changer les styles suivant les notification
  7. Choisir le moment adĂ©quat : mercredi, samedi dimanche sont les jours Ă  priori les plus attendus (au risque de ne pas ĂȘtre lues ?)

 

Enfin, il est important de laisser une sensation de contrîle à l’utilisateur sur les notifications qu’il va recevoir :

  • pouvoir choisir quand il va les recevoir
  • dĂ©cider s’il veut ou non les recevoir
  • et surtout que l’accĂšs Ă  ce paramĂ©trage ne soit pas complexe, pas dĂ©courageant

 

Un exemple pour finir :

Lorsque nous nous inscrivons depuis une application mobile, souvent nous recevons une notification de rĂ©ception d’email pour valider notre compte.
Mieux vaut Ă©viter et temporiser 15-20 minutes plus tard ! Ainsi l’expĂ©rience de dĂ©couverte de l’application n’est pas cassĂ©e.

 

Penser micro-intéractions

Enfin, nous nous arrĂȘterons sur la notion de UX par micro-intĂ©raction. A mettre en opposition avec les macro-intĂ©ractions.

Pourquoi il est intĂ©ressant d’y penser ?

Ici, micro-intéraction rime avec composant !

 

Et dans le monde du web, tout s’oriente vers les Web Component : HTML, et les applications SPA.

C’est le POC : Programmation OrientĂ© Composant.

 

Gardons ici la notion de brique de lego.

 

5 grandes étapes permettent de créer des micro-intéractions, nous rappelle le speaker :

signal : ce qui dĂ©clenche l’intĂ©raction.
regles : elles doivent ĂȘtre comprĂ©hensibles
feedback : générer dopamine, chercher le positif
boucles et mode : revenir sur la micro interaction X fois (si on revient plusieurs fois sur la meme : on reduit la taille, on la stop ?
personnalité : chercher à construire un produit comme une personne (voice and tone) => branding cards

 

Pour les concevoir, nous pourrons utiliser :
principle for mac
framerx

 


Tellement de trÚs bonnes conférences à cette session 2019 du Web219 !

 

Nous avons beaucoup appris, beaucoup Ă©changĂ©. Une trĂšs grande hĂąte pour celui de l’annĂ©e prochaine !

A trĂšs vite !

Notre adresse

1 rue du guesclin
44000 Nantes

Notre téléphone

+33 2 79 65 52 87

Société

DevToBeCurious SARL
84860163900018 - Nantes B 848 601 639