CréeR codEs et mots de Passe avec gEnially

Article écrit par : Patrice Nadam * Mélanie Fenaert
Première mise en ligne le 20 juin 2020
Mise à jour le 8 novembre 2021
9 recettes fait-maison

Les mots de passe et cadenas sont l’essence même des escape games. Depuis quelques années maintenant, les jeux virtuels et semi-virtuels exploitent des outils numériques permettant de simuler ce type d’étape. Cet article passe en revue différentes façons de créer ces codes et mots de passe dans une interface telle que Genially. Consultez notre menu et faites votre choix !

La complète [1] : une seule diapo avec le Gicode de S’CAPE

La nouvelle version du coffre-fort de S’CAPE vient de sortir : le Gicode vous permet en quelques minutes et en une seule diapo de configurer un digicode simple ou sur une image de votre choix, avec apparition et/ou disparition d’objet(s) quand le code est correct. De quoi simuler très simplement l’ouverture d’un coffre, le déverrouillage d’un cadenas, l’ouverture d’une porte...

JPEG - 167.3 ko

Il est ensuite possible de passer à une diapo suivante grâce à une simple interactivité. Le clavier est disponible en versions à chiffres ou à lettres.

L’historique : une succession de diapos

Il s’agit de la première méthode du point de vue chronologique, développée entre autres par les équipes de Survive on Mars et S’CAPE en 2017. Il s’agit de réaliser une série de diapos correspondant à la succession de lettres et/ou chiffres du code. On veillera à créer une seconde série de diapos permettant de simuler la frappe du code jusqu’au bout même s’il est faux... Sinon on vous garantit que certains de vos joueurs vont essayer de cracker le code plutôt que de réfléchir aux énigmes !

JPEG - 146.3 ko

Ce sont ces digicodes, inspirés de nos premières créations, que vous retrouvez dans certains modèles du site genial.ly.

À noter : cette méthode est tout à fait transposable dans Powerpoint.

La multiple : intégrer un cadenas Lockee

On adore Lockee et sa grande variété de cadenas numériques disponibles : digicode, piano, couleurs, login/mot de passe, directionnel, coordonnées GPS, schéma de téléphone, interrupteurs... Une fois le cadenas déverrouillé, le joueur peut accéder à un texte, une image, une vidéo, un son, un site, voire même un autre cadenas.

JPEG - 27 ko

Les cadenas virtuels de Lockee peuvent s’utiliser seuls (par exemple via un lien ou un QR-code), ou intégrés dans une interface via leur code d’intégration iframe fourni par le site. S’il s’agit d’un Genially et que vous voulez ainsi faire en sorte que le joueur accède à une autre page, on conseillera de pointer le cadenas sur l’url de la diapo désirée en utilisant l’outil Référence Page.

La directe : un petit script dans une fenêtre

Cette méthode créée par Stéphane Agniel est extrêmement simple et facile à mettre en œuvre, même sans avoir de notions sur le codage en javascript. Elle consiste à copier et adapter quelques lignes de code fournies dans notre article dédié dans une fenêtre interactive. Le succès permettra de se diriger vers une nouvelle url : site externe, second Genially ou autre page du même Genially (à retrouver avec Référence Page).

PNG - 4.2 ko

La détournée : avec le Couise de S’CAPE

Outil pluri-adaptable pour réaliser des quiz et textes à trous, le Couise est parfait pour créer en toute simplicité un ou deux champs à compléter, pour un login et un mot de passe par exemple. La réussite permet l’apparition d’un objet, sur lequel on peut ajouter une interactivité (pour aller à la page suivante, ou autre).

JPEG - 78 ko

Avec supplément : rendre le Genially privé

Le site permet aux détenteurs d’une licence payante (dès le plan EduPro) de rendre un Genially privé et d’y adjoindre un mot de passe. Ce Genially peut ensuite être si besoin intégré dans un autre.

JPEG - 35.1 ko

L’immersion est certainement moins grande avec cette méthode, mais elle a le mérite d’être extrêmement simple.

Depuis le mois de Septembre 2020, il est possible, même avec un compte gratuit, d’ajouter un mot de passe à chacune des pages du Genially.

PNG - 10.1 ko

La créative : un code avec du Drag’n’Drop

Pourquoi se cantonner à des chiffres ou signes alphabétiques pour vos codes et mots de passe ? Ordonner des fioles, ranger des objets, positionner des poids adéquats, brancher des câbles électriques... N’importe quelle succession d’actions peut se transformer en cadenas avec les nouveaux outils de S’CAPE [2]. Le Drag’n’drop en est notre exemple le plus emblématique.

Citons comme exemple la gagnante de notre concours de DND, Claire Dorel, avec son escape game Le défi de l’archéologue. Pour s’échapper d’une pyramide, le joueur doit replacer correctement huit statuettes dans leurs niches, ce qui déclenche le mécanisme d’ouverture de la porte. Vous trouverez de nombreux exemples inspirants dans l’article WANTED Drag’n’Drop.

JPEG - 564.5 ko

À noter : un autre outil S’CAPE permettrait de créer très facilement un cadenas virtuel via un choix d’éléments : le CRUZ.

La suggestion du chef

L’extension FELBONCHOI a été créée spécialement pour simuler l’ouverture d’un cadenas dans Genially : au clic droit ou gauche, les anneaux d’un cadenas à chiffres ou à lettres tournent jusqu’à ouverture.

JPEG - 51.5 ko

Plus d’informations dans l’article dédié sur notre site.

La bavarde : discuter avec un chatbot

Un agent conversationnel, ou chatbot, peut être intégré dans un Genially : pourquoi ne pas le détourner en cadenas numérique ? En effet, l’agent réagit à des mots-clés que vous programmez assez facilement - par exemple avec le site Snatchbot - et qui peuvent correspondre à des indices trouvés dans l’interface.

JPEG - 175.3 ko

NOUVEAUTÉS :
Pour que le chatbot soit un véritable cadenas permettant via un lien d’accéder à une autre page du Genially, sans qu’un nouvel onglet ne s’ouvre rompant ainsi l’immersion, il vous suffit d’entrer la ligne de code suivante dans le texte de votre chatbot.

Autre possibilité, on peut faire ouvrir le lien uniquement dans la fenêtre du chatbot, grâce à cette ligne de code.

La différence entre les deux lignes est la cible : target="_top" pour ouvrir le lien (la page de Genially) dans le même onglet, target="_self" pour ouvrir le même lien mais uniquement dans la fenêtre du chatbot.

Un petit exemple pour le plaisir, avec la seconde ligne de code [3].

Dans cet exemple, voilà à quoi ressemble le texte dans l’interface de Snatchbot.

PNG - 252.5 ko

Ainsi, le chatbot vous permet de simuler au sein de votre jeu une conversation avec une autre personne : le maître du jeu, une IA maléfique, ou encore votre banquier qui cherche à vérifier votre identité... Débloquer le chatbot peut constituer le final du jeu, ou délivrer un indice pour poursuivre le jeu [4]. Avec en prime une immersion renforcée par la possibilité de créer une conversation stressante, sérieuse ou carrément loufoque !

[1Oui, comme la galette.

[2Retrouvez l’intégralité de ces nouveaux outils S’CAPE pour Genially sur notre site.

[3Le nom attendu est celui du renne au nez rouge... Plusieurs orthographes sont acceptées !

[4C’est le cas dans l’escape book Traque sur le web.

Avertissement :
Les solutions développées par S’CAPE sont en Javascript. Les combinaisons peuvent être retrouvées par ceux qui auraient la patience ou les compétences de rechercher dans le code source de la page Web.