Insight #4 – Lasers & Animation

As explained in Insight #2 – Iteration, in our adaptation of the Behemoth game concept we decided on a military sci-fi setting with dystopian and cyberpunk elements through an arcade art style. Having this as our aesthetic cornerstone, we gravitated towards energy fields and lasers when we designed the visual representation of the ship’s dynamic elements; for example, we replaced the original explosive cannonball-like projectile with a powerful energy burst akin to that of an ‘energy attack’ as seen in anime and 2D fighting games.

Behemoth-AlphaLaser-Blog

 

The original mock-ups and placeholders for the lasers were deemed good at the beginning of our production, but after we had a lecture on sprite sheet creation and animation with Fred Ström (lead animator for Pixel Ferrets) I showed him our progress and got some really helpful feedback.
Our main issue was not having the same palette for all energy types, this made the laser look solid or water-like according to testers and internal feedback when considered side by side with the shields. Thanks to Ström’s advise we created a common colour-scheme with different temperature shifts and a dramatic increase in brightness for the center-most parts of the lasers. This was first applied to the power-up shockwave.

Powerup-Shockwave-blog

The animation process for the game began shortly thereafter, so updating the assets was made a priority in order to not waste time animating placeholders. The shields were the first to be animated with a simple squash and stretch effect as an early animation test, which proved to be quite effective in conveying the pulsating nature of the energy shields.

After that I moved on to animating the Behemoth’s cannon, a lengthy and complicated procedure that ended up serving as a personal introduction for how to plan ahead and have the rest of the team be aware of the logic that goes into the different pieces that compose an elaborate animation.

The Behemoth’s cannon is fictionally composed of two independently moving pieces: The base, and the barrel. This meant that I needed to make sure all independent sub-pieces were properly labelled and followed through during the whole cycle, keeping track of timing, opacity and position of each individual effect. Photoshop’s animation tools proved not to be well suited for this level of complexity, so a whopping total of 32 hours went into creating the two animation cycles we needed for the cannon and turning them into usable sprite sheets.

BigLaser-GIF-Blog

In hindsight, several steps could have been taken in order to ensure a smoother development for this animation. First and foremost, the fact that I had no prior experience with creating animations and sprite sheets that had to be implemented later made it so that my workflow was very good for me as an artist, I had everything separated in layers so that I could edit any small detail easily and not have to re-do the entire animation, but it became a nightmare to try to explain how the different layers were timed and stacked upon each other in the engine, leading to the deletion of all first-wave sprite sheets.
After sitting down and deciding with the programmers how we could implement them in a way that made sense and would not have us sitting down for days just to get one animation going I ended up flattening most of the animation to have the timings already present on the sprite sheets themselves. This meant we lost the possibility to easily fine-tune individual assets such as the particles building up on the side of the cannon or the recoil pattern, but made it so that we only had 4 sprite sheets instead of 13.

So in the end we managed to iron things out. We had a working animation cycle for all assets in our game, and a very satisfying pulsating laser that unfortunately no one has seen yet in-game, as we did not manage to implement it in time for the Beta playtesting session.

About Roberto Marcos Söderström

2017 Graphics