Bubble Trouble is an arcade mobile game, where you play as a tiny crab. Use your claws to bounce off bubbles coming out of underwater pipes to pop away the enemies invading the ocean. Fight off against a variety of sea creatures, including squids, angler fish, and even a shark! Defeat all of the enemies in a wave to fight off the boss, before progressing to the next level. Bubble Trouble is a bite-sized, fun gameplay experience where your crab must defend itself at the bottom of the ocean.
This is a selection of the UI systems that I created for Bubble Trouble, designed in Photoshop. I designed a world selection screen which updates based on the worlds unlocked in the game, an animated motion graphic for the wave banner when players reach a new wave in a level, and a How To Play infographic teaching players the objective/controls of the game.
WORLD SELECTION SCREEN
A menu displaying the levels which players can select from. When players start the game, only World 1 is selectable. Worlds 2 and 3 are locked until players defeat the Shark boss in World 1. Defeating the boss unlocks the icon, allowing for World 2 and 3 to be playable.
HOW TO PLAY INFOGRAPHIC
A user-friendly, minimalist infographic teaching players how to play the game and the controls, accessed from the How to Play button in the Title Screen.
WAVE BANNER MOTION GRAPHIC
A motion graphic with an animated banner indicating to players the current wave of the level they are on. The banner gets animated using the built-in Animator component in Unity, and a new banner appears every time players reach the next wave in the level.
BOSS HEALTH BAR
A stylistic meter indicating the health of the Shark Boss, which appears during the Boss Wave. The health bar displays the current health value of the Boss based on the value of UI slider this health bar gets attached to.