KnowGlobe is an interactive web application and game created for two classes in my second term of the D3 program at BCIT. The two classes were my second level design class and my Dynamic Content Design class in which we learned advanced JavaScript.

KnowGlobe
Educational Geography Game
Languages Used
JavaScript, HTML, CSS
Software Used
Brackets, Adobe Illustrator
Date Created
May 2018
Process
Styleguide
The first step before any coding was done was to create a styleguide which covered the theme of the webapp and created a recognizable brand. The styleguide covered the logo, the graphics, and the typography that would be featured on the app.
Prototyping
Using Balsamiq, the user interface was sketched out and tested to find potential problems with the planned sitemap. This process helped in creating a final layout for the application.
Creating Game Elements
The maps for both Europe and Asia were made using a free world map SVG which was then edited and masked to include the flags within each country. The SVG was then translated using Illustrator to make it readable code in the application.
Usability Testing
After coding a large portion of KnowGlobe, there was a class wide testing session. Each student tested each other’s applications. This step helped in any potential UI errors and crucial feedback in finalizing the application.