MENU
Théo Beauvallet | 08 Juin 2016

WebGL : la 3D se démocratise sur internet.

Habituellement, le langage HTML est un format de données représentant des pages web via du contenu en 2D : vidéos, textes ou images. Dans sa dernière version, ce langage introduit une nouvelle API qui facilite l’accès à la 3D pour les développeurs, révolutionnant ainsi l’expérience des utilisateurs.

Logo Article

Qu’est-ce que c’est ? Comment ça marche ?

Manipuler virtuellement un produit, interagir avec des animations 3D, jouer à un jeu sur son navigateur, le WebGL généralise l’utilisation de la 3D sur un site internet, le tout sans plugin ni téléchargement annexe !

Aujourd’hui, plus de 90% des devices sont compatibles avec le WebGL, que ça soit sur mobile, desktop ou tablette. Tous les navigateurs internet ont accès à cette technologie, même Internet Explorer. Néanmoins, Google Chrome reste le plus optimisé pour profiter d’une expérience WebGL fluide et rapide.

Une nouvelle expérience pour la marque et l’utilisateur.

Le WebGL repousse les frontières de l’interaction avec l’utilisateur. La navigation ne se fait plus seulement sur un axe vertical ou horizontal, mais aussi sur un champ de profondeur exploité par la 3D. L’utilisateur peut parcourir un site en explorant un univers bâti en 3D par exemple, l’apparence du site peut même évoluer en fonction du parcours de l’internaute.

Couplé à de nouvelles techniques de navigation, comme le eye-tracking qui utilise la webcam pour suivre le regard ou les accéléromètres de smartphone qui captent les mouvements de l’utilisateur, le WebGL devient une expérience vidéoludique à part entière, bien plus immersive que les sites auxquels nous sommes habitués.

Cette ultra-personnalisation du parcours-utilisateur pousse les visiteurs à s’investir davantage dans la navigation.

Il est alors plus simple pour une marque de capter l’attention des consommateurs tout en facilitant la rétention d’information.

Le WebGL, la 3d temps réel.
Le WebGL, la 3d temps réel.

Une tendance au potentiel encore inexploité.

2016 est l’année du WebGL. Cette technologie habituellement réservée aux esthètes du webdesign s’expose au grand public. C’est une véritable révolution dans le monde du webdesign qui repense les codes de l’UI et de l’UX.
Aujourd’hui, nous utilisons principalement le WebGL pour jouer sur un navigateur, visualiser des données en temps réel ou bien des cartes en 3D, mais cette technologie a bien plus à nous offrir.

La démocratisation du WebGL concorde avec celle de deux autres innovations : la réalité augmentée et l’impression 3D. La réalité augmentée permettrait de décupler l’expérience WebGL en interagissant directement avec l’interface d’un site web, sans passer par un périphérique. Une navigation à la Minority Report qui pousserait la qualité du webdesign à un tout autre niveau : nous pourrions circuler d’une page à une autre simplement en effleurant du doigt un hologramme, zoomer sur du contenu en étirant une forme avec nos mains, ou même enfiler directement un vêtement virtuel avant de l’ajouter à son panier.

L’impression 3D couplée au WebGL facilite la visualisation d’un produit en l’affichant en volume sur un navigateur. En personnalisant directement en ligne un produit grâce à une interface de customisation, l’utilisateur profiterait d’une offre sur-mesure modelée selon ses envies. Imaginez-vous choisir un élément de décoration en ligne, le manipuler et le modeler selon vos envies avant de le recevoir instantanément grâce à l’impression 3D ! Un nouveau mode de consommation qui n’attend que la popularisation des imprimantes 3D à domicile.

Le WebGL, la 3d temps réel.

3 bonnes raisons d’utiliser le WebGL pour son site internet :

  • Élégance : Le WebGL affine l’apparence d’un site web en facilitant l’utilisation de la 3D et de rendus graphiques complexes.
  • Expérience : Cette technologie bouleverse les codes de la navigation linéaire sur internet et permet de faire vivre une expérience unique aux visiteurs.
  • Audience : Le WebGL est disponible sur desktop, mobile et tablette, et compatible avec la plupart des navigateurs existants. Tout le monde a accès au WebGL, il n’y a pas de frontières techniques à dépasser.

Applications concrètes du WebGL

Le nouvel an AirBnb illustré
Le nouvel an AirBnb illustré

Pour la saint-Sylvestre, la célèbre plateforme de location d’appartements met l’accent sur la force et la croissance de sa communauté. L’utilisateur explore le globe et les données liées à la marque grâce à une navigation simple et intuitive.

1 million de raisons d’aimer Audi
1 million de raisons d’aimer Audi

La marque Allemande utilise le WebGL pour valoriser la qualité de ses voitures et la satisfaction de ses clients. Un nuage de points sculpte un modèle 3D de la dernière voiture de la marque. Chaque point représente le commentaire d’un heureux propriétaire Audi sur les réseaux sociaux. Le nuage de point s’anime pour donner vie en 3D aux avis des consommateurs.

Watch Dogs nous donne un aperçu du Big Data.
Watch Dogs nous donne un aperçu du Big Data.

Ce jeu vidéo dystopique illustre en temps réel les données qui parcourent les métropoles Européennes à travers le WebGL. Ville par ville, quartier par quartier, l’utilisateur exploite les données abondantes qui nous entourent grâce à une carte interactive à la précision déconcertante.

Endless wish, le WebGL émotionnel par Sweet Punk
Endless wish, le WebGL émotionnel par Sweet Punk

Pour ses vœux 2015, l’agence Sweet Punk a réinterprété les 3 piliers majeurs du Bouddhisme en créant une expérience dont la direction artistique évolue en fonction des émotions de l’utilisateur. En captant les expressions faciales de l’internaute grâce à sa webcam, chaque tableau d’Endless wish va évoluer selon le ressenti de l’utilisateur.

Plus qu’une démonstration technique, ce site est un reflet de l’état d’esprit de l’agence : une expérience digitale ne doit pas être conçue simplement pour séduire, mais aussi pour être vécue.

Vous voulez en parler avec nous ?

Pourquoi ne pas se rencontrer pour échanger autour d’un projet ou d’une technologie ? Nous serions ravis de partager notre vision des choses !

nous contacter