Project #5 - Meteor
Click the meteor to save the city!
REQUIREMENTS
Create a program that has meteors fall from the sky towards a city
The player must click on the meteors to prevent it from taking damage
The game ends when the city runs out of health and presents the user with a score
You may change the theme and art style to anything you'd like!
STEP BY STEP
Part One - Gameplay
Setup
Create the following empty methods:
setup()
draw() --> calls update and render()
update() --> handles logic, movement, etc
render() --> sets color and draws stuff
Movement
Make a shape that starts at a random position on the top of the screen
Make the shape move from the top the bottom of the screen with a fixed ySpeed and random xSpeed. It should bounce or wrap off the sides of the screen.
Make sure all boundaries wrap smoothly
Interaction
Coder's Handbook - Mouseover and Clicks
When the user moves its mouse over the asteroid, it should be drawn in a different color.
See the
When the user clicks the asteroid, reset its position.
Add a reset() method which is called both during setup() and when you click on the asteroid. This will set the asteroid's position and speed.
Text
Add a score system - earn points for clicking asteroids
Make the asteroid's speed scale based on your score.
Add a health value to represent the city's health with a reasonable starting value
Each time an asteroid hits the bottom of the screen, the city loses health
Health System and Endgame
When the city's health reaches zero the game is over
Your asteroid should only move when the game is not over
In the center of the screen display both a game over message and the user's score
In Part One, your project is going to look pretty basic, but should have all of the core functionality of your game!
Part Two - User Interface
Images
Download a copy of the image pack or build your own
Add a background image
Replace the asteroid with an image
Tint
Use the tint() command to change the asteroid's color on mouseover
Improving Text
Think about text position, alignment, size, fonts, and color to improve text readability
Healthbar
Replace the city's health value with a healthbar. It should show the maximum and minimum. This will be covered in a class lecture.
Cursor
Use the cursor() method to change your cursor to an 32x32 image of your choice