Tornados

Hi guys!

This week I will talk about tornados. Or more precisely tornado animation.

In our game we have a power up that allows the player to summon a tornado which eliminates all the enemies and obstacles currently present on the screen.

A few weeks back I did the icon for the power up which ended up like this.

tornado_iconHowever, this was only concept art and the art style of the game has change a bit since then.

I have never animated a tornado before and quite frankly just drawing for the icon was a challenge for me. I wanted it to be flawless and realistic and that is not what we are going for in our game.

 

So to do this animation I started off by trying to get the core movements.

ezgif.com-crop I started off with four frames. One for the start position, two in the middle and one for the end position. I did this in Toon Boom Harmony.

After doing that I continued to add more frames until I had a movement that I was sort of satisfied with. After that I tried to fill it with color and also try a semi see-through pattern.

ezgif.com-resize I decided that the movement was done and lifted the animation to Photoshop. The reason why I did not finish up in Harmony is that I have yet not figured out how to lift the frames with a transparent background. So right now I am wasting a lot of time making a green screen behind the drawings and then removing it in Photoshop.

So once in Photoshop I used a semitransparent brush and started off with a light blue color. I then started to make a lot of different strokes bending them to give the illusion of depth. I did this for the entire 11 frames before going back to the first frame and adding two shadow layers and one highlight. I then took that frame and added it to an in-game picture.

Screenshot_6I realized that the colors did not look good with the rest of the game and went back and made everything in different shades of purple.

Screenshot_7 I quickly checked it with the in-game pic and decided that I was satisfied. After that I repeated the process of two layers with different shadows and one with highlights for the remaining 10 frames. After that I tested the animation and went back for some finishing touches. The entire process took me 10 hours. And here is the end result!

tornado_animation

Until next time folks!

2 thoughts on “Tornados

  1. Malin Runsten Fredriksson, Group 9:
    Considering that you haven’t animated any tornados before, I think you have done a very good job with this animation.

    You explain very clearly what asset you’re working on with good, complementing pictures so that the reader can understand what you’re doing and why you’re doing it. When you started with drawing the core movement, did you use a reference picture or did go on pure feeling? It might just be my own curiosity, but I think it would be interesting for the reader to know.
    It’s good that you mention the animation program that you started using (Toon box Harmony), since most students I have observed have been using Photoshop to do their animations. You also explained why you then changed to Photoshop (because of the struggles you had with that program), which is a good heads-up to others who might be interested in using that software.

    In short, this blogpost is very well explained with a lot of pictures to go ahead with your explanations. On top of that I can also see the learning value in it for other students who might want to do something similar.

    Good luck with your project! Only two weeks to go!

    Liked by 1 person

  2. Hej Thea!

    Jag tycker att ditt blogginlägg är bra skrivet och jag förstår hur din tankeprocess har gått och vad du velat få fram. Något som jag la märke till först var dock att dina bilder du lagt in på bloggen ligger lite konstigt innan texten, det gör att texten inte har samma flow. Bilderna längst ner i bloggen ligger bättre, alltså mellan två olika stycken av text istället för de första när texten är precis bredvid. Hoppas du förstår vad jag menar. : ) Detta är ju dock bara något estetiskt och förstör inte själva texten i sig.

    Något jag tyckte var lite konstigt var att du animerade i Toon Boom Harmony, vilket är för mig ett helt okänt program. Eftersom du inte visste om hur en fick transparent bakgrund i Harmony lät det som en hel del arbete att få in din animation i photoshop efterråt. Ett tips från mig är nog att om det är så få frames som 4 är det nog lättare att hålla sig till att animera i photoshop. Det finns ju 2 olika sätt att göra det på i timeline ifall något av dem är obekvämt att arbeta med. Förstår dock att en vill använda ett annat program för animation om det är rätt många frames då photoshop är rätt bökigt då.

    Om jag får nämna min personliga åsikt om färgen på tornadon i slutprodukten gillade jag nog mer den gråaktiga eftersom den sticker ut med och visar mer att den är cool och stark. Ofta vill en använda power ups för att känna sig kraftfull och om den smälter in mer i bakgrunden kanske det inte känns som det. Då jag inte har spelat ert spel med denna artefakt i kan jag inte på rak arm säga att det är så, men ni skulle kunna testa med två olika varianter. : )

    Slutligen skulle jag nog också påpeka att jag tyckte att tornadon inte riktigt passade ihop stilmässigt med spelet, den är riktigt snygg men lite för verklig skulle jag nog säga. Jag tror att jag tycker så då det är väldigt mycket små streck i olika nyanser i tornadon men att bakgrunden är stora färgytor utan smala streck.
    Jag hoppas att jag inte kritiserade allt för mycket, vill bara hjälpa till. Det är väldigt kul att få se ens concept att bli verklighet så det känns lite som ens barn, haha.

    Lycka till i fortsättningen!
    //Madeleine

    Like

Leave a comment