The Problem

Due to the more chaotic nature of our bullet hell game, Quantum Gladiator, we want lots of visual feedback to the player. One of these feedback loops comes in the form of a indicator that the player's battery is low. This is important to communicate to the player as their battery is the difference between game over and a win, the battery full depletes, you lose. One of the core problems I ran into while implementing the indicator was getting a working animation for it.

I wanted the icon/indicator element to flash while on screen to give more of a sense of urgency to the player. This indication would serve as a reminder to the player to find another battery and fast.  The specific issue that came with implementing it was getting the animation itself to play. Initially my logic was as follows. Off of every event tick, check the condition of the player's battery level, if the current battery level was less than or equal to 10 make the element visible and play the animation, otherwise don't make it visible to the HUD.  

I ran this logic and at 10 seconds the widget wasn't even appearing. I tried to run this logic without the animation, however, and it was appearing. The problem was though it didn't flash, less than ideal, as it didn't really visually communicate to the player any sense of urgency and served to be more confusing as to what it meant. After doing some fiddling around with the blueprint, I found that if I connected animation to the event construct, the flashing would occur. I obviously couldn't keep this functionality as that would mean an animation would be playing while the HUD widget wasn't visible throughout the entire playtime and is not in good practice of optimization. This however would serve as a hint as to why the expected logic wasn't working.

Problem Solution

After spending more time reviewing the logic I realized the issue. See, event tick was checking the condition of the current battery level and this needed to happen or else this condition would only ever be checked once. The problem with following this through to playing an animation however was it was being played every tick. Why this causes the element and the animation to be not be visible is as follows. In the animation, the color and the opacity of the indicator are decremented to 0 and back up to 1 over the course of 2 frames, to create a flashing effect. The event tick is playing this animation every tick and the HUD widget never gets a chance to enter it's visible state of the animation since it keeps starting over.

With this knowledge I adjusted my logic in my blueprint. Off of the true node of the branch condition check, I would use a Do Once node. This would ensure that the animation would only play once after the visibility was  set instead of every tick.  Additionally, this Do Once would be reset whenever the visibility was set to false for the indicator element. After implementing this logic, I had a working widget animation. In the video below the logic has been slightly adjusted to make the widget and animation visible at a full battery for showcase purposes.