
Skittles "What's Behind the Door?"
Skittles "What's Behind the Door?"
For this memory card game, I used CSS transformations and animations to create three-dimensional doors, which swung open when clicked. The objective was to uncover matching prizes behind the doors. The game was authored in HTML and packaged as a Facebook application. After playing, users were encouraged to share an image of their prize or their “wacky” consolation prize to their timeline. I wrote all of the game logic in JavaScript, following an object oriented design methodology (using JavaScript pseudo-classes). I did not rely on any third-party libraries, aside from jQuery. I used feature detection to identify older web browsers which do not support CSS animation and 3D transformations, and replaced these effects with two-dimensional, JavaScript-based animation, to ensure the best possible experience for all users.