You are browsing as a guest. Sign up (or log in) to start making projects!

History Guesser

  • 1 Devlogs
  • 12 Total hours

A geography-history trivia game where a pin drops on a world map, a year appears, and you guess the historical event.

Ship #1 Changes requested

I made a history trivia game called History Guesser. It's a single HTML file that runs in any browser.

The concept is simple. A pin drops on a world map. A year appears at the bottom of the screen. You pick the correct historical event from four options. After you answer, the game shows you a description and a fun fact about the event. You learn something even when you get it wrong.

The game has 70 events spread across nine categories. War, Science, Politics, Exploration, Culture, Disaster, Sports, Business, and a few others. There are three difficulty levels. Easy, Medium, and Hard. You can filter by category and difficulty before you start. The game tracks your score and your streak.

What I'm proud of

The map actually works. The pin lands in the right place for each event. I spent hours tweaking coordinates to get that right.

The fun facts are my favorite part. I dug through Wikipedia to find interesting details that stick with you. Little things that make history memorable.

The quit button. It took more thought than it should have. Players need a clean way to exit without refreshing the page. I added a visible button plus Escape key support. Small thing, big difference.

The design feels warm, not cold and technical. Parchment colors, a compass rose, serif fonts. It feels like an old atlas. That was intentional.

What was challenging

The map was the hardest part. I tried drawing it with canvas polygons and failed miserably. Africa looked like a blob. Europe looked like a potato. Wasted two days on that approach. Switching to a background image solved the problem but introduced new ones.

Event placement was tedious. Every pin needed exact coordinates. I manually positioned 70 events. Refresh the page, adjust by 0.005, refresh again. Over and over.

Making difficulty levels feel meaningful was tricky. I mixed obscurity with age. Ancient events are harder by default. Recent ones are easier. It's not perfect but it works.

UI responsiveness took effort. Making the game work on both desktop and mobile required careful testing. Mobile-first approach, tested on actual devices.

If you want to test it

The game is a single file called index.html. You need a map image called img.jpg in the same folder. Any world map with clear country outlines works. Open index.html in any browser. No server required. No installation. No dependencies. Just double click and play.

If the map doesn't load, check that img.jpg is in the same folder. The file name must be exactly img.jpg. Case matters on some systems. The game also has an online fallback so it should still work.

The game should load instantly. The pin should appear smoothly. Buttons respond to both mouse and touch. Everything feels snappy.

Try different category and difficulty filters. Each combination changes the event pool significantly. Easy mode has mostly famous recent events. Hard mode tests more obscure moments in history.

If you find a bug or have a suggestion for more events, let me know. I'd like to add more categories eventually. Maybe a leaderboard or timer mode. But for now, this version does what I set out to do. It makes history feel less like a textbook and more like a discovery.

  • 1 devlog
  • 12h
Try project → See source code →
Open comments for this post

12h 17m 2s logged

Dev Log

So I had this idea. I wanted to make history feel physical, like it actually happened somewhere. Drop a pin. Show the year. Make people guess. That felt more like a game than a textbook.

The first version was a disaster. I tried drawing the world map myself using canvas polygons. Two days of tweaking coordinates and my map still looked like a deformed potato. Africa was a blob. Europe looked like it had been through a war. I finally gave up and switched to a real image.

Getting the map to work took way longer than I expected. Online images were slow. Base64 was huge. SVG was a nightmare. Eventually I just told people to drop a jpg in the same folder. It’s not fancy, but it works and it’s fast.

The pin placement was its own headache. Every event needed exact coordinates. Battle of Hastings needed to hit England. Columbus needed the Caribbean. Hours of refreshing the page and tweaking numbers by tiny amounts. My eyes hurt.

But building the event list was actually fun. I dug through Wikipedia looking for interesting stuff. War, science, politics, exploration, culture, disaster. Each event needed a year, location, description, and a fun fact. I probably spent too much time down rabbit holes. Did you know Beethoven was completely deaf when he conducted his ninth symphony? Or that the Mona Lisa has no eyebrows? I don’t regret a single minute of that.

Difficulty levels were tricky. I mixed obscurity with age. Ancient stuff is harder. Recent stuff is easier. It’s not perfect but it works.

Design wise, I wanted the game to feel warm — like an old atlas, not a corporate dashboard. Parchment colors, a compass rose, serif fonts. I wanted people to feel like they were opening a book from their grandparent’s shelf.

The quit button was a small thing that took too much thought. I realized people need an easy way out. So I put one in the corner and added Escape key support. Small detail, big difference.

What I learned: the little stuff matters. A good map makes the game feel real. A fun fact turns a correct answer into something you actually remember. A visible quit button shows you respect the user’s time.

I also learned that AI is useful for grinding through boilerplate and generating ideas faster than I could alone. But the creative stuff, the polish, the decisions about what actually feels good — that’s still on me. The AI sketches scaffolding. I build the house.

The result is a game that loads instantly, works on any device, and teaches you something without feeling like school. It’s not perfect. I’d love to add more events, better visuals, maybe some sound effects. But it’s solid, it’s fun, and I’m happy with it.

If you play it and learn one thing you didn’t know before, I’ll consider it a win.

Dev Log

So I had this idea. I wanted to make history feel physical, like it actually happened somewhere. Drop a pin. Show the year. Make people guess. That felt more like a game than a textbook.

The first version was a disaster. I tried drawing the world map myself using canvas polygons. Two days of tweaking coordinates and my map still looked like a deformed potato. Africa was a blob. Europe looked like it had been through a war. I finally gave up and switched to a real image.

Getting the map to work took way longer than I expected. Online images were slow. Base64 was huge. SVG was a nightmare. Eventually I just told people to drop a jpg in the same folder. It’s not fancy, but it works and it’s fast.

The pin placement was its own headache. Every event needed exact coordinates. Battle of Hastings needed to hit England. Columbus needed the Caribbean. Hours of refreshing the page and tweaking numbers by tiny amounts. My eyes hurt.

But building the event list was actually fun. I dug through Wikipedia looking for interesting stuff. War, science, politics, exploration, culture, disaster. Each event needed a year, location, description, and a fun fact. I probably spent too much time down rabbit holes. Did you know Beethoven was completely deaf when he conducted his ninth symphony? Or that the Mona Lisa has no eyebrows? I don’t regret a single minute of that.

Difficulty levels were tricky. I mixed obscurity with age. Ancient stuff is harder. Recent stuff is easier. It’s not perfect but it works.

Design wise, I wanted the game to feel warm — like an old atlas, not a corporate dashboard. Parchment colors, a compass rose, serif fonts. I wanted people to feel like they were opening a book from their grandparent’s shelf.

The quit button was a small thing that took too much thought. I realized people need an easy way out. So I put one in the corner and added Escape key support. Small detail, big difference.

What I learned: the little stuff matters. A good map makes the game feel real. A fun fact turns a correct answer into something you actually remember. A visible quit button shows you respect the user’s time.

I also learned that AI is useful for grinding through boilerplate and generating ideas faster than I could alone. But the creative stuff, the polish, the decisions about what actually feels good — that’s still on me. The AI sketches scaffolding. I build the house.

The result is a game that loads instantly, works on any device, and teaches you something without feeling like school. It’s not perfect. I’d love to add more events, better visuals, maybe some sound effects. But it’s solid, it’s fun, and I’m happy with it.

If you play it and learn one thing you didn’t know before, I’ll consider it a win.

Replying to @Mohamed_Ayadi

0
1

Followers

Loading…