WIKIgames

Space Invaders
Snake
Matching Game
Popup Menu

What it does

We created a google chrome extension that turns any Wikipedia page into an arcade game. There are three games available: Snake, Space Invaders, and Matching Game. Every Wikipedia page leads to a unique game based on the images and locations of the hyperlinks. Upon the game's completion, the user can play again or resume their Wikipedia browsing with no interruptions.

Snake Snake interacts with the Wikipedia page by turning the hyperlinks into food for the snake to eat. The boundaries of the snake game are determined by the Wikipedia page layout. The game is won when the snake eats all of the Wikipedia links. The snake only has three lives, so the user should try to avoid crashing into the walls or the snake's own tail.

Space Invaders Space Invaders interacts with the Wikipedia page by turning the links into enemies. The user must shoot at the invaders as they move down the screen before getting destroyed by their attacks.

Matching Game The Matching Game extracts images from the Wikipedia page and puts them on tiles to be matched. Win the game by matching tiles and clearing the screen.

How we built it

We built our Chrome extension using mainly Javascript. Our 3D graphics were created using THREE.js, and our animations were made using GSAP (GreenSock). We also used HTML and CSS for the layout and popup menu.

Challenges we ran into

This is the first time we have made a Chrome extension, so a major challenge was researching what was possible. We also didn't have any experience with THREE.js or GSAP so it was difficult getting started. The logic of some of the games was difficult to implement (e.g., collision detection for Snake and Space Invaders).