Creating a Sound Wave Charge Meter
|
In my last blog post, I wrote about how I animated a huge sound wave that will move over the screen and destroy any enemies that comes in its way. The attack is charged by rapidly tapping a key until the attack is ready. To show when the sound wave is ready to be launched, I have created a meter that fills up while you tap the key. I re-used the score multiplier that I wrote about a while ago, since it has been decided that it will not be used in the game. Time is very expensive right now, therefore I chose to do that. I removed all the colours, numbers and some of the white vertical lines from the score multiplier. After that, I created a three-colour gradient that I filled the meter with. I was careful about the colour choice because I wanted it to fit our game’s art style. So instead of using red at the beginning, I chose pink since we don’t have red colour in the game, for example. The gradient goes from pink to a bright blue colour. I chose the pink colour to symbolize that the charge is bad/wrong or simply not ready. When the meter builds up, the brighter blue colour tells that it is going in the right direction. This way, the player knows how close he or she is to have the attack ready without need to look directly at the meter. That makes it easier for the player to focus on other things on the screen at the same time. The blue colour is also the same as in the sound wave. To show when the attack is ready, I created a button. The button becomes coloured and sparkly when the whole meter is filled. I wanted it to have the same colour as the brightest blue, but at the same time look a little bit different from the other part of the meter so it would be easier to see. That is why I added some sparkles and gave the button some shadowing along the edge. To show that the meter is for the sound wave attack, I made a simplified icon that shows the green waves of the attack. This along with the blue colour and the sparkles makes the button look like a simplified version of the whole attack. I created the frames using a layer mask that I moved a bit with each frame. After that, I sent the frames to the programmers who will implement it in the game. The meter was made entirely in Adobe Photoshop CC.  |
