Dans ce tutoriel, nous allons créer un jeu Répétez la séquence !, une réplique du jeu électronique des années 1980, le "Simon". Dans ce jeu classique, les participants doivent mémoriser et répéter une séquence d'images.
Comment fonctionne Répétez la séquence !
Répétez la séquence ! est un jeu de mémoire simple. L'objectif est de répéter une série de clics d'images aléatoires créées par le jeu. Après chaque tour, la séquence devient progressivement plus longue et plus complexe, ce qui rend plus difficile de s'en rappeler.
Pouvez-vous mémoriser la séquence ? Avant de commencer le tutoriel, jouez à une version live du jeu.
Généralement, vous aurez quatre ou neuf images différentes, chacune avec une couleur et un son uniques qui sont activés lorsqu'ils sont pressés. Le son aide le participant à se souvenir de la séquence.
Pour commencer
Préparez votre campagne
Étape 1, créons votre campagne :
- Ouvrez Qualifio Engage et cliquez sur le bouton Créer une nouvelle campagne.
- Sélectionnez Jeux > Répétez la séquence !
- Si le participant doit s'inscrire, choisissez le mode "identifié". Si aucune inscription n'est requise, sélectionnez "anonyme".
- Sélectionnez Créer une campagne.
Après avoir créé votre campagne, vous pouvez commencer à configurer le jeu.
Choisissez un jeu à personnaliser
À l'étape Jeu, il y a plusieurs jeux prêts à l'emploi que vous pouvez utiliser comme inspiration.
Une fois que vous avez décidé avec quel jeu vous voulez commencer, sélectionnez Personnaliser ce jeu.
Le moyen le plus rapide pour commencer à créer vos propres designs ⚡️
Notre kit Figma pour Répétez la séquence ! comprend des éléments tels que des arrière-plans et autres images de nos jeux prêts à l'emploi. Cliquez sur le bouton Obtenir une copie. Ensuite, vous pouvez sélectionner le fichier que vous voulez et l'exporter depuis Figma.
Remarque : les jeux personnalisés vous permettent de créer et de sauvegarder vos propres modèles de jeu. Pour enregistrer la conception et les mécanismes de jeu en tant que jeu personnalisé, vous n'avez qu'à ouvrir l'éditeur, modifier votre jeu comme vous le souhaitez, puis cliquer sur "Enregistrer comme nouveau jeu". Les jeux personnalisés peuvent également être trouvés dans la section Documents sous "Formats avancés".
Contrôles de jeu et personnalisation
Layout
Il est maintenant temps d'ajouter des images personnalisées à votre jeu. Pour concevoir un Répétez la séquence !, votre première étape sera d'ajouter une image d'arrière-plan ainsi que les boutons de son marche/arrêt.
Note : Pour prévisualiser les changements les plus récents apportés à votre jeu, vous pouvez utiliser la fonction de prévisualisation en direct et sélectionner Actualiser.
Image d'arrière-plan
Cette image est utilisée comme arrière-plan sur toutes les pages du jeu.
Boutons de son marche/arrêt
Les participants peuvent activer ou désactiver le son à leur guise. Le bouton “son désactivé” désactive le son dans votre jeu, tandis que le bouton “son activé” réactive le son.
Ligne de contour
La couleur du contour est utilisée pour afficher le focus lorsqu'un participant navigue dans le jeu au clavier.
Nouveau comportement:
-
Contour de focus en navigation clavier : le jeu affiche désormais un focus visible sur les éléments interactifs lors de la navigation au clavier
- Si aucune couleur n'est configurée, le contour sera blanc par défaut
-
Phase d'observation et de jeu : le jeu utilise désormais aussi vos paramètres de contour / ombres pendant les phases d'observation et de jeu lors de la navigation au clavier
- Si aucun contour/ombre n'est configuré, la couleur de contour de l'interface sera utilisée
- Point important (accessibilité) : même sans navigation au clavier, la phase d'observation affichera désormais toujours un contour lorsque des éléments sont sélectionnés (retour visuel du focus). Ce compromis était nécessaire pour répondre aux exigences d'accessibilité et garantir un retour visuel cohérent pour tous les utilisateurs.
Mode de jeu
Répétez la séquence ! a deux modes de jeu qui peuvent être joués:
- Dans le mode à vies, le participant perd une vie s'il se trompe dans la séquence ou oublie une des actions. Essentiellement, le jeu ne se termine que s'ils commettent suffisamment d'erreurs, ils peuvent donc continuer aussi longtemps qu'ils le peuvent!
- Dans le mode à temps, vous définissez une limite de temps et les participants se battent contre la montre. Ils doivent être rapides pour appuyer sur autant d'images qu'ils le peuvent, dans l'ordre.
✋🏼 En option, dans le mode à vies, vous pouvez activer un temps de tour limité dans le jeu. Cela peut rendre le gameplay plus rapide sous la menace de perdre une vie : lorsque les participants ne parviennent pas à appuyer dans les temps, ils perdent une vie ! La limite de temps initiale maximale pour cela est de 10 secondes. À chaque tour, la limite de temps sera prolongée à mesure que le jeu ajoute une image à la séquence. Pour définir cette limite de temps, cliquez sur Afficher les paramètres avancés, puis sur Ajouter un minuteur de compte à rebours à chaque tour.
Recommandations d'accessiblité
Si votre objectif est de rendre le jeu plus inclusif pour tous les utilisateurs, surtout ceux utilisant un lecteur d'écran :
- Privilégiez le mode basé sur les vies, car il laisse plus de temps aux participants pour explorer la grille et retrouver les éléments entre les actions
- Si vous choisissez le mode basé sur le temps, nous recommandons fortement de définir une durée plus longue pour rester inclusif
- Nous déconseillons fortement de combiner un gameplay basé sur les vies avec un compte à rebours par manche (paramètre avancé). Même au maximum, ce temps par manche peut être trop court pour permettre à des utilisateurs dépendants d'un lecteur d'écran de jouer confortablement.
Cela reste sous votre contrôle, mais ce n'est pas recommandé si l'accessibilité est un de vos objectifs clés.
Répétez la séquence !
Ensuite, allez à la section Répétez la séquence ! C'est ici que vous pouvez configurer les images du jeu.
Téléchargez les différentes images qui seront affichées dans la grille et que les participants doivent appuyer. Les images doivent avoir un format 200x200px.
Vous pouvez maintenant ajouter un texte alternatif pour chaque image d'élément de la grille, afin d'aider les utilisateurs de lecteurs d'écran à comprendre ce que représente chaque élément.
- Le texte alternatif est lu par le lecteur d'écran uniquement si aucun son n'est configuré sur cet élément.
Cela évite de perturber les utilisateurs avec deux sorties audio simultanées (le son de l'élément + le lecteur d'écran en même temps).- Si un son est configuré, mais que le son du jeu est coupé, alors le texte alternatif sera utilisé
- Si aucun son et aucun texte alternatif ne sont fournis, le jeu applique un système de nommage par défaut basé sur la position dans la grille (ex.: "élément 1", "élément 2", ...)
Longueur de la première séquence
Comme mentionné précédemment, un tour commence lorsque le jeu active une ou plusieurs images dans un ordre aléatoire et se termine lorsque le participant reproduit l'ordre en appuyant sur les images.
Commencer avec une longueur de séquence de seulement un ou deux peut sembler trop simple au début (tout ce que vous avez à faire est de répéter la très courte séquence). Mais attention, la séquence deviendra plus longue à chaque tour.
Une fois que l'ordinateur commence un tour en activant la prochaine séquence d'images, le participant doit terminer le tour en répétant le motif d'activation des images dans le bon ordre. Si le participant répète la séquence correctement, nous ajoutons 1 point au score. Si une étape est manquée en cours de route, le tour se termine et se réinitialise et une vie est perdue... dans le mode à vies.
Générer une séquence aléatoire à chaque tour
Si le participant répète la séquence correctement, au tour suivant, le nombre d'images dans la séquence augmente d'un. Si vous choisissez d'activer cette option, la séquence sera différente à chaque fois et augmentera d'un.
Disposition de la grille
Vous pouvez décider de la position de chaque objet sur la grille. Vous pouvez modifier, objet par objet, où ils seront situés.
Panneaux
Les panneaux sont des écrans interactifs dans le jeu et sont l'un des éléments principaux du jeu. Ils informent les joueurs ou leur donnent des instructions sur le prochain mouvement à faire.
- Le panneau tutorial montre comment le jeu est joué et s'ouvre automatiquement une fois que le jeu est chargé.
- Les écrans de transition (par exemple : lorsqu'une nouvelle manche commence)
- Le panneau game over montre le score du participant et s'ouvre automatiquement une fois que le jeu est terminé.
Options d'accessibilité
Le repeat it! inclut des fonctionnalités supplémentaires pour améliorer la navigation au clavier et la compatibilité avec les lecteurs d'écran.
Toggle d'accessibilité sur l'écran de démarrage
Vous pouvez activer un toggle d'accessibilité sur l'écran de démarrage. Cette option est activée par défaut et peut être désactivée via l'option "Afficher les paramètres avancés" dans l'éditeur de jeu.
Pourquoi ce toggle existe-t-il ?
Lorsqu'il est activé par le participant, il ralentit uniquement les phases intermédiaires qui donnent des informations de transition telles que la phase d'observation, à votre tour, le temps restant, les vies restantes, ... afin de laisser au lecteur d'écran le temps d'annoncer toutes les informations.
- Elle ne ralentit PAS le jeu, donc elle n'aide pas à tricher
- Nous avons introduit cette option pour éviter de ralentir l'expérience pour tous (ce qui pourrait rendre le jeu frustrant pour tous les participants qui n'en ont pas besoin).
Contrôles au clavier
Le jeu est désormais entièrement jouable via :
- les clics souris (déjà supportés)
- les flèches au clavier
Effets sonores
Vous pouvez également ajouter des effets sonores à votre jeu :
- Musique de fond pour créer une atmosphère.
- Des effets sonores aux moments cruciaux ou pendant des actions spécifiques :
- lorsque les participants cliquent sur le bouton start,
- lorsque c'est game over et que le jeu se termine.
- Chaque image peut également avoir un son correspondant (durée maximale du son : 4 à 5 secondes).
Vous trouverez ici quelques sons libres de droits à utiliser pour dynamiser votre jeu !
Tada ! Maintenant votre Répétez la séquence ! est prêt à être joué. N'oubliez pas de le tester !
Publiez et partagez votre campagne
Le Répétez la séquence ! est responsive et fonctionne sur les smartphones, tablettes et ordinateurs. Sur un appareil mobile, le jeu a un mode "portrait" et remplit tout l'écran.
Pour assurer la réactivité sur les smartphones et les tablettes, l'intégration de la campagne doit être effectuée de la manière suivante:
- Créez un canal minisite ou iframe.
- Personnalisez votre jeu.
- Ajoutez un canal mobile.
- Utilisez l'URL intelligente du canal minisite/iframe pour partager. Pour en savoir plus, veuillez consulter Qu'est-ce qu'une URL intelligente et comment l'utiliser?
Conclusion
Dans ce tutoriel, nous avons créé un jeu Répétez la séquence ! dans Qualifio. Nous espérons que vous avez eu beaucoup de plaisir à le construire. Merci d'avoir lu, et joyeux répétitions!