conseil en ergonomie
conseil en design UX
architecture de l'information
icone conception UX design

La gamification UX design d'un site web relève des techniques de conception UX design.
Découvrez des exemples illustrés et des ressources pour gamifier l'UX de votre site web.
Des modèles pour la gamification de dispositif digital et une formation sont disponibles en accès payant.

Gamification et UX design

Révisé en Septembre 2021

Comment gamifier de site web

gamification

La gamification UX design consiste à introduire une dose de jeu dans votre dispositif digital. L'expérience d'utilisation va être pensée à travers des mécaniques de jeux : progression, badges, récompenses... La gamification d'un site web doit être mise en place en amont de la conception de l'interface utilisateur et de l'architecture de l'information afin d'être parfaitement intégrée à l'expérience d'utilisation.

Bref, qu'est-ce que la gamification ? Quelles méthodes pour rendre un site web plus ludique ? Quelles sont les implications des systèmes de gamifications dans la conception d'un dispositif digital ?
Comment gamifier un site web ?
Nous allons esquisser les méthodes de ludification (rendre un site plus ludique) et illustrer des exemples d'expérience utilisateur reposant sur une mécanique de gamificiation.
Ces travaux relèvent du design de l'interaction, du design émotionnel et du design stratégique.

La gamification vise à utiliser des techniques issues du jeu pour améliorer l'engagement des utilisateurs au sein du site et rendre l'expérience d'utilisation plus ludique. Les mécaniques de gamification se rapprochent de celles des jeux vidéos, notamment autour du game design, afin de changer, faire évoluer et engager les comportements de l'utilisateur en interaction avec un support interactif.

On s'appuie sur le pouvoir du jeu pour attirer l'attention, susciter l'intérêt et maintenir l'attrait d'un dispositif. Il s'agit clairement d'augmenter les performances en améliorant l'intéret du dispositif... Tels sont les enjeux de la gamification d'une interface et par extension de la gamification d'un dispositif web. On utilise le verbe "gamifier" pour caractériser le passage d'un site "traditionnel" à un site embarquant une mécanique de jeu typée gamification.

Gamification et design d'expérience utilisateur

Les mécaniques de gamification utilisées pour la conception de site web existent depuis plus de 40 ans et l'avènement des premiers jeux vidéos. Il n'y a donc rien de nouveau. On peut par ailleurs utiliser les techniques gamifiantes au-delà des jeux-vidéos et des supports digitaux : gamification au travail et gamification professionnelle, gamification sportive, gamification scolaire...
Les systèmes de jeux se structurent autour de la compétition, de l'avancement, de la récompense, ils sont donc susceptibles d'investir toutes les couches d'une société centrée sur la performance...

Dans les méthodes du design d'expérience utilisateur, les équipes de conception vont recourir à un moteur ludique pour augmenter l'intérêt du dispositif, proposer des quêtes à l'utilisateur et l'inciter à participer davantage.
Les principes de la gamification reposent sur l'incitation (ergonomie incitative), la sollicitation, l'exhortation à réaliser des actions en échange d'une récompense (rewarding).

Le game design s'articule autour de niveaux : chaque action rapporte des points et l'accumulation d'actions réalisées et réussies fait progresser l'utilisateur dans l'échelle de jeu du dispositif.
Sur le plan des méthodes UX, la gamification s'organise en deux temps : une phase d'analyse UX (comprendre l'usager), puis une phase de conception UX (concevoir le jeu adapté à la cible). Nous y reviendrons en détail dans la partie méthode de gamification...

Gamification et marketing

L'introduction d'une partie ludique au sein d'un dispositif digital n'a rien de gratuite. Au-delà du fait d'injecter une dose de fun et d'amusement au sein d'un site, la gamification poursuit des objectifs marketing.

Il ne s'agit pas d'amuser l'utilisateur juste par philantropisme...
La mécanique de gamificatin doit pousser l'utilisateur à :

  • Passer plus de temps sur le site web.
  • Consulter plus de pages sur le support interactif.
  • Réaliser plus d'actions au sein du dispositif digital.
  • Revenir sur le médium numérique pour enrichir son profil.
  • Donner des informations sur ses habitudes, ses préférences (pour gagner plus de points).

La mise en place d'un système de jeu vise un objectif principal de fidélisation. Les scénarios marketing sont multiples :

  • Augmenter les recettes publicitaires en imposant des parcours plus longs, et des expositions systématiques aux publicités.
  • Enrichir la qualification des clients et des usagers en mêlant les quêtes fonctionnelles peu engageantes à des sondages plus complexes, sur les habitudes de consommation du prospect.
  • Améliorer le taux de participation des usagers et la création de contenus sur la base des mécanismes 2.0 : engagement dans les commentaires, réactions dans les forums, publications d'événements, proposition d'articles.
  • Engager le client plus fortement avec la marque.

Au niveau marketing, un système de gamification établit des niveaux d'utilisateurs et donc des profils de clients...

Stratégie de gamification

La stratégie de gamification repose sur des ressorts marketing, publicitaires, commerciaux, communautaires. Les équipes de conception peuvent combiner deux grandes stratégies de jeu sur le plan du game design :

  • Concours entre les utilisateurs : compétition, challenge, récompense.
  • Quêtes individuelles : cagnottage, progression, profil.

Gamifier un site web ou tout type de support digital (intranet, application) revient à faire cohabiter une logique de jeu individuelle et collective. Ces différences prennent corps, au sein de l'interface utilisateur, entre espace public et espace privé...
Voici quelques exemples de dispositifs ayant recours à la ludification :

  • Mécanique de cagnottage et points fidélités : hypermarchés et magasins en ligne (exemples Carrefour, Auchan, Cora, Leclerc, etc.). Récompense : réductions, avantages, ristournes...
  • Logique participative : sites communautaires (exemples : Tripadvisor, Linked In). Récompense : statut, valorisation au sein de la communauté...
  • Système de jeu : sites communautaires et commerciaux (exemples : Communauté Foot, communauté produit drones, parfums). Récompense : produit, prime, valorisation au sein de la communauté...

Objectifs de la gamification

Engager l'utilisateur dans un dispositif gamifié

La gamification consiste à apporter des incitations pour engager l'utilisateur dans l'utilisation du dispositif digital... La mise en en place d'un système de gamification a pour principal objectif de :

  • Favoriser l'adhésion des publics ciblés.
  • Développer la notion de plaisir autour de l'utilisation d'un support digital.
  • Améliorer la relation avec le client.
  • Booster l'intérêt et l'agrément procuré par le dispositif digital.
  • Encourager l'utilisateur à explorer le dispositif.
  • Engager l'utilisateur à participer et à se dépasser.
  • Améliorer les performances...

Le développement de la notion d'engagement a pour principal objectif de générer des résultats sur le plan transactionnel : plus d'actions réalisées au sein du dispositif, plus d'engagement dans la communauté, plus de participations, in fine plus de transactions commerciales, avec plus de fun... Les objectifs de la gamification sont économiques et communautaires.

Exemples de mécanique de gamification

icone telecharger des modeles pour analyse UX
TÉLÉCHARGER
150 livrables projets !
Kit de livrables projet : 2,60€ le modèle

gamification exemple gamification ux design
gamification Credit Agricole TousFoot
iafactory - Julien MUCKENSTURM
wireframe et gamification exemple de gamification UX
gamification ux Credit Agricole TousFoot
iafactory - Julien MUCKENSTURM
gamifier un site web gamifier un site web
gamification ux Parrot
iafactory - Julien MUCKENSTURM
gamification de site web gamification de site web
gamification ux Parrot
iafactory - Julien MUCKENSTURM
gamification et concours UX design et gamification
gamification ux Cacharel
iafactory - Julien MUCKENSTURM

Méthode pour gamifier une interface

icone formation ux design en ligne
MAÎTRISER
les méthodes UX design
Formation UX en ligne : 18,00€ l'heure

Méthode de gamification UX

Vous pouvez gamifier un site existant ou créer un système de gamification dans le cadre de la création d'un nouveau dispositif digital.
La mise en place d'une logique de gamification au sein d'un site web existant implique de nombreux travaux d'optimisation de l'interface. En effet, le design de l'interaction et le design de l'information sont fortement impactés sur le plan de l'interface... Mais avant de lister tous les gabarits impactés par le système de gamification, il faut d'abord définir la mécanique du jeu...

Pour créer un canevas de gamification, il est important de bien connaître l'audience de votre site internet. La première étape du travail de gamification consiste donc à réaliser les études sociologiques sur le public cible de votre produit : étude des usages digitaux, analyse des besoins des utilisateurs.
Ces études du public prennent la forme d'entretiens et de rencontres avec les personnes amenées à utiliser le site. On utilise les techniques d'enquêtes et d'investigations classiques : entretiens individuels, entretiens en groupes...

Si vous connaissez très bien votre audience et vos clients, et si votre site internet est implanté sur une niche très particulière, alors il sera plus facile de développer un système de jeu en adéquation avec le profil de votre cible (communauté de jeu en ligne, communauté sportive, etc.).

Gamification : progression et récompense

Pour gamifier un dispositif, il faut introduire des mécaniques de récompenses - rewarding : systèmes de statuts, de badges, logiques de compétitions (mais pour le fun...).

Comme les exemples de gamification l'illustrent ci-dessus, la méthode de gamification consiste à bâtir un système de progression dans l'utilisation du dispositif digital. Ce barème de progression vise à établir des niveaux d'utilisateurs, du moins engagé vers le plus engagé.
Pour engager l'utilisateur, le dispositif digital propose des incitations à l'action, lesquelles permettent de gagner des points qui s'échangent ou se valorisent par des statuts, des badges, des récompenses.
Ce sont les basiques de la gamification d'un site web.

La conception d'un scénario de gamification de l'expérience utilisateur s'applique efficacement aux dispositifs transactionnels, ecommerce et communautaires. Une bonne logique de gamification de l'expérience permet d'accroître les performances du dispositif digital dès lors que les objectifs et les enjeux ont bien été travaillés en amont :

  • Plus d'utilisateurs inscrits.
  • Une augmentation de la fréquentation du site.
  • Une croissance de la revisite et de la fidélisation.
  • Une amélioration de l'affinité entre le site et l'audience.
  • Plus de partages et de création de contenus par les utilisateurs.

Gamification : conception et interface

L'interface utilisateur doit théâtraliser les mécaniques de gamifications et les logiques de progression. La mise en scène de la participation et la valorisation des actions des utilisateurs a un rôle fondamental dans la mécanique de jeu.

Les concepteurs d'interface (UI design) doivent privilégier des interfaces riches : les rétroactions doivent figurer la progression immédiatement (interaction avec le compte utilisateur, feedback immédiat de l'interface)...

En règle générale, l'utilisateur doit être connecté, et toutes les actions qu'il réalisera dans le cadre du scénario de jeu affecteront son profil. L'interface gagne donc à faire ressortir efficacement les actions de jeu et la prise en compte des actions une fois celles-ci effectuées.

Pour gamifier efficacement le dispositif, l'envergure fonctionnelle de tout le dispositif digital doit être irrigué par le mécanisme du jeu. Nous allons voir 2 grands exemples de gamification pour illustrer le propos sur un site éditorial et un site transactionnel.

Gamification de site ecommerce

Plus l'utilisateur interagit sur le site ecommerce, plus il s'engage, et plus il sera récompensé. Le barème des points est déterminé en fonction du degré d'engagement de chaque action :

  • Acheter un produit : + 250 points.
  • Créer un compte : + 150 points.
  • Participer à un événement : + 150 points.
  • Enregistrer des informations post achat sur le profil (marketing des préférences) : + 75 points.
  • Partagez un contenu (photo, vidéo, données) : + 50 points.
  • Publier un contenu dans le support de la communauté (forum) : + 40 points.
  • Commenter le produit acheté : + 35 points (attention, toujours vérifier la légalité de la démarche).
  • Visite en boutique : + 20 points.
  • Partage d'une page dans les réseaux sociaux : + 5 points.
  • Connexion : + 5 point.

Ce sont des exemples de barème de gamification. Il faut y introduire des limites temporelles pour maitriser le système de gamification. Le système de limite peut avoir des conséquences très importantes sur la fidélisation : si les barèmes sont indexés sur une journée, et que l'utilisateur ne peut pas réaliser plus de X actions par jour, il aura tendance à revenir (revisite) pour compléter les actions dans le scénario de la récompense...

Sur la base des points récoltés par chaque utilisateur, le game design prévoit des niveaux de profil :

  • Débutant : Moins de X points.
  • Intermédiaire : Entre X points et Y points.
  • Avancé : Entre Y points et Z points.
  • Expert : Plus de Z points.

Il peut y avoir de nombreux niveaux de profilage. Le travail de conception rédaction permet de créer des labels plus en phase avec les logiques de jeux comme dans les exemples de gamification des projets présentés.
Au système de barème s'ajoute toute la mécanique de badge correspondant à autant de challenge contextuel. Tous ces statuts peuvent être associés à des récompenses sur le principe de la fidélisation et du cagnottage. La réalité : ça marche !
Pour autant, les enjeux en matière de conception sont très importants. Concevoir une interface sur la base d'une mécanique de gamification enrichit considérablement le périmètre fonctionnel du dispositif. Les impacts sur les coûts de production sont importants.

Gamification de portail éditorial

Exemple de mécanique de gamification pour un portail éditorial :

  • Inscription : + 50 points.
  • Like, partage, retweet : + 5 points.
  • Participation à un quiz : + 10 points.
  • Commentaires jugés utiles : + 20 points.
  • Participation à un jeu concours : + 50 points.
  • Publication de contenu validé : + 100 points.

Les statuts et les niveaux se gagnent en cumulant les points. Les badges sont attribués pour des séries d'action (25 commentaires : badge commentateur = + 250 points = participation au tirage au sort machin).

Vous pouvez concevoir un système gamifié quelle que soit la nature et le contexte de votre projet :

  • Un système gamifié fonctionne pour tout type de secteur d’activité (distribution, télécom, banque, assurance, énergie, mode, etc.).
  • La gamification opère sur des problématiques diversifiées (corporate, ecommerce, image de marque, événementiel, etc.).
  • Il est possible de lancer une conception de gamification pour tout type de projet (site internet, intranet, mobile, etc.) à destination de tout type de cible (B2B, B2C, B2E, collectivités, etc.).

Démarche pour gamifier un dispositif digital

Si vous êtes amenés à mettre en place une mécanique de gamification, ces quelques points de checkpoints sont recommandés :

  • Brief et définition de la feuille de route : problématique, objectif du projet...
  • Rencontre avec les usagers : étude des usages, analyse de besoin utilisateur...
  • Esquisse de la mécanique de gamification : barème, statut, badge, système de point, reward.
  • Définition de la grille et du barème de points (rewarding).
  • Proposition de mécaniques de statuts et de badges.
  • Fonctionnalités autour de la mécanique de gamification,
  • Cartographie du jeu.
  • Conception et maquettage fonctionnel de l'interface avec systèmes d'ergonomie incitative.
  • Optimisation de l'interface autour de la logique de gamification.
  • Prototypage, test, amélioration continue.

Travaux complémentaires à la gamification

Gamifier un site web accroit le scope fonctionnel du projet : un travail d'inventaire fonctionnel vise à établir le listing de toutes les fonctions de gamification et de tous les gabarits impactés par le fonctionnement du jeu.

Les parcours d'utilisation doivent faire l'objet d'un soin particulier.

Enfin, la mise au point d'une mécanique de gamification doit se traduire par la modélisation des principes d'interface via la technique de wireframing, notamment en veillant à illustrer le système de points, la progression, les incitations...

auteur Julien Muckensturm iafactory
linked in julien muckensturm

Ressources pour la gamification

APPROFONDIR
la gamification

Livre : Gamification
Gamification

Aller plus loin pour gamifier une interface digitale

Formation vidéo à visionner :

Études de cas à lire :

Compétences métier pour la gamification :

Fiche métier :

Livres à bouquiner :

Autres ressources sur le web :

Plus de techniques de conception
ENVERGURE FONCTIONNEL
Résumé synthétique des intentions du dispositif digital et des parcours des utilisateurs.
synopsis
CONCEPTION D'INTERFACE
Clarification de la structure du site, des pages types et des fonctions attribuées à chaque zone.
zoning
CONCEPTION D'INTERFACE
Esquisse d'interface utilisateur, projection des contenus et fonctionnalités à l'écran.
wireframing