ICM Week2 Assignment
a clicking game….
This week of ICM we learned animation of objects. For this week's assignment, I decided to create a clicking game. So I start withdrawing the circles. I think the target circle is best for this click purpose then I inspired by the one from the screen printing piece I did.
But I also want my circle to shrinking whenever the circle disappeared the game will end. so I created something like this
var rad = 300;
var dec = 30
var x = y = width/2;
noStroke();
fill(255,0,0);
circle(x,y,rad)
for(var i=0;i<4;i++){
if(i % 2 == 0){
fill(255);
}else{
fill('red');
}
if(rad>=dec){
circle(x,y,rad-dec);
rad -= 30;
}else{
break;
}
}
By making the circle shrinking, I added a velocity which can adjust the speed the radius of the circle base on how many time a player clicked it. And when a player clicked the area inside of it. The circle will disappear and will create a new one in a random position but its size will continue shrinking. I also added the current score and high score option to record how many times the user clicked the circle and the highest point a player has scored. I also added sound effects when user clicked the circle. It makes this game more fun. Here is the full gameplay.
I had some problems with the restart button which involved how to hide the button and show button when the game ended. The button’s built-in function does not appear in the reference section of p5. I went to ask someone with experience of p5 and he told me there is hide() and show() for buttons.
I also want to make my game more playable and I had some refinement ideas:
- Make multiple circles appear on the screen so a player can make more clicks
- A level system that will increase the number of circles appears and their shrinking speed when a player clicked more circles.
- Game end condition could be the circle missed.
- adding more sound such as background music.
This is a fun side project to do and hopefully, I can complete the refinement of the game by next week.