Create Your Own Digital Breakout Game Using Google Forms

Breakout boxes are all the rage right now.  They are a fun way to deliver content and improve critical thinking.  The one thing that drives me crazy when trying to share the boxes with all of the teachers in a school is dealing with locks.  When someone uses the locks, if they don’t keep the combination used in their breakouts, you’re sunk. I can’t tell you how many locks I’ve had to purchase because of it. This post contains some affiliate links for your convenience (which means if you make a purchase after clicking a link I will earn a small commission but it won’t cost you a penny more)! Read my full disclosure policy. 

This made me look into creating digital breakout games.  They are simple to create and there are tons of online resources to make them as inventive as the traditional boxes.  Here is an example of a digital breakout game using Google Forms as a way to introduce both staff and students to copyright and fair use.  

Easy as 1, 2, 3

Get Creative

Depending upon the purpose of your breakout, you’ll want to gather the information to use as clues.  From the information, determine which words or numbers will be used as the secret codes. You’ll do more with the secret codes later.

In this part, you need to decide how to present your information to the user.  This can be in the form of text, images, puzzles, videos and more. You can opt to just include the information directly on the web page or you can use a variety of tools to add a little fun and a bit of a challenge to your breakout.  

For this breakout, I used Thinglink as the main place to find clues. This is a super easy way to create interactive images. To do this, you add icons that serve as hotspots.  When you move your cursor over the hotspots, information appears in the form of text, links to videos, a matching game, videos, and an online poster.  The user will need to go through all or most of the information to determine the secret codes.

Hidden clues are a fun thing to add to Thinglink images.  To do this, I chose white hotspot buttons.  These buttons blend into the background and can’t be seen.  When you move over them, they reveal a text clue to help you find the answer.  

Here are the resources I used to create my clues:

Pixabay – Resource for images with a Creative Commons License

Thinglink – Creates interactive images.  You can add text, links, videos, and more.

EdPuzzle – Can be used to make YouTube videos more interactive.

Educaplay – Tool to create a variety of interactive games and activities

Create Your Locks

You will use a Google Form to create your “locks”.  There is a nifty little trick within forms to help you keep users from submitting the form until the answers are correct.  

Here’s How You Set It Up

1. Create a new Google Form and give it a title based upon the content of your breakout. (Ex. WWI Breakout, Earthquakes Breakout)
2. The questions need to be short answer and should reveal what needs to be typed in the answer box. (Ex. 5 Letter Lock – all caps, 4 Digit Lock)
3. Next, click the 3 dots next to Required.
4. Select Response validation.  This will bring up 4 boxes.
5. In the first box select Number or Text.  If number, select “Equal to” or if text, select “contains” in the second box.
6. Type the correct answer in next box.
7. The last box is important.  Be sure to type an error message in this box.  If you don’t the correct answer will appear if they don’t get it correct.
8. Select required.

When setting up your locks, be sure to let users know if they need to add the answer in all caps or lowercase unless you want that to be a part of the challenge.  If you are in a time crunch, I’d definitely add something like: 5 Letter Lock (all caps) or 5 Letter Lock (all lowercase). See my example if you have questions.

Putting it All Together

For this, we will use a Google Site.  This is simple to use and can easily handle most any external tool you wish to use.  

1. Create a Site by going to Docs, click on New+, and select Site.
2. Give your site a name in the top left corner.
3. In the Title Box, name it something like (Your name) ‘s Breakouts.  This will be your home page.
4. Click on Pages in the top right corner.
5. Click the “+” sign on the bottom right to add a new page.  
6. To name the page, give it the name that you want to call your breakout.
7. You can leave the header as it is or change the header type.  I like to just use the Title Only headers for the breakout pages.
8. Now it’s time to add your information.  Click Insert → From Google Drive.
9. Click on your breakout form and click Insert.
10. Resize it as needed.
11. Add your information.  If you use Thinglink, you’ll need to use the embed section to paste the code you got from the share setting on the Thinglink page.  You can choose images, text, or whatever you need to add your information. Simply drag and drop the boxes to place the information where it’s needed.

Once you have all of your information in place, simply publish your site and you’re ready to roll!  To share your site, click the down arrow next to Publish and select “View Published Site” to get your URL.  

Now you are ready to get started in creating your own digital breakout.  Here are some other tools to add a little more fun to your challenge:

Jigsaw Planet – create custom online puzzles

Fake Phone Text– create fake texts to use as clues

Discovery Education PuzzleMaker – creates a variety of different types of puzzles

Fake Concert Ticket Maker

Whether you decide to stick with traditional, digital or paper clues with digital locks breakouts your students will have a blast trying to be the first ones to uncover the clues.  

Want to learn more about creating breakout boxes or digital breakout games for your classroom? Be sure to check out this resource. It has tons of great information!

Want to create physical breakouts? Here is an all inclusive set to help you get started.

Have fun creating your own digital breakouts.  Be sure to share your creations in the comments. I can’t wait to see what you create!