Test your math skills with this mobile friendly Crystal Collector Game!
Design Tools:
- Adobe Illustrator: Graphic assets
- Adobe Photoshop: Graphic assets & gifs
- Adobe After Effects: Background video
Development Tools:
- Framework: Bootstrap
- HTML
- CSS
- Javascript
1. When the game begins you will be given a magic number between 19 - 120.
2. You will also receive four crystals, each with its own hidden value.
3. Try to match the magic number by clicking the crystals. This will reveal the crystal's value and add it to your total.
4. If your total is the same as the magic number you will win that round.
5. If your total is not the same as the magic number you will lose that round.
6. After the game is over you will be given the option to play again. Each additional round will assign new values to the magic number and crystals.
Crystal Collector
├── assets
│ ├── css
│ │ ├── reset.css
│ │ └── style.css
│ ├── images
│ │ ├── background
│ │ │ ├── active_game_background.mp4
│ │ │ ├── crystals.mp4
│ │ │ ├── micro_carbon_@2X.png
│ │ │ ├── micro_carbon.png
│ │ │ └── readme.txt
│ │ ├── click_crystals
│ │ │ ├── crystal_1.png
│ │ │ ├── crystal_2.png
│ │ │ ├── crystal_3.png
│ │ │ └── crystal_4.png
│ │ └── game_over
│ │ ├── loser
│ │ │ └── game_over.png
│ │ ├── winner
│ │ │ ├── stills
│ │ │ │ ├── crystal_winner_1.png
│ │ │ │ ├── crystal_winner_2.png
│ │ │ │ ├── crystal_winner_3.png
│ │ │ │ ├── crystal_winner_4.png
│ │ │ │ └── crystal_winner_5.png
│ │ │ ├── crystals_winner_gif_2.mp4
│ │ │ └── crystals_winner_gif_3.mp4
│ │ └── crystal_winner.mp4
│ ├── javascript
│ │ └── game.js
│ └── sound_effects
│ ├── button_click.mp3
│ ├── crystal_click.mp3
│ ├── lost_game.mp3
│ └── won_game.mp3
├── index.html
└── README.md