Categories
Animation Blog

Animating the Characters

After researching the fundamentals of traditional 2D animation, I began the first drafts of our character animations. I started off with Star’s punch/hit sequence then slowly moved on to longer sequences. I have uploaded these animations here as GIFs – please click the images to view the animation fully.

The punch was fairly simple to animate, I found that having no in-betweens before the intial punch makes the sequence very responsive to player feedback and it recieved positive feedback from my partner’s tutors when they began playtesting.

I followed a similar technique with the rest of Star’s animations, keeping them snappy and not drawn out which was important for both rhythm and fighting games. I didn’t struggle much on Star’s animations because of how little frames I had to draw, and these ended being the animations that were most responsive and effective according to the game design tutors.

After completing the drafts, I proceeded to line and colour each frame. This took a lot of my time. I wanted to shade and add highlights to the animation in the beginning to make it look as good as possible but at this point I felt that the most I could do was get it to a base coloured stage. I was told by my tutor that my vertical slice didn’t need to look finished or even coloured, which made me feel a bit relieved but I was still disappointed that I couldn’t achieve my original vision for how I wanted these animations to look.

When starting Ashton’s animation, I wanted to show the weight of the mace/flail in the animation. I thought this would make it easier for the player to see the attack coming since the heaviness of the weapon would make the attack slower. However, this sequence later looked awkward when implemented into the game and it was actually quite hard to knock back with Star’s punches because my partner found it difficult to code it in time with the beat of the music, so I went back to this sequence multiple times drawing different attack patterns.

At first I just tried to make the animation faster to make it easier to implement into the game, but at this point my partner recieved feedback from playtesters and they kept asking if there was going to be a second enemy attack – something I didn’t expect to have to do. So I decided to scrap this attack animation and make a different one that can chain into a second attack.

I kept some frames from the previous animations but added a second attack chained at the end of the sequence for a two-hit strike.

Unfortunately, none of these attacks made it into the final version of the vertical slice. We ultimately found that it looked too unpredictable and I while I thought it was good enough to work at first, I ended up thinking it looked sloppy during implementation and playtesting.

Because of this, I made a change to Ashton’s weapon and made it a regular mace instead of a flail because the delayed animation of the swinging flail was something I didn’t have time to figure out, and so I went for something that was easier for me to animate. My partner also suggested that I limit each basic sequence to 7 frames so he could time the attacks more accurately and give him more anticipation frames to indicate when Ashton is going to attack, so I decided to add a wind-up to the next attack that would last the same duration as the attack itself.

For this new attack sequence, I split the animation into three parts: the wind up, attack and knock back (if the player successfully hits back). This surprisingly worked well when implemented into the game and felt better than the previous attacks I had drawn.

After this, I proceeded to draw Ashton’s death animation draft, a kick for the second attack and finally a sequence going from idle pose to the new fighting stance.

Just like for Star, I lined and coloured all the completed drafts for implementation. At this stage I took the time to add the clothing, draw out the mace properly and tweak any mistakes. I also added an idle animation for Ashton’s non-fighting stance to possibly use when the characters are in dialogue. I had to adjust the frames for multiple animations to include smear and held frames for emphasis. I also added some follow-through frames through the delayed movement of Ashton’s loose clothing – such as the tie and pant legs. This process took the most time out of any of the tasks I set which I expected, but was not mentally prepared for. However, I believe it was worth it.

I split this new animation sequence into three parts: wind-up, attack and knock back (if the player manages to hit back successfully). This ended up working much better than the previous animations once implemented.

Part 2 here.

One reply on “Animating the Characters”

Leave a Reply

Your email address will not be published. Required fields are marked *