Shopee Bubble Game Rules/Design – HackMD

# Shopee Bubble Game Rules/Design
###### genre: `gamification`,`arcade`,`mobile games`,`shopee`,`puzzle`

> Here’s where I’m going to sum up the basic rules of the bubble game.
> Please comment things you guys want me to elaborate

## :thinking_face: What is Shopee Bubble
Shopee Bubble is one of the games released by the e-commerce organization shopee indonesia. It is released as part of Shopee Games Library alongside Shopee Candy, Shopee Bubble, Shopee Tanam, etc. Unlike other games in the library, this game encourage frequent play/session and it’s shown on the game design itself.

## :brain: Game Rules
### Part 1: General Gameplay Loop
A gameplay loop consists of a cycle of actions that you repeat over and over within a game. As for Shopee Bubble the game loop is simple since the game is aimed for casuals.

![General Gameplay Loop](https://i.imgur.com/0OmkmG7.png)

– Choose Level:
– There’s currently 995 levels currently exist as of right now in the game (More will be released soon)
– It’s presented in a path reminiscent of candy crush saga’s UI, showing stars which shows how well you finished the level.
– Levels are not randomized

– Throw Matching Colored Bubble:
– Once you get in the level you are given the task to throw matching colored bubbles to the the arranged bubbles above the player
– If it fits a certain criterie it will destroy the colored bubbles adjacent to it, Will be explained further in the next section

– Destroy All Bubbles:
– The goal of the game
– Will show the result of the performance

– Level Finish:
– Player is rewarded something (Diamonds, Powerups, Etc) that can be used or exchanged in the game
– You are given a choice to continue to another level or back to menu to either browse or choose a level
– In the game menu, you can decide to choose levels, complete missons, and exchange rewards

– Outside main loop:
– Shop:
– Exchange diamonds obtained throughout the game for vouchers, discount, etc.
– [To be Put]

### Part 2: Gameplay Elements
<img src=”https://i.imgur.com/Wdb0d38.jpg” alt=”drawing” width=”200″/>

– HUD:
– On the 1st column is a button to exit the level
– On the 2nd Column is shown the stars (which shows how well you finish the level) and the score accumulated throughout the level
– On the 3rd column shows how many bubbles do you need to destroy to finish the level
– On the rightmost column is a button to mute the game music/audio

– Bubbles:
– Puzzles consists of pre arranged bubbles that you need to destroy
– In the game you have limited amount of bubbles that you can throw, you can switch the color of the bubble so that the switched color will persist the next throw until thrown
– It’s not needed to aim the bubble, just tap where you need the bubble you need it to be in and it will automatically throw it there.
– Where you can throw is determined by the game:
– You can only throw the bubbles which is possible to reach within 1 bounce
– when the bounce used is determined by how bubbles are currently positioned on the current state of the level
– The bubble and adjacent bubbles will be destroyed if it’s part of the matched color (below is how it works in pseudocode)
“`
ThrowBubble():
CheckColors() # Check adjacent bubbles matched the color
# if there’s at least 3 match in total
for bubble in adjacentBubbles:
if bubble.color same as ThrownBubble.color:
destroy.bubble();

wait(until all bubbles is destroyed)
return
“`
“`
destroyNoBomb():
for bubble in adjacentBubbles:
if bubble.color same as currentBubble.color:
destroy.bubble();
# Other bubbles will do the same if this is executed
“`

– After all the bubbles is done destroying, the bubbles not linked to the “ceiling”, the bubbles will fall (Count as destroyed) and gives bonus point to the player

> I have some speculations that this game is created using PhaserJS since it loads very fast and doesn’t use any loading screens (Phaser JS is open source HTML 5 Game Framework).
>
> _also found old job listing of shopee games showing that they used phaser for their game_