10 ans d’évolution des interfaces web au service de l’expérience utilisateur

2007 sera une grande année pour les interfaces riches (voir à ce sujet mon précédent billet). Pour célébrer cette révolution à venir, je vous propose de faire une rétrospective sur dix années d’évolution des interfaces web, en incluant un peu de prospective sur l’année à venir.

J’ai résumé tout cela dans ce schéma :

ria-rda-widget.jpg

La page HTML : simple et efficace

La manière la plus simple de réaliser une interface web est d’utiliser HTML. Pour consulter une page web, il faut : un système d’exploitation et un navigateur. C’est simple et efficace, suffisamment efficace pour faire fortune (à l’image d’eBay ou d’Amezon).

L’applet : un peu plus de puissance mais au détriment du confort d’usage

Durant la fin des années 90, sont apparus des micro-applications qui pouvaient être exécutées au sein d’une page web : les applets réalisées en Java. Pour pouvoir les exécuter, il fallait bien évidemment un système d’exploitation, un navigateur, mais également une machine virtuelle. C’est cette dernière qui servait à interpréter le code Java (qui n’a rien à voir avec Javascript).

Les applets permettent de faire plus de chose que le HTML mais au détriment du confort d’usage, car les applets sont lourdes et longues à démarrer (de 1 à 3 secondes) et que la machine virtuelle nécessite souvent des mises à jour intempestives. Quand il s’agit du configurateur en 3D de Volkswagen, ça va, mais quand il s’agit d’un simple calendrier pour choisir une date comme sur le site de la banque Fortis, c’est inadmissible.

Les RIA : le meilleur compromis à ce jour

Puis sont apparues les Rich Internet Applications qui proposaient de bien plus grandes possibilités d’affichage et de manipulation que le HTML. Ces interfaces riches pouvaient être réalisées en AJAX (à l’image du sélecteur de diamant d’Amazon ou du site de GAP) ou en exploitant des technologies vectorielles comme Flash ou WPF/E. Pour les faire tourner, vous devez posséder le bon plug-in (ce qui est le cas de 99% des ordinateurs pour Flash). L’intégration des animations au sein d’une page web est transparente et très performante (à l’image du très bon comparateur de Ford Vehicles).

Les widgets : petites mais terriblement efficaces

Plus récemment, des petits modules autonomes sont venus s’installer sur notre bureau : les widgets. Ces micro-applications nécessitent plusieurs choses pour pouvoir tourner : soit un programme appelé moteur de widget (Yahoo! Widget, Google Desktop, Kapsules sous Linux ou encore le navigateur Opera), soit un système d’exploitation de nouvelle génération comme Windows Vista ou Mac OS X.

Les RDA : l’avenir du logiciel ?

La toute dernière évolution des interfaces web s’appelle les Rich Desktop Applications. Tout comme les applets, les RDA nécessitent une machine virtuelle (Eclipse RCP, NetBeans, Java Web Start, XULRunner de Mozilla, Le futur Apollo d’Adobe ou encore le SmartClient de Microsoft). Ces technologies permettent d’avoir des interfaces aussi robustes que des applications et la simplicité de déploiement des sites web (pas besoin de les installer sur le système d’exploitation).

Plusieurs expérimentations sont en cours autour des RDA : SongBird (un concurrent de iTunes réalisé avec XUL), le Mozilla Amazon Browser (une RDA qui exploite le catalogue d’Amazon) ou encore le module d’eBay réalisé avec Apollo.

Conclusion : le service avant tout

Après ce formidable déballage des technologies toutes plus prometteuses les unes que les autres, je vous propose de faire le constat suivant : Qui avons-nous à gauche du schéma ? Amazon et eBay. Qui retrouvons-nous à droite du schéma ? Amazon et eBay. L’enseignement que nous pouvons en tirer est le suivant : si votre service est bon alors ces différentes technologies (et les plus récentes en particulier) ne doivent vous servir qu’à enrichir l’expérience utilisateur que vous proposez. Par contre si votre service n’est pas performant alors ne rêvez pas, l’interface (quelle que soit la technologie utilisée) ne compensera pas une expérience utilisateur négative.

Je vous laisse méditer là dessus…

Après les RIA, voici les RDA

Si vous suivez ce blog régulièrement, alors les RIA (Rich Internet Application) n’ont plus de secrets pour vous. Par contre, connaissez-vous les RDA (Rich Desktop Application) ?

Les RDA sont les applications riches du poste de travail. Comprenez par là que ce sont des applications, au même titre que votre traitement de texte ou votre logiciel de messagerie, sauf que ces applications riches sont déployées à la volée et exécutées sur une machine virtuelle. Gloups ! Et oui, ça calme comme définition, non ? Pour vous aider à bien faire la différence, je vous propose de revenir sur ce que sont les RIA puis de vous donner des exemples concrets de RDA.

RIA = Writely (heu… Google Docs)

Une RIA est une application qui se lance depuis votre navigateur et qui est exécutée à l’intérieur de ce dernier. WritelyGoogle Docs est ainsi un traitement de texte en ligne qui n’est pas installé sur votre poste de travail mais que ressemble à une application traditionnelle.

Les technologies de références pour faire des RIA sont :

  • AJAX ;
  • Flash / Flex ;
  • OpenLaszlo.

RDA = AjaxWrite

Prenons maintenant un autre exemple dans le même domaine : AjaxWrite est également une application en ligne mais qui s’exécute en dehors de votre navigateur. Oui je sais, vous allez me dire : mais… il s’exécute dans la fenêtre de votre navigateur, mais je vous répondrais : pas tout à fait.

C’est là où les choses se compliquent et où j’ai besoin de votre attention. En fait, AjaxWrite n’est pas exécuté par Firefox lui même mais par XulRunner, une sorte de machine virtuelle sur laquelle on peut faire tourner des applications en XUL. C’est un peu complexe à comprendre dans la mesure où Firefox utilise ce fameux XulRunner comme moteur d’affichage.

Donc pour faire simple : il est impossible d’exécuter Google Docs sans Firefox, par contre il est tout à fait possible de faire tourner AjaxWrite sans Firefox (du moment que vous avez installé XulRunner). Vous remarquerez que ce principe de machine virtuelle n’est pas neuf : le langage Java exploite déjà cette architecture depuis son lancement.

Le meilleur des deux mondes

Le principal intérêt des RDA est de pouvoir allier la praticité des RIA (légèreté, pas besoin d’installer l’application pour s’en servir) et la robustesse des applications traditionnelles (temps de réaction, stabilité…). Car il faut bien avouer que Google Docs est une belle prouesse technologique, mais qu’à utiliser au quotidien, c’est un peu pénible (lenteur, plantages).

Il est ainsi tout à fait possible de se connecter à un site, de lancer une application riche de type RDA (qui va se télécharger et s’exécuter à la volée en quelque secondes comme AjaxWrite) et de pouvoir l’utiliser par la suite en mode déconnecté avec une grande souplesse (l’application vérifiant s’il n’y a pas de nouvelle mise à jour à chaque nouvelle utilisation).

Pour rentrer dans des considérations plus techniques, il existe différentes technologies pour faire des RDA :

  • en Java à l’aide de Java Web Start, Eclipse RCP ou encore NetBeans RCP ;
  • en XUL (le langage de description d’interfaces de Mozilla) avec XulRunner ;
  • en XAML (le langage de description d’interfaces de Microsoft) avec la machine virtuelle de Microsoft (SmartClient.Net) ;
  • il faut également parler d’Apollo, le futur player universel d’Adobe (PDF, Flash, HTML) qui va également permettre de faire des choses très itnéressantes.

D’autres exemples ?

Il existe de nombreux exemples de RDA mais celui qui me plait le plus est le Mozilla Amazon Browser (dont j’avais déjà parlé dans un précédent billet il y a plus de deux ans) : une application riche pour parcourir le catalogue d’Amazon que l’on peut installer sur son ordinateur ou exécuter directement en ligne.

Et là vous me direz : et iTunes dans tout ça ?, et je vous répondrais : Ha non, iTunes est une application connectée. Nous sommes donc dans une configuration différente puisqu’il faut installer iTunes et le mettre à jour manuellement. De même pour Google Earth, c’est également une application traditionnelle mais qui se connecte à internet pour récupérer les données cartographiques.

Quelques réserves…

Je suis certain que mes explications feraient hurler des puristes comme Didier, Daniel ou Guillaume, mais voilà… il faut bien que je prenne des raccourcis pour vulgariser une notion complexe à expliquer.

Pourquoi est-ce que je cherche à vulgariser les RDA ? Tout simplement parce que leur potentiel est immense et qu’elles sont peut-être LA solution qui pourrait réconcilier deux mondes qui se font la guerre : les géants des services en ligne (Google, Yahoo!, SalesForce…) et les géants du logiciels (Microsoft, Oracle, MacromediaAdobe…).

Plus fort que Tiger et Vista : Novell Linux Desktop 10

On en parle depuis quelques jours sur la blogosphère et je viens juste de visionner les vidéos de la démonstration du nouvel environnement graphique du Desktop Linux 10 de Novell.

Le nouvel environnement graphique du Desktop Linux de Novell

Et le résultat est spectaculaire, bien plus impressionnant que ce que nous propose Mac OS et Vista. Jugez plutôt :

En plus de cela, l’IHM gère les propriétés de magnétisme et de déformation des fenêtres (à l’aide du Compiz Manager) comme en témoigne la vidéo que l’on peut télécharger ici : Compiz Window Manager Released. (merci à Jules pour le lien)

Alors oui, vous pouvez avancer trois objections :

  1. avec quelle machine va-t-on pouvoir faire ce genre de chose (un Cray-3 je pense) ;
  2. ils ont récupéré le meilleur des deux autres OS (les déformations de Tiger et la transparence de Vista) ;
  3. est-ce que l’on va pouvoir travailler plus vite avec ce genre d’effets graphiques ?

Mais bon, c’est quand même très impressionnant (et ce n’est pas Tristan Nitot qui pourra dire le contraire vu qu’il y était à cette démonstration).