A free GeoGuessr-style game, and how to make your own

Your own geography game, in under an hour

You won't write any code yourself. You'll describe the game to a free AI assistant, paste what it writes into a file, and double-click it. Then make it about your town, your holiday or your classroom.

• A geography guessing game that opens in any web browser
• Real photos from around the world, pulled from Wikimedia Commons (a free library of millions of photos)
• A zoomable world map to drop your pin on
• A score for each round based on distance, with a line drawn from your guess to the real spot
• Five rounds, a final score and a saved best score
• Your own version: a single country, your town, or your own photos

Good for: GeoGuessr fans who want a free version, teachers after a classroom geography game, and families "visiting" places before a trip.

What you need

Build it in seven steps

1. Ask for the basic game

   Copy this prompt and paste it into your AI assistant:

   Copy this promptCopy

   I don't know how to code. Please make me a GeoGuessr-style geography game that runs in a web browser.
   
   How it should work:
   - The game shows a real photo from somewhere in the world, and a world map underneath.
   - I click on the map to drop a pin where I think the photo was taken, then press a "Guess" button.
   - The game shows where the photo was really taken, draws a line between my pin and the real spot, and tells me how many kilometres away I was.
   
   Technical requirements:
   - Everything in ONE single HTML file (HTML, CSS and JavaScript together), so I can save it and double-click it.
   - For the map, use Leaflet loaded from a CDN with free OpenStreetMap tiles, and show the OpenStreetMap credit. No API keys.
   - For the photos, use the free Wikimedia Commons API (no key needed, add origin=* to the URL so it works from a local file). Pick a random city from a list of about 50 cities around the world, then search for geotagged photos near it with generator=geosearch, and use the photo's own coordinates as the answer.
   - Under the photo, show the photographer's name and the licence from the image's metadata, because Wikimedia photos need credit.
   - Don't show the photo's title until after I've guessed, because the title usually gives the answer away.
   
   Please give me the complete file in one code block, then tell me in simple steps how to save and open it.

   The AI replies with a long block of code. You don't need to read it. Look for a Copy button at the top or bottom of the code block and click it.

2. Save it and play

   1. Open Notepad (Windows) or TextEdit in plain text mode (Mac).
   2. Paste the code.
   3. Save the file as geo-game.html. In Notepad, set Save as type to All files so it doesn't become geo-game.html.txt.
   4. Double-click the file. It opens in your browser, finds a photo and shows the map.
   5. Click the map, press Guess, and see how close you were.

   No photo appearing? Check you're online, then press F12 (Cmd+Option+I on a Mac), open the Console tab, and paste any red text into the chat with the AI. Photo searches occasionally come back empty; ask the AI to "try another city automatically if no photos are found".

3. Add rounds and scoring

   Copy this promptCopy

   That works, thank you. Now please turn it into a proper game:
   - Five rounds per game. Show "Round 1 / 5" at the top.
   - Score each round out of 5,000 points: 5,000 for a perfect guess, getting smaller the further away I am (for example 5000 × e^(−distance in km ÷ 1500)).
   - After each guess, show the points, the distance and a "Next round" button. Zoom the map so both pins are visible.
   - At the end, show my total out of 25,000, a list of the five rounds with their points, and a "Play again" button.
   - Save my best total in the browser (using localStorage) and show it at the top.
   - Load the next photo in the background while I'm guessing, so there's no waiting between rounds.
   
   Please send me the whole updated file again, not just the changed parts.

   Always ask for the whole file. Then you can replace everything, save, and refresh the browser tab (F5, or Cmd+R on a Mac).

4. Get better photos

   Random photos can be maps, museum objects or close-ups of a door handle. This prompt tidies that up:

   Copy this promptCopy

   Some photos are too hard or not useful (maps, logos, paintings, museum objects, indoor shots, tiny images). Please filter the Wikimedia results so the game only uses:
   - JPEG photos at least 1200 pixels wide, in landscape shape
   - Photos whose file name doesn't contain words like map, logo, flag, plan, interior, museum, painting, sign, plaque, statue or diagram
   - If nothing is left after filtering, quietly try another city (up to 5 times), and only show an error with a "Try again" button if all of those fail.
   
   Also show a loading spinner while a photo is being found. Send me the complete updated file.

5. Make it look amazing

   Copy this promptCopy

   Please make the game look polished, like a real game:
   - Put the photo and the map side by side on a computer, and stacked on a phone.
   - Use a dark night-time map style (CARTO's "dark_matter" map tiles are free for personal, non-commercial projects and need their credit shown).
   - My pin is yellow, the real spot is pink with a pulsing ring, and the line between them is an animated dashed line.
   - Make the points count up quickly from 0 when a round ends, with a coloured bar that fills up to show how well I did.
   - Let me click the photo to see it full screen.
   - A start screen that says "Where on Earth?" with a Play button, and a final screen with a fun title depending on my score (for example "Globe-trotter!" for over 20,000).
   
   Send me the complete updated file.

6. Pick your own places

   This is where it becomes yours. Change the list to anything you like.

   Copy this promptCopy

   Please add a "Mode" dropdown on the start screen with these options:
   - World: cities from all over the world (what it does now)
   - Europe only
   - United Kingdom only
   - Famous landmarks: a list of about 50 landmarks (for example Tokyo Tower, the Great Wall of China, Uluru, Big Ben) written as their Wikipedia article names. For each round, use the article's main photo and its coordinates from the free Wikipedia API (prop=pageimages and prop=coordinates, with origin=*), and show the photo's credit
   - My places: a list I can edit at the top of the code, with a comment showing me exactly where to type place names and their latitude and longitude
   
   Also, in a comment at the top of the file, explain in plain English how I can add or remove places. Send me the complete updated file.

   Want to use your own holiday photos instead? Ask the AI: "Let me make a game from my own photos. I'll put them in a folder next to this file. Read the location from each photo's GPS data if it has it, or let me type the latitude and longitude for each one in a list."

7. Optional: Real street-level views with Mapillary

   GeoGuessr's magic is that you can look around a street. Mapillary is a free, crowd-sourced street-level photo service (owned by Meta) that lets you do the same, with no payment card.

   1. Go to mapillary.com, sign up for a free account, open the Developers page and register an application. Copy the client token it gives you (it starts with MLY|).
   2. Then send this prompt, pasting your token where it says:

   Copy this promptCopy

   I've signed up for Mapillary and have a client token: PASTE-YOUR-TOKEN-HERE
   
   Please change the game so that instead of a Wikimedia photo, each round shows a Mapillary street-level view I can look around in and move along, using the MapillaryJS viewer loaded from a CDN. Find a random image near the chosen city using the Mapillary API (images endpoint with a small bounding box), and keep everything else the same: the map, the scoring and the rounds. Show the Mapillary credit. If no image is found near a city, try another one.
   
   Send me the complete updated file.

   Keep your token to yourself. If you put this version online, anyone can see the token in your file. A Mapillary client token can only read public images, so the risk is small, but don't reuse it for anything else.

Quick fixes

The game says it's loading but no photo ever appears. Here's the error from the browser console: PASTE-THE-RED-TEXT-HERE. Please find the problem and send me the complete fixed file.

Twist it into something else

Made something fun? Share a screenshot and tag us. We feature reader projects.

You're joining real-world data into something new

A game like this joins up three free services (a photo library, a map and a scoring rule) into something new. That's what most useful software does. Once you've asked an AI to connect a map and a photo library, you can ask it to connect almost anything: weather, train times, your own spreadsheets.

What to build next