Simple Video Game - Catch the Boba! (Process Log)

Entry One: Brainstorming// Contextualization 

Initial Idea: 

Notes: 

Entry Two: Finalising Idea and Illustration

Initial idea modified: Instead of an avoiding game, it will be a catching game.

Entry Three: First Experimentation in P5.js

To make this game I organise my code to 3 functions:

• function firstScreen() - to set up the home page
• function startBoba() - game program that controls the boba and user interface
• function finalScreen() - the "Game Over" screen, that loops back to the first screen. 

The First Screen designed to greet the user to play the game. It also includes a mousePressed() command so that when the user press the screen the program guides them to the second screen, which is the game portion. The code bellow is how I made the first screen. 

The second screen includes a set of "if" functions that allows the user to play the game. Using the "if" function to create a parameter to let the boba disappear once in contact with the drink. The code bellows shows how the "if" functions are used. 

The third screen will appear when the user fails to catch the boba, it will show the final score and allow the user to replay the game by clicking the screen. This action is achieved by using the code bellow: 

The last two function is the mousePressed() and reset() function that allows the user to start the game by clicking the screen and control sound effects, and the reset() function is used to control the score and speed of the boba. For visuals, the image bellow is a screenshot of the code. 

Final Result

Sources: 

Sound effects: http://www.wavsource.com/sfx/sfx.htm

Background music: https://starfrosch.com/hot-111/royalty-free-music/kawaii/ (Colors by Midori)

Graphic Inspirations: Barbie's Dream House, Harajuku

Context:
- http://www.bubbleteasupply.com/bubble-tea-history
- https://savageminds.org/2014/09/24/the-semiotics-of-bubble-tea/