Introduction: Digital Escape Rooms With ThingLink & Google Forms

By
About: Crafychemist and mathemagician extraordinaire. Igniting that spark in STEAM education one project at a time.

I 💖 puzzles! Most recently I've enjoyed The Enigma Emporium's post-card based mysteries and Escape from Quarantine's fundraiser for Food Banks Canada! My favourite puzzles are the ones that are just frustrating enough, and leave you with a sense of satisfaction when you figure it all out!

I've set up physical escape rooms & lock boxes in my classroom before (check out Breakout EDU for ideas), and it's always an engaging change from the everyday routines!

Recently, 2020 brought on a new set of challenges, so I created two end-of-unit digital escape rooms for my high-school science classes to review some of the course content:

  • Missing?
    • Physics Topics covered: Circuit diagrams, Power & Cost calculations, Ohm's Law, Analyzing Parallel & Series Circuits
  • Escape the Lab!
    • Chemistry Topics covered: Lab equipment & safety, Element symbols & names, , Atomic Theory, Physical & chemical properties

If these two examples have inspired you to create your own digital breakout room, this Instructable is a collection of the many, many resources, tips and tricks I used to build them.

Notes on link sharing/access:

    • Triple-check if your gmail account is restricted to sharing files/links within a certain domain! Depending on the settings, you may have to add specific gmail accounts (most restrictive) or set up sharing so that anyone with a link can access the files (less restrictive but still requires the user to log using a gmail account if you want to make copies of the puzzle files).

Notes on game-play:

  • For the optimal experience, I recommend using a laptop with the sound on. A mouse will make things less annoying, but it is not necessary. If you get any errors about access, make sure you are signed into a gmail account.
  • You may choose to work in groups. If you do, I recommend:
    • 💡 Have one person in charge of submitting the Google form. Keep the Google Form open in a separate tab as you explore. If you close it, you will lose all your work.
    • 💬 Set up some way of communicating with your group members. Video or audio. It will help if you can talk to each other

Supplies

  • ThingLink - Create interactive images, videos & 360⁰ media
  • Google Forms - Create the digital breakout form
  • Google Slides - Create the clues with embedded videos, audio, etc.
  • Optional: Google Street View App from Play Store or App Store - Make a custom 360⁰ image. You will also need a photo-editing program to resize the image for ThingLink (e.g. GIMP)
  • Recommended: People to play-test your escape room and give you feedback
  • Mandatory: Creativity!!

Step 1: Setting the Stage & Brainstorming Puzzle Ideas

Your digital escape room can be as straightforward or as complex as you want it! The general steps are:

  1. Create an interactive image or video with ThingLink
  2. Create the breakout form in Google Forms

  3. Create the clues and puzzles in Google Slides

Build your escape room around a theme to hook your audience and give cohesiveness to your puzzles! If you are looking for some inspiration, check out the ThingLink Image library or some of the digital escape rooms or resources in the links below:

Now ask yourself:

  • Who is your audience? What prior knowledge do you expect them to have?
  • Are they going to work individually? In small groups?
  • How many puzzles do you want?
  • Are there specific clues/types of puzzles you want to incorporate?
  • How many "rooms" do you want?

Your digital escape room will naturally evolve as you build it. I tend to have a working copy of the Google Form and the individual puzzle going and populate the ThingLink simultaneously.

Step 2: How to Use ThingLink & Create a Custom 360 Image Using Google StreetView

ThingLink allows you to easily augment images and videos. Here's a quick demo on how to create and share a ThinkLink of Angel's Landing in Zion National Park.

  1. Click CREATE to upload an Image, Video, 360⁰/VR Image or 360⁰ Video.
  2. Click ADD TAG and choose from:

For more information on tag types, click here. You can change the image and colour of the tag, or upload a custom image. I use the text & media tag to embed links to the puzzles in Google Slide.

I created a custom 360⁰ image for my chemistry breakout room. ThingLink will only work with:

  • An equirectangular image with an aspect ratio (the ratio between the image's width and height) of exactly 2:1
  • A maximum of 8192 x 4096 pixels

I used Google Streetview and this tutorial by TechAngel to capture my image. For more information on capturing 360⁰ images for ThingLink, click here.

Once you have your image, you can create an equirectangular image with the correct resolution (8192 x 4096 px) & aspect ratio (2:1) using a photo editor like GIMP using the following steps:

  1. Go to Image > Scale Image > Width: 8192 px > Scale. This will preserve the full horizontal image for the 360⁰ effect.
  2. Go to Image > Canvas Size > Height: 4096 px > Resize. This will add a white bar along the bottom of your image for the 2:1 ratio. It will not be visible in the 360⁰ image.
  3. Export as a jpg file and upload to ThingLink as a 360⁰ /VR image. If you get any error messages, check your aspect ratio and resolution.

Step 3: Creating the Digital Locks With Google Form & Response-Validation

The digital "locks" are created using Short Answer Questions and the Response-Validation within Google Form. I typically use:

  • "Number" and "equal to", and
  • "Text" and "contains" (however if a student puts in ABCD but the answer is really BCD, Google will say it is correct because their answer contained the correct one)

The response-validation is case-sensitive so include any specific information in the question descriptions (e.g. No Spaces, ALL CAPS, First Name only, U=Up, N=North, R=Red, etc.)

Some ideas:

  • Alpha Codes: ABCDE
  • Numerical Codes: 1234
  • Colour Codes: ROYGBIV
  • Symbols: @&%(
  • Directional codes: U/D/L/R or N/E/S/W

Mark all questions as Required. If the wrong code is entered, you can enter a custom error code (e.g. Try again!)

If you want additional clues to be unlocked only after a previous puzzle is solved, you will need a separate Google Form (e.g. the Phone in the Chemistry Lab). You can include a link to the next clue in the Confirmation Message under the Settings. Unfortunately, you cannot include an image or file directly, but you can add a link to a Google Slide, website, video with the appropriate information.

For more information about Response Validation and Google Form, check out: Digital Escape Rooms using Google Forms

Step 4: Creating Your Puzzles With Google Slides

I used Google Slides to design the puzzles because you can have multiple pages, and embed videos, audio clips, and animations to create interactive editable slides. This is similar to an interactive digital notebook or editable PDF. For this example, I will go through how I made the Chemistry Math Square in the images above:

  1. I used Puzzlemaker Math Square to generate a Math puzzle where all 9 digits are uniquely placed in a grid. The order of these digits is then used as one of the digital locks.
    • You could save this image and upload it directly to ThingLink but I wanted to have some slides people could manipulate (like this crossword puzzle).
    • Note: You will be prompted to sign into a Google account to make a copy of editable files. If you don't want to require users to sign-in, you can leave all the Slides in Present/View mode. The version of the escape rooms in this Instructable uses Present/View mode for many of the editable slides I had in the original version.
  2. I started by creating a master copy of my puzzle and included any non-editable text, tables, pictures or information. Do not include any clickable links, videos or editable items at this point. When you are satisfied with your puzzle, download a copy using File > Download > PNG Image. This image will form the background of your editable puzzle slide and ensures nothing will be accidentally moved/deleted.
  3. Create a new Google slide and set the image you created as the background using Slide > Change Background > Choose Image. Now you can insert editable textboxes, and embed videos, audio clips or links.
  4. Share the file by choosing Anyone with the link and copy the sharable link. Delete the last section of the link that looks like this: /edit?usp=sharing and replace it with:

  5. Copy and paste these links into the ThingLink tags in Step 2.

Sometimes I come up with the code first and try to find a puzzle to encrypt it; other times I have a really cool puzzle idea and I try to come up with a code. Some ideas to get you started:

  • Directional Codes: mazes, provide a map and tracing the correct path based on the order of location visited or a schedule of appointments
  • Alphanumeric Codes: highlighting specific boxes in a Sudoku puzzle, Morse code, musical notes, coordinates from a graph/Cartesian plane, fill in the blanks, ciphers, musical notes
  • Matching or Multiple Choice Quiz: the answer key is the code (e.g. BCDAB)
  • Putting things in the Correct Order: the steps of a lab procedure, technique or recipe, steps in the Carbon cycle, major historical events of a historical events or in a book

Time to let your creativity shine!!

Step 5: Play Testing, Hint System & Next Steps

These digital escape rooms were designed to review course content, and present some cool extension material. Some of the puzzles are quite challenging so I didn't impose a time limit. I highly recommend having some people play test your escape room to work out any kinks, give feedback on wording and directions, and check for broken links! You can always add clarifying descriptions in the Google Form, add reference material in the Google Slides, and red-herrings throughout the ThingLink.

When you are ready to share your escape room, click on the Gear for Settings. I use the Unlisted Privacy Setting.Then click on the blue Share button. I use the Share Link option. Feel free to choose Privacy Setting that suit your personal needs.

Hint System:

  • I set up a Gmail account with an Automated Reply/Template based upon a Subject Line Filter. The subject line must include the correct key words to unlock a hint. For more info, click here.
  • I also ran a couple of real-time game-master sessions using Google Chat where individual groups could tell me what they found, where they were stuck, and offered more specific guidance.

What's Next?

  • Some sort of ranking? Right now I just know who was able to escape but I don't know how long it took them. You could impose a time-limit on the Google form using something like timify.me.
  • Create a virtual dissection with embedded Google Form Quizzes? You could use ThingLink's Tour to lead to different images or organ systems and embed videos, additional information or assessment questions.
  • Create a virtual scavenger hunt, or tour? Or have your students create their own escape room or interactive image.
Puzzles Speed Challenge

Participated in the
Puzzles Speed Challenge