Intro.js – guide interactif pour votre site

Intro.js – Le Guide interactif pour vitre site

Aujourd’hui on va parler d’un petit script nommé « Intro.Js » que je viens de découvrir et que je trouve très intéressant de nos jours pour l’expérience utilisateur.

Intro.js est un magnifique guide interactif à placer sur votre site avec des balises crées que le script va lire dans l’ordre, de la première à la dernière et ainsi afficher des info bulles d’aide afin de mieux présenter l’interface de votre site à vos nouveaux utilisateurs. Simple, pratique et efficace.

L’équipe qui se cache derrière ce petit script est celle de usabli.ca, trois geeks de Téhéran en Iran.

Intro.js est vraiment léger, seulement 6Kb et est compatible avec la plupart des navigateurs du marchés. Sa facilité de mise en oeuvre permettra au plus novice des développeurs de pouvoir l’implanter sur son site Internet en tout tranquillité.

En effet, il suffit simplement d’ajouter deux attributs à vos balises pour que celle-ci soit un élément dans l’arborescence du guide.Le premier attribut est « data-step » où la valeur définira l’ordre d’affichage, du plus petit au plus grand, donc 1 pour le premier conseil et ainsi de suite. Et pour le texte qui sera afficher dans l’info bulle, le deuxième argument est « data-intro » avec en valeur votre description à afficher. Simple.

De plus, ce plugin offre une navigation fluide est permet en plus de naviguer entre les différentes via la souris grâce au clip sur les flèches suivantes ou précédentes mais également à l’aide des flèches du clavier. Le bouton ESC vous permettra de quitter l’aide du guide.

À vous de vous amusez grâce à ce plugin jQuery pour offrir à vos utilisateurs un guide interactif afin de mieux leur expliquer le concept l’idée de votre site. Si vous implantez ce module dans votre site, n’hésitez pas à nous contacter pour nous faire part de vos retours.

Demo de Intro.JS

Téléchargement

Le site de Usabli.ca

Le Github de Usabli.ca

LAISSER UN COMMENTAIRE

Merci de rentrer votre commentaire
Merci de rentrer votre nom

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.