geoMaster

Main Page
Country Mode Page
Flag Mode Page
Capital Mode Page
Guesser Mode Page
Novus AI dashboard

About

geoMaster is a time-based geography quiz game that tests your knowledge of countries, flags, capitals, and world facts with 4 exciting modes. The four modes are:

Country Mode: Test your ability to match country names with their flags. You will be shown a country name and must select the correct flag from four options.
Flag Mode: Identify countries from their flags. A flag will be displayed and you must choose the correct country name from four options.
Capital Mode: Match capital cities with their country flags. You will see a capital city name and must select the flag of the country it belongs to.
Guesser Mode: Use multiple clues to identify countries. You will be given facts including population, GDP, capital city, and beer consumption to deduce the correct country.

How we built it

I first prototyped it using the meDo.dev Platform. Under the hood it is powered by react, tailwind and typescript. I then simplified it to use only html , css and javascript and then deployed it to vercel.
In my initial design using the medo.dev platform, I first provided the game mechanics and what the four modes would be. Next I provided data about the different countries. Lastly, I provided some skeleton code to get the look and feel I wanted. I also selected the pixel style when prompting. Based on this information, I then ran the prompt and it generated the game. I did a quick walkthrough first to test key information. I then decided to make some updates.

Changed key texts
Add reset and home buttons
Add an about section
Add accessibility checks

I then noticed I did not like using react and tailwind for the app as it became quite bloated. I then redesigned the app from the ground up to use only simple html, css and javascript. It still kept the same functionality but it was less bloated and easier to use. Lastly, after completing the second build I then integrated the novus.ai information to the app