Ideagency
Design / UX 6 min
le

3 fonctionnalités phares de Hotjar, outil inévitable de l'UX Design

S'il y a bien un outil dont nous sommes particulièrement fans chez IDEAGENCY, c'est Hotjar. Nous l'utilisons en effet régulièrement pour analyser le comportement de nos visiteurs sur notre site web afin d'améliorer l'expérience utilisateur. C'est pourquoi, nous tenons à vous le présenter aujourd'hui notamment à travers 3 fonctionnalités phares.

Nous avons choisi chez IDEAGENCY d'accorder une place toute particulière à l'expérience utilisateur et donc à l'UX Design en appliquant l'approche du Growth-Driven Design (GDD). Lorsque nous avons construit notre boîte à outil (étape dans la mise en place du GDD), nous avons cherché un outil qui nous permette d'analyser facilement le comportement utilisateur pour optimiser nos campagnes de marketing digital et l'expérience globale que nous proposons à notre auditoire. Après plusieurs recherches et comparaisons, nous avons retenu Hotjar. Voici pourquoi.

Hotjar, plus qu'un outil, un ami !

Hotjar, an all-in-one Analytics Feedback. Hotjar is a new and easy way to truly understand your web and mobile site visitors. Find your hottest opportunities for growth today.

Voici la baseline d'Hotjar qui se définit donc comme un outil tout-en-un d'analyse et de retour d'expérience dont l'objectif est de comprendre le comportement des utilisateurs pour développer de nouvelles opportunités. Bon traduire c'est sympa, mais qu'est-ce qu'ils apportent de si génial chez Hotjar ? Je vous propose de découvrir 3 fonctionnalités majeures que nous trouvons très (très) intéressantes.

3 fonctionnalités phares d'Hotjar

1- Les Heatmaps ou "cartes de chaleur"

Une heatmap, c'est quoi au fait ? C'est tout simplement une carte de chaleur qui donne une répartition des actions des internautes sur une page donnée.

La carte des "clics"

L'intérêt de connaître les endroits sur lesquels vos visiteurs cliquent vous permet de vérifier le bon fonctionnement de votre ergonomie. Est-ce que les gens cliquent sur les CTAs ? Est-ce que mon menu hamburger est bien compréhensible (c'est justement un test que nous effectuons actuellement sur notre site) ? Plus la zone est rouge et plus il y a eu de clics, c'est aussi simple que ça !

Sur le screenshot ci-dessous, vous pouvez voir la répartition des visites par terminal (ordinateur, tablette, mobile), le nombre de clics total (7376) ainsi que sur chaque zone.

carte des clics hotjar ux design

La carte des "déplacements"

Hotjar offre aussi la possibilité d'afficher le déplacement de vos visiteurs. C'est intéressant car vous n'avez pas forcément besoin de clics pour attirer un internaute ou pour l'intéresser. Connaître les endroits où la souris s'arrête permet d'en déduire les zones d'intérêt de votre page. Sur l'image ci-dessous, on voit bien que le menu, l'offre PRO et surtout l'offre BASIC ont été des points forts de déplacement des internautes.

carte des déplacements hotjar ux design

La carte des "scrolls" (ou carte des défilements)

Dernière fonctionnalité de cet outil Heatmap et non des moindres, c'est la carte des défilements. Elle vous donne ainsi sur une page le pourcentage de visiteurs qui a vu la section. Au fur et à mesure des scrolls on note forcément une déperdition des visiteurs, d'où l'importance sur une page "classique" de bien mettre les informations importantes en premier. C'est particulièrement utile pour les sites internet (comme nous par exemple) qui utilisent le "long scroll" puisque cela permet de vérifier le pourcentage de visiteurs qui atteint par exemple la fin d'une page. C'est aussi très utile pour optimiser les landing pages.

carte des scrolls hotjar ux designIDEA'LERTE : Nous avons fait une comparaison entre deux types de pages que nous proposons sur notre site : la homepage construit sur un long-scroll et la page Inbound marketing construit par section. La différence de scroll est flagrante : 90% de nos visiteurs scrollent pour lire toutes les sections sur la page Inbound marketing alors que sur la home seulement 50% lisent notre deuxième section. Nous attendons d'avoir encore un peu plus de recul avant de refondre notre home.

2- Les Recordings ou "enregistrements vidéo d'une visite"

Lorsque nous avons découvert cette fonctionnalité pour la première fois, nous avons été bluffé ! Hotjar enregistre le comportement d'un visiteur sur une page donnée (avec bien sûr les cartes de chaleur). Ainsi, vous avez accès à une vidéo qui présente exactement ce qu'a fait l'internaute. Vous visualisez en un clin d'oeil le parcours qu'il effectue sur la page et pouvez donc analyser facilement les points d'intérêts.

Exemple de l'outil sur une de nos pages de blog

3 - Les Feedback Polls ou "Questionnaires de retour d'expérience"

Le dernier outil que je souhaitais vous présenter aujourd'hui est l'outil Feedback qui vous permet de placer sur votre site une popup dont l'objectif est de recueillir l'avis de vos utilisateurs sur une page donnée, sur l'ensemble des pages. L'outil est très simple à utiliser. En quelques clics vous avez configuré votre questionnaire feedback. Voici le process de création en 6 étapes :

  1. Choix d'un nom en créant une nomenclature propre à votre société ;
  2. Définition des cibles (terminaux et pages) ;
  3. Création des questions à poser (texte long, texte court, bouton radio, checkbox ou échelle de valeur) ;
  4. Choix de l'apparence (couleur) ;
  5. Définition du comportement (apparition après un temps donné, après une action, après le scroll...) ;
  6. Activer ou non le questionnaire ;

feedback hotjar ux design

Hotjar est un outil formidable et fait partie des outils de référence en terme d'analyse de l'expérience utilisateur. C'est bien pour cela que nous l'utilisons au quotidien chez IDEAGENCY et qu'il fait partie de notre "Tool Stack" de notre stratégie Growth-Driven Design (GDD).

Pour aller plus loin, je consacrerai prochainement un article à propos de l'utilisation d'Hotjar dans un contexte GDD. Que vous souhaitiez analyser votre site pour l'améliorer ou le refondre, je vous suggère de l'adopter. Pour savoir si le moment est venu pour vous de refondre votre site, voici ci-dessous un guide rien que pour vous !

guide introduction growth driven design (gdd)

AUTEUR
Loïc BURDET
Loïc BURDET Directeur technique Ideagency
Voir les articles du même auteur

Parlons de vous

15 min pour parler de votre projet , de vos objectifs et problématiques et vous donner ma vision. Simple et humain!
Contactez-nous