Categories
Full Stack Web : les dessous de l'internet 2 juin 2020

Prototypage UX design et Production WEB : retour d’experience utilisateur WordPress Elementor

Prototypage visuel : de Photoshop à WordPress, les outils d'intégration web accélèrent aujourd'hui considérablement la mise en production de pages et application labellisées responsive design. Chez nos clients, le déclic s'est produit grâce au module Elementor qui a permis de travailler en direct sur site (installation wordpress + elementor) pour tester en temps réel l'intégration de contenus multimédias (textes, images, sons et vidéos) sur une mise en page adaptative.

  • Lien base de données facilité : Elementor permet de tester facilement l'afichage mosaïque d'articles ou contenus de tous types. Le filtrage par taxonomie fait partie du menu, tout comme l'intégration "masonry" des images de format variable.
  • Nombreux exemples fournis : laversion pro d'elementor, tout comme la version standard gratuite, est livrée avec de nombreux modèles de page

Le gros inconvénient de ce système, c'est qu'il produit des pages assez lourdes, avec une couche supplémentaire de code pour faire fonctionner elementor. Un outil similaire existe pour produire du code boostrap : livecanvas.

 

Quelques éléments d'historique

1996 : je travaille à Galway dans la labos du canadien Nortel sur les premières interfaces web : application utilisateur dans le navigateur, à l'époque on travaillait sur internet explorer pour sa capacité à intégrer des éléments d'interaction avancé adaptés Visual Basic.

2001 : l'apparition non documentée de l'éditeur WYSIWYG  WEB de IE avec sa fameuse barre d'outil me permet de publier anonymement le code source de l'éditeur inspiré de WORD , alors diffusé de manière confidentielle l'antique ColdFusion. Quelques années plus tard apparaissent les premières librairies open source CK EDITOR et Tinymce, qui sera intégré dans WORDPRESS à partir de 2005

2011: apparition de Visual Composer, premier module pour wordpress d'édition de contenu par blocs de colonnes.

2016 : introduction du module gratuit ELEMENTOR qui révolutionne l'édition de blocs de colonnes sur wordpress grâce à son interface opensource, gratuite, et sa version professionnelle payante

2018 : premières version de GRAPEJS, éditeur de mise en page bootstrap indépendant de plateforme, qui aujourd'hui s'intègre dans l'interface de gestion de bases de données laravel NOVA, ouvrant la porte à de nombreuses possibilités de prototypage UX