Les boutons jouent un rôle important dans la plupart des modules e-learning, parce que l’ajout de boutons est l’un des moyens les plus simples d’amener vos apprenants à interagir avec votre contenu. Avec Storyline 360, travailler avec les boutons est très facile. Mais tirez-vous pleinement partie des boutons ? Poursuivez votre lecture pour découvrir quelques conseils de pros pour faire passer vos boutons au niveau supérieur.
1. Ajoutez des états à vos boutons
Les états des boutons vous permettent de modifier l’apparence des objets en fonction des actions de l’apprenant, par exemple s’il survole ou clique sur quelque chose. Ils donnent à vos apprenants des repères visuels pour leur faire savoir des choses comme :
- Quels objets sont cliquables
- Sur quels objets ils ont déjà cliqué
- Quel objet est actuellement sélectionné
L’utilisation des états des boutons est un excellent moyen de faciliter la navigation et l’interaction dans votre module. Pour en savoir plus sur les états des objets, consultez notre article Tout ce qu’il faut savoir sur les états dans Storyline 360.
2. Copiez les états à partir des boutons par défaut
Dans Storyline 360, il existe deux principaux types de boutons : les boutons par défaut et les boutons personnalisés. Les boutons par défaut se trouvent dans l’onglet Insertion.
L’un des avantages des boutons par défaut est qu’ils sont dotés de cinq états prédéfinis : Normal, Survol, Enfoncé, Visité et Désactivé.
Si vous souhaitez une apparence plus personnalisée, vous pouvez créer des boutons à partir de presque n’importe quel objet dans Storyline, comme une forme ou une image, simplement en ajoutant vos propres états et un déclencheur.
Mais cela signifie-t-il que vous devez créer tous ces états manuellement ? Heureusement, non ! Vous pouvez copier les états d’un bouton prédéfini vers votre forme à l’aide du Pinceau de reproduction de la mise en forme. Insérez simplement un bouton par défaut, cliquez sur le Pinceau de reproduction de la mise en forme et sélectionnez votre forme personnalisée, comme indiqué dans le GIF ci-dessous :
C’est aussi simple que ça, vous avez créé des états pour votre forme en quelques clic !
3. Ajoutez des icônes aux boutons intégrés
En plus d’avoir des états intégrés, un autre avantage de l’utilisation des boutons intégrés est qu’ils vous donnent la possibilité d’insérer une icône. Ouvrez simplement l’onglet Format et choisissez l’icône que vous souhaitez dans le menu déroulant :
À partir de là, vous pouvez soit choisir d’utiliser l’icône seule, soit d’ajouter du texte. C’est vous qui décidez !
4. Créez un ensemble de boutons
Une autre fonctionnalité intéressante offerte par Storyline 360 concerne les ensembles de boutons. Lorsque vous créez un ensemble de boutons, ces boutons se comportent comme les boutons radio dans une question à choix multiples, ce qui signifie qu’un seul bouton peut être sélectionné à la fois. Si un deuxième bouton est sélectionné, le premier bouton est automatiquement désélectionné. Cela peut être très utile si vous créez des onglets interactifs, par exemple.
Pour définir un ensemble de boutons, il vous suffit de sélectionner les boutons que vous souhaitez inclure dans l’ensemble, de cliquer avec le bouton droit et de choisir l’ensemble de boutons auquel vous souhaitez les ajouter.
Plus de ressources
Vous recherchez d’autres conseils de pros sur Storyline 360 ? Découvrez nos ressources :
- Gagnez du temps grâce à ces 5 astuces Storyline 360
- 3 choses à faire avant de créer votre module Storyline 360
- Améliorez votre productivité avec ces 6 astuces Storyline 360
- 5 fonctionnalités de Storyline 360 que vous ne connaissez peut-être pas
- Tout ce qu’il faut savoir sur les états dans Storyline 360
Vous souhaitez travailler avec les boutons dans Storyline 360, mais vous n’avez pas Articulate 360 ? Démarrez un essai gratuit de 30 jours et abonnez-vous à notre newsletter pour recevoir les dernières mises à jour de produits, des exemples de modules e-learning et des conseils d’experts directement dans votre boîte de réception. Si vous avez des questions, n’hésitez pas à les poser dans les commentaires.
Articles sur le même thème
40 commentaires
-
Bravo Allison pour ce guide.
Plein de bonnes astuces.
Stéphane-
Auteur
Merci Stéphane !
-
-
Bonjour,
petite question concernant les boutons : je ne comprends pas pourquoi certaines fois j’ai la main qui apparaît au survol du bouton et d’autres fois non ? Je n’arrive pas à comprendre d’où vient le problème car les boutons sont toujours les mêmes et n’ont pas le même comportement… (test en html5 avec 1 bouton créé d’après bouton par défaut dans lequel j’ai rajouté mes visuels et que j’utilise plusieurs fois dans le module).-
Bonjour Laetitia,
C’est étrange. Normalement vous devriez toujours avoir la main quand vous avez un état de survol. Je vous conseille d’envoyer votre fichier à notre équipe support : support@articulate.com
-
-
Bonjour
Peut on associer à un bouton plusieurs déclencheurs: le premier étant: aller à une diapositive et en même temps enlever 10 points à une variable?
Et comment faire en sorte que cela marche; J’ai beau essayé, je trouve pas la solution.
Merci-
Bonjour Hugo !
Oui, vous pouvez. Mais dans ce cas, l’ordre des déclencheurs est important. Il faut mettre le déclencheur qui mène vers une autre diapo en dernier car sinon ça changera de diapo avant que les autres déclencheurs aient eu le temps de déclencher. J’espère que c’est plus clair !-
Bonjour Allison
Merci pour votre renseignement, je n’y avais pas pensé!
-
De rien, Hugo 🙂
-
-
-
-
Bonjour,
comment faire pour faire apparaître un à un des objets différents suite à un clic dans une même zone???
merci pour votre retour -
Bonjour,
Comment pouvons-nous lancer une application (Word, Excel, Antidote ou autre) avec un bouton dans Storyline?
J’ai trouvé comment lancer l’application Photos (en inscrivant ms-photos:) dans l’action Ouvrir une URL/un fichier du déclencheur. Mais je ne n’arrive pas à trouver comment faire pour les autres logiciels.
——————-
Aussi, si j’intègre un éditeur de texte tinyMCE comme objet web dans une slide, est-il possible de récupérer le texte que l’utilisateur y saisit (via une variable et/ou un JS?Merci 🙂
Alain D.-
Bonjour Alain,
Le seul moyen que je connaisse de lancer une application serait d’ajouter un bouton qui ouvre un fichier créé avec le logiciel en question.
Je ne connais pas non plus de moyen de récupérer le texte saisi en dehors du module.
Je vous invite à poser la question sur E-Learning Heroes pour voir si d’autres utilisateurs ont trouvé des astuces pour y arriver.
-
-
Bonjour,
J’ai crée un déclencheur sur un bouton qui permet lorsqu’on clique dessus cela permet de télécharger une fiche synthèse qui se trouve sur mon ordi.
Cette fiche synthèse est également accessible lorsqu’on clique sur le lien ressources (paramétrer à partir du bouton lecteur).
Ensuite je publie et je dépose le e learning sur Moodle.L’apprenant peut accéder à la fiche synthèse lorsqu’il clique sur le lien Ressource mais pas lorsqu’il clique sur bouton. Comment procéder afin que cela fonctionne ?
Merci pour votre réponse
-
Bonjour Nathalie,
Avez-vous testé votre module sur plusieurs navigateurs ? Il est possible que cela fonctionne uniquement sur certains.-
Bonjour Allison,
Cela a été testé sur plusieurs navigateurs.
Le bouton crée fait appel à une fiche de synthèse qui se trouve sur mon disque dur.Lorsque l’apprenant clique sur ce bouton, il est noté le message suivant :
Cette page du site elythe-elearning.fr est introuvable. Aucune page Web trouvée à l’adresse :http://elythe-elearning.fr/pluginfile.php/727/mod_scorm/content/1/story_content/external_files/fiche%20synthèse%20Gestion%20des%20classeurs.pdfComment puis-je procéder afin de résoudre ce problème ?
Merci pour votre réponse.
-
Bonjour Natalie,
Je vous conseille de copier votre fichier manuellement dans le dossier « story_content » du dossier de publication.
-
-
-
-
Super ! cela fonctionne
Merci Allison-
De rien ! 🙂
-
-
Bonjour Alison,
Je crée des déclencheurs sur une zone clic de différentes captures vidéos en mode simulation (insérer en tant que diapositives par étape) :
Par exemple :
Lire le média Capture Vidéo e l’écran Quand l’utilisateur effectue un clic droit
ou
Lire le média Capture Vidéo de l’écran Quand l’utilisateur effectue un double clicOr lorsque l’apprenant effectue un clic droit ou un double clic cela ne fonctionne pas.
Mercie pour votre réponse.
-
Bonjour Nathalie,
Qu’est-ce qui se passe ? Rien ? Le mieux serait que vous m’envoyiez votre fichier : alamotte [at] articulate.com
-
-
Bonjour Allison,
Petite précision le clic droit fonctionne sur articulate mais pas sur moodleMerci
-
Bonjour Nathalie,
Avez-vous pu tester le module sur SCORM Cloud? Sinon, je vous conseille de le faire. C’est le standard en LMS aujourd’hui donc on l’utilise pour déterminer si le problème vient du module ou du LMS. Voici un article qui explique la procédure à suivre pour tester le module : https://blogs.articulate.com/les-essentiels-du-elearning/comment-depanner-votre-lms-avec-scorm-cloud/
En gros, si le module fonctionne sans problème sur SCORM Cloud, le problème vient du LMS. Si le module rencontre le même problème sur SCORM Cloud que sur votre LMS, le problème vient du module.
Si le problème vient du module, il faudrait envoyer les fichiers sources et à notre équipe de support en leur expliquant le problème pour qu’ils puissent vous aider à le résoudre. Si le problème vient du LMS, il faudrait contacter votre fournisseur de LMS pour essayer de le résoudre.
J’espère que ça répond à votre question ! N’hésitez pas à revenir vers moi si besoin.
-
-
Bonjour Allison,
Merci pour l’info. Je ferai un test sur le SCORM Cloud.-
De rien ! 🙂
-
-
Bonjour
Merci pour ce guide trés complet. je ne trouve toutefois pas la réponse à ma question. Lorsque que l’on créé des boutons avec des formes et que l’on associe un état normal et un état sélectionné, lorsque l’on passe d’un bouton à l’autre, la couleur devait changer: lorsque l’on clique sur le bouton 2, le bouton 1 passe à l’état normal. Sur vos templates ça marche mais lorsque je le reproduis ça ne fonctionne pas !
merci d’avance pour votre aide-
Bonjour Pascale,
Pour ça, il faut utiliser un ensemble de boutons. C’est expliqué dans l’avant dernière partie de l’article. Dites-moi si jamais ça ne fonctionne toujours pas après.
-
-
Bonjour Allison,
Je cherche un moyen de déclencher un jeu ludique une fois que les apprenants ont visualisé plusieurs cours.
Cours et jeu sont dans des scènes différentes à chaques fois. Je ne trouve pas l’état et le déclencheur correspondant.
Comment puis-je faire svp-
Bonjour Sébastien,
Est-ce que votre module est linéaire ou bien les apprenants peuvent suivre le module dans l’ordre qu’ils souhaitent ?
-
-
Bonjour Allison,
Merci pour ce guide mais je ne trouve malheureusement pas la réponse à mon soucis.
Je suis en train de créer un quiz sur storyline.
J’ai créer un bouton à partir d’un icone.
J’ai mis un déclencheur « valider… » quand l’utilisateur « clique… ».
Le calque « correct » s’affiche parfaitement bien quand je sélectionne la bonne réponse. Par contre, quand je sélectionne une mauvaise réponse, je suis obligée de cliquer deux fois sur le bouton pour que le calque incorrect s’affiche.
Sauriez-vous pourquoi?
Merci
LolitaBien cordialement
-
Bonjour Lolita,
Hmmm, non c’est étrange. Ça ne m’est jamais arrivé. Je vous invite à contacter le support directement en leur envoyant votre fichier : https://articulate.com/support/contact/case
-
-
Bonjour Allison,
Voici ma problématique de vieux bourlingueur sous Flash.
J’utilise les boutons intégrés au lecteur.
Je masque donc le bouton SUIVANT en entrée de slide et le remet en normal en fin de slide.
Mon soucis est lors d’un retour par PRECEDENT.
Je n’arrive pas provoquer une condition de slide déjà vu pour laisser le bouton SUIVANT en normal sans utiliser une variable par slide. Par avance merci.-
Bonour François,
Le plus facile serait de changer les paramètres de diapo à « reprendre l’état sauvegardé » au lieu de « décider automatiquement » ou « réintialiser » pour que le module « mémorise » le fait que l’apprenant a déjà vu la diapo.
-
-
Bonjour Allison,
J’ai un souci avec 6 boutons qui peuvent se déclencher en même temps si l’apprenant clique sur les 6 boutons.
Pour info 1 bouton déclenche 1 calque avec un texte + une voix.
Du coup j’ai les 6 voix en même temps.
J’ai utilisé la technique de sélection des 6 boutons + clic droit + ensemble des boutons1..
Mais ça ne fonctionne pas.
Vous avez une idée ?Merci de votre aide et très bonne journée
Cordialement
Julien-
Bonjour Julien,
Avez-vous bien coché la case « masquer les autres calques » dans les propriétés de calque ?
-
-
Bonjour Alisson,
Comment faire pour qu’un objet sur une diapo (celle du plan) change d’état à partir du moment où certaines slides ont été visionnées ? Merci.-
Bonjour Sandrine,
vous pourriez créer une variable (Vrai/Faux) puis modifier sa valeur (avec un déclencheur) quand une certaine diapositive a été visionnée. Sur votre diapositive principale, vous pouvez changer l’état d’un objet au démarrage de la chronologie à l’aide d’un déclencheur avec une condition qui vérifie la valeur de la variable. Téléchargez le template du tableau de bord, il vous aidera à démarrer. Bonne journée !
-
-
Bonjour !
J’ai crée un questionnaire (pas un quiz) avec des boutons radio. Je dois comptabiliser le nombre de réponses A, le nombre de réponses B et additionner ces 2 totaux pour obtenir un score.
J’ai choisi une syntaxe du type : ajouter la valeur 1 à total A quand l’utilisateur clique sur bouton Calculer si l’état de Question-1A est égal à sélectionné (inspirée du travail de Chris Foster sur le questionnaire Burn Out, mis a part que mon questionnaire comporte deux dimensions).
Je m’aperçois que c’est le nombre de clics sur le bouton qui est comptabilisé et non pas l’état du clic au moment d’appuyer sur le bouton de résultat. Comment « figer » l’état affiché à l’écran ? Un grand merci pour votre aide !
J’aurai d’autres questions relatives à l’addition de variable, que je soumettrai si j’arrive à surmonter le pb ci-dessous.
Mille mercis par avance-
Bonjour Emmanuelle,
on vous conseille d’envoyer votre fichier au support technique pour qu’ils regardent de plus près.
Assurez-vous de ne pas rajouter 1 point à chaque clic sur un bouton radio. Le calcul de points se fait au moment d’appuyer sur le bouton Calculer. Merci, bonne journée !
-
-
Bonjour,
j’arrive pas à masquer le bouton validé si la réponse est fausse (code déclencheur confondu), est-ce-que vous pouvez m’aider s’il vous plait.
Merci-
Bonjour,
vous pouvez utiliser l’état initial du bouton et un déclencheur pour changer son état. Nous vous conseillons de prendre contact avec notre équipe d’assistance. Bonne journée !
-
Pingbacks
-
[…] Si vous créez votre module dans Storyline 360, vous pouvez utiliser la fonctionnalité États pour modifier le format de vos boutons lorsque les apprenants les survolent, cliquent dessus ou les font glisser, par exemple. Pour en savoir plus, cliquez ici : Guide des boutons de Storyline. […]