Inspiration

Gamification is a popular concept that helps connect students to educational facts through their love of games. QuizInvaders is inspired by Space Invaders, a popular 1970s arcade game, and Quizlet. Currently, I am taking Spanish 101 as required by my language requirements at SUNY Oswego, so I thought this would be a great way to inspire myself to memorize vocabulary.

What it does

QuizInvaders is a matching shoot 'em up video game where the user has to match the term with their vocabulary. It can be used to match any two terms together, but for demonstration purposes, I am using it to match Spanish words with their English translation.

How we built it

QuizInvaders is made completely on plain HTML, CSS, and JavaScript. No frameworks have been used.

Challenges we ran into

One of the main challenges was collision detection. For a strange reason, the left side of any text would not collide with any of the projectiles. After adding a collision box, I realized the collision box started from the center of the word rather than the left edge. After translating the collision over, everything worked smoothly.

What we learned

JavaScript can be tricky with its error handling and requires a lot of out-of-the-box manipulation to make things work. While that can be nice for some developers, I do not particularly enjoy having to mess with different components to make a new, simple change. This was a fun way to affirm my belief that I do not like JavaScript for anything that is not related to web design.

What's next for QuizInvaders

If I were able to allocate more time towards this project, I would want to add

  • HP System for the User
  • Different stages depending on different sets of vocabulary
  • Sound effects

Built With

Share this project:

Updates