Make a digital escape room for your class with ChatGPT, Claude, or Gemini

In a digital escape room, teams open a row of locks on a phone or a Chromebook. Each lock opens with an answer: a number code, a word, a direction, or a color. The last lock shows a final code that proves the team got out. ChatGPT, Claude, or Gemini can build the whole room as one web page. This guide gives you the prompt, what to check before class, what students can see in the page's code, how to publish it and hand it out, and how to record when each team finished. Google's Forms help pages quoted were read on November 7, 2026.

Already have the file? The upload box at the top of this page makes a preview link without an account. That preview runs no scripts, so no lock opens there. Click Keep this page — free, no card and sign up, and the page moves into your account, where its scripts run.

What a class escape room needs

• 4 to 6 locks in a row. Each one is a question or a clue from the unit, and the next lock shows only after the one before it opens. Mix the kinds: a 3-digit code, a word, arrows, colors, a multiple-choice question.
• A message for a wrong answer. "Try again" keeps a team on the lock without giving the answer away.
• A final code. The last screen shows a code the team writes down or sends, so you can see who finished.
• One device per team, no accounts. Teams open the room from a link or a QR code.
• Nothing that needs the internet after it loads. If the school Wi-Fi drops mid-game, the room keeps working.

Ask the AI for the escape room as one HTML file

Paste this into ChatGPT, Claude, or Gemini, and change the topic and story lines. It asks for the whole room in one file, which is what you upload.

Make a digital escape room for my class as one HTML file, with all the CSS and JavaScript inside it.

Topic: [your unit, such as fractions, grade 5]
Story: [one line, such as "The class is locked in the library, and the librarian left 5 clues"]

- 5 locks in a row. Each lock shows a clue or a question about the topic and a place to enter the answer.
- Lock kinds: a 3-digit number code, a word, a direction code made with up, down, left, and right buttons, a color code made with 4 colored buttons, and a multiple-choice question.
- Check each answer in the page. For a word, ignore capital letters and spaces before or after it.
- A wrong answer shows "Try again" and keeps the team on that lock.
- Show the next lock only after the one before it opens. Show progress, such as "Lock 2 of 5".
- After the last lock, show a "You escaped!" screen with a final code of 4 letters, the time since the team pressed Start, and a Play again button.
- Keep progress in localStorage, so a reload returns the team to the lock it reached. Play again clears it.
- Big buttons and text that work with a tap on a phone, an iPad, or a Chromebook.
- No outside libraries, fonts, images, or sounds, so the room works offline once it has loaded. Don't fetch or send data anywhere, and don't use eval or new Function.
- Don't ask for names or anything else about the player.
- Give each screen class="screen", and switch screens by hiding and showing only elements with that class.

Give me the whole file in one code block. Under it, list each lock's answer and the final code for me.

To change the room, edit the lock lines:

• 4 locks for younger classes: “4 locks, each a multiple-choice question with 3 big choices.”
• 6 locks for a longer lesson: add “a lock whose code is the first letters of the answers to 3 short questions.”
• A picture clue: “Draw the clue for lock 3 with CSS shapes, with no image files.”

The last line of the prompt keeps a form on the page if you add one later. Convika adds the form near the end of the page in its own section. A game that hides every section, or rewrites the whole page with its script, can take the form away with it.

Check every lock before class

Save the code as a file ending in .html and open it in your browser. With the AI's answer list next to you:

1. Play through every lock. Type each answer as a student might, with a capital letter or a space at the end. Each one should open.
2. Enter a wrong answer on each lock. It should say Try again and stay on that lock.
3. Reload in the middle. The room should come back to the lock you reached. Then click Play again, and it should start over.
4. Read every question. The AI can get a fact wrong, or write a clue with 2 right answers. Fix it in the chat and ask for the whole file again.
5. Turn off Wi-Fi after the page loads, and open the next lock. It should still work.
6. Try it on a phone and a Chromebook once it's published (step 3 below). Every button should be easy to tap, and nothing should be cut off.

Time your own run. It tells you how long the lesson needs.

What students can see in the page's code

The answers are in the file. The page checks each answer in the browser, so the answers travel to every team's device with the page. Anyone who opens the page's source or the browser's developer tools can find them, even if the AI scrambled them, and can skip a lock by changing the page there.

That's fine for a class game, where the fun is in the solving. It's not for a graded test or a prize worth cheating for. For a marked quiz, use a Google Forms quiz with an answer key, as collecting HTML quiz scores with Google Forms explains.

Publish the escape room in 4 steps

1. Drop the file or paste the code

Drop your .html file into the box at the top of this page, or switch to Paste code and paste it there. You can add one .html or .htm file up to 2 MB without creating an account. Click Get my preview link. The preview is for checking the layout only: it works for 3 minutes, with scripts and forms off, so no lock opens. Never give it to teams.

2. Keep the page and play it

Click Keep this page — free, no card and sign up. The page moves into your account as you uploaded it, and its scripts run there. On the page's screen, click Open preview and open every lock once.

3. Publish it

Click Publish page. Under Who can open this page?, choose Public and click Next. The first time you publish, Convika shows Publish free, and under it Publish without the Convika bar, which opens an order for Pro monthly (1 day free with a card, then $12 a month). To publish on Free, click Publish free. Teams open a Public page without an account or a password, and it may show up in search results and in Convika's gallery. To keep it out of both, choose Private link (Pro) instead. The room goes live at an address like yourpage.convika.page, which stays the same until you click Unpublish.

4. Show the QR code

Find your address under Live URL on the page's screen, and click Show QR code next to it. The code opens large, with the address printed under it. Project it, or click Download PNG to put it on a slide or a worksheet.

Give each team the link or a QR code

• On the board. Project the QR code. One student per team scans it with the phone's or the tablet's camera.
• In your class's course. Post the address as a link in Google Classroom, Teams, or your LMS. A Convika page refuses to be shown inside another site, so an embed on a class site, a padlet, or an LMS page stays empty. Post the link, set to open in a new tab where the LMS asks. Canvas has its own steps.
• On a worksheet. Print the PNG on the team's sheet, as in a QR code quiz worksheet.

Before class, open the link on one student device. A school web filter can block a site it doesn't know yet. If the page doesn't open, ask whoever runs the filter to allow its address.

Each team's visit is a page view. Free includes 10,000 page views a month across all your pages, and a class is far below it.

QR Code is a registered trademark of DENSO WAVE INCORPORATED in Japan and in other countries.

Record when each team finished

• The finish screen. The prompt shows the time since Start and the final code on the "You escaped!" screen. Teams raise a hand and show it. Nothing to set up.
• A form on the page. On the page's screen, click Add a form to my page and choose Name, email, and message. Change the label for the name field to "Team name" and for the message field to "Final code". All 3 fields start as Required; untick it for the email field so a team can send without an address. Click Add form to my page. The form goes near the end of the page, just above the footer, in a new preview version: click Open preview, then Publish, and it goes live at the same link. Each entry is listed under Forms with the date and time it arrived, and emailed to you. Convika accepts up to 5 entries a minute and 20 an hour from one network, so on one Wi-Fi, teams that finish within the same minute may have to wait to send. On Free, Convika shows and emails the first 50 entries a month across all your forms; entries past that are saved, and Pro shows them. Test entries in a preview aren't saved, so send your test from the live page.
• A Google Form. The finish screen can open your Google Form with the team name and time filled in, and the team presses Submit. Collecting HTML quiz scores with Google Forms shows how to build that link, and what it records. A team can change a filled-in value before sending it.

The form sits at the end of the page from the start, so a team can send it before it escapes. Check the final code in each entry. A team that read the page's source could send the code early too. For a class game, that's usually fine.

A Google Forms escape room, or a page the AI made

Many teachers build escape rooms in Google Forms, one section per lock. Google's help describes the parts: Response validation on a question, with rules such as Number, Text, or Regular expression (Contains, Doesn't contain, Matches, Doesn't Match), and a “Custom error text” that responders get “when their answer doesn't follow the rules.” Sections run in order, and “Go to section based on answer” is “only available for Multiple choice and Dropdown question types.”

A Google Form is the choice when you want every submission in Google's Responses tab or a sheet. An AI-made page is the choice when you want locks that look and feel like a game.

Fix a lock without changing the link

On the page's screen, under Update from an HTML file, click Upload a new version, drop the fixed file (or choose Paste code), and click Upload as a new version. Click Open preview to check it, then Publish v2 at the same link. The QR code and the posted link open the fixed room. Publish a fix before the game starts: a team's saved progress came from the old version and may not match the new one. Updating a page without changing its link covers the details.

The next escape room. Free keeps 1 published page live at a time. One page can hold several rooms picked from a menu: ask the AI to add the new room to the same file, then upload it as a new version. A separate room is a second publish. If Convika takes it for a new version of the live room, click Publish it as another page. For a Public page, the choice is then Light ($3 a month on top of Free, for up to 5 live pages; the Convika bar stays), through Publish this page too, with Light, or Swap it in for the live page (free), which puts the old room back to a draft and stops its link and QR code. This is the rule for workspaces created on or after October 23, 2026 (Japan time). Pricing lists each plan.

Frequently asked questions

How do I make a digital escape room with ChatGPT?

Paste the prompt on this page into ChatGPT, with your topic and a one-line story. It asks for one HTML file with 5 locks, a Try again message, and a final code. Open the file in your browser and try every lock and a wrong answer. Then drop it in the box on this page, click Keep this page — free, no card, and publish it. Claude and Gemini take the same prompt.

Can students see the answers in an HTML escape room?

Yes, if they look. The page checks answers in the browser, so the answers are in the file, and a student who opens the source or the developer tools can find them. That's fine for a class game. For a graded test, use a Google Forms quiz with an answer key.

Do students need accounts to play?

No. A published Convika page is an ordinary web page. Teams open it from a link or a QR code on a phone, an iPad, or a Chromebook without signing in.

How do I know which team finished first?

Add a form to the page with a "Team name" and a "Final code" field. Each entry is listed under Forms with the time it arrived. Without a form, teams show the "You escaped!" screen, with its time and final code.

Can I make an escape room in Google Forms?

Yes. Use a section per lock, a short-answer question with Response validation, and a Custom error text for a wrong answer. Google's help says “Go to section based on answer” works only for Multiple choice and Dropdown questions.

Sources

• How to set rules for your form (Google Docs Editors Help) (read on November 7, 2026)
• Show questions based on answers (Google Docs Editors Help) (read on November 7, 2026)
• View & manage form responses (Google Docs Editors Help) (read on November 7, 2026)