HOW TO CREATE A DIGITAL ESCAPE ROOM
Escape rooms are a fun adventure where you solve puzzles to escape from the room in a short amount of time.
I love creating physical escape rooms in my classroom. They are fun and they get the students up and moving in the classroom.
However, there are a few drawbacks to physical escape rooms. I have large classes, so usually I need two sets running at the same time. Even with two escape room sets, not everyone will solve every clue.
My solution: digital escape rooms! Even in a class of 30, students can work individually or in pairs and they have the opportunity to solve every problem in the escape room. This makes them great for introductions to units or a review at the end.
At first glance, digital escape rooms (also called digital breakouts) look daunting to create. Hopefully, this post will show you that in just a few steps, you can create your own digital escape room!
A 5-step example: How I made this Halloween-themed digital escape room
To help you see how digital escape rooms are really created, I’ll show you how I made one. Below are step-by-step instructions, complete with the thought process I used and decisions I made during creation. These steps come from making this Tech or Treat Digital Escape Room.
1. Write your prompt
You need a good story to hook the audience. When you go to a physical escape room, they set up the situation with a story or information at the beginning. The purpose of this Halloween themed digital escape room was to share some tech ideas with my staff in a fun way.
So I wrote an introduction to tell my audience what was happening:
“Double, double, toil and trouble. I’ve dropped the keys to my broom in the bubbles. If I don’t find them, the keys will dissolve, but you can help me with riddles to solve. Click around, don’t be scared. I won’t turn you into a frog, but maybe a bear.”
2. Create your clues
Determine how many and what kind (number, word, etc.) of clues you want. Since I created a technology breakout, I knew my clues should lead people to (hopefully) new technology ideas. So I started brainstorming.
During this step, I also created all of my clues. Some are in Google Slides, Docs, Jigsaw Planet, etc. I keep all of these in a folder in my Google Drive so everything is together.
Here are the clues I used for my Halloween themed digital escape room:
- To introduce Wakelet – a link will take teachers to my public Wakelet profile so they can see the boards I have created and share. CLUE: WAKELET
- To show Google Translate in a Doc – a link will take teachers to a doc in another language but with an animation that shows them how to translate the doc. The translation will give them the clue. CLUE: SWEET
- To introduce genia.ly – a link will take teachers to a created Genial.ly presentation. The clue will be included in the presentation. CLUE: 1031
- To show a fun Google Search Atari Breakout – Create a puzzle at jigsawplanet.com and when put together, it has instructions on how to search Atari Breakout. CLUE: ATARI
- To introduce “hidden word” in slides: a link will go to a slide where you move the magnifying glass to see the clue. It will also go to a blog post on how to create your own. CLUE: MAG10
- Distraction/fake clue – one link will go to a fake iPhone message talking about Slidesmania
- Distraction/fake clue – one link will go to an animated gif of a bubbling cauldron
Here is a Wakelet collection with even more clue making resources.
3. Create your image(s)
I almost always have an interactive image that I create in Google Drawing. We plan to put all of this in a Google Site at the end, and you can easily import a Google Drawing and keep the “hotspots” active this way.
Open a new Google Drawing and start creating your scene. It can be as easy as a single image (the reindeer in this Reindeer Games digital escape room), or as fancy as a full scene (like the image below).
Once your image is created, you need to link your clues to each object. I have 5 clues, so I linked it to the window, broom, cat, book, cauldron, and one of the flasks.
You can make anything you added to your image clickable as a link! To do that: First, click on the object you want to link (in the example, I clicked on the window), then click on the link button and paste the link to the clue. Continue this process until you link to all of your clues.
Some breakouts may have more than one image. In my trianglesonly.com breakout game, I had multiple pages on the side, so I repeated the process for each image I created.
4. Create your locks
This step uses Google Forms. Create a new Google Form (I keep everything for each escape room in one folder). You want to use response validation (check out this video for a walkthrough on how to add it) so they have to type in the correct clue. You also want to make the question required.
For number locks, I use the number is equal to setting then type in the number you want. You can also type in a custom response if they get it wrong. For a number, I usually just use “try again”.
For letter locks, you will select text contains. Forms are case sensitive so my clue usually directs them to capital or lowercase letters.
Continue this process until you have all of your clues entered.
I like to include a special message or image once the person “escapes”. To do this, create a new section in your Google Form.
On this new page, you can post a message or an image congratulating them on escaping.
5. Create your Google site
In my opinion, this is the most exciting part of the process. This is when everything you have created comes together as an escape room.
Go to sites.google.com and click the plus sign in the bottom right corner.
You will get this page to start with. Title your site so you can come back to it later. You can change your theme, colors, and fonts on the right side. Play with it until you have exactly what you want.
I inserted a text box and added the introduction that I wrote earlier.
Next, I inserted the Google Drawing using the insert from Drive button.
You can use the corners and drag your image to be as large as you want. I do the same for the Google Form. Sometimes I position them side-by-side, other times I position them with the Form below the image. Use whatever works for you and the image(s) you have created.
When you are ready, hit the publish button. Don’t forget to go through the Escape Room yourself and make sure everything works as you want. You can click the link button at the top right on the toolbar and get a code that you can share. When I create these for students, I post that link in Google Classroom.
That’s it! Now you’re ready to get started creating your very own digital escape room. Please share any games you create with us using the #Ditchbook hashtag.
Use this planning guide to create digital escape rooms easily
Need some planning space to create your own digital escape rooms? You’re going to LOVE the planning template we’ve created that you (or even your students) can use!
Use the embedded guide below OR click the button to get your own copy. It’s a versatile Google Slides file. You can download it as a PDF or PowerPoint. You can print it out. Or you can make your own copy to fill in digitally!