I am not going to give you a detailed recipe or step-by-step guide on animation in M&M for obvious reasons. We did not use any guides while making animation, and simple did our best to enliven stuff in the game. I know our approach to making animations is not exactly convectional, but it sure is working out, bizarre as it is.
You see, the main animation program that we used was Adobe Illustrator. It is definitely not the first thing that comes to mind, but believe me when I say that it is perfectly suitable for the task. First of all, most of our artwork was was initially created in Illustrator. From this point most people would transfer things to Flash, but not us. When we began working on M&M, we did not either own or even know how to use Flash. Its interface seemed cluttered in comparison with the rest of Adobe’s software, while the program itself seemed to offer plenty of functions that we didn’t really need.
Later on, I made up my mind to use Anime Studio’s physics simulation to fake balloons’ swaying in the wind, and I have partially already explained the whys and hows along with other technical aspects, so I won’t return to it for now.
If you are familiar with programming paradigms but are new to animation (like we were), you should think of my Illustrator animation method as object-oriented programming. Vector graphics are pretty much objects that can easily be created, combined and divided in Illustrator. More importantly, they can be modified just as easily. What I did was basically create one image (let’s take Missy’s walk animation as an example), copy it, change something (move a leg and an arm a little bit), then copy again. Repeat.
When I had 60 images like that with two full steps in them all I had to do was put them all in same-sized non-opaque boxes to maintain image sizes and export each one in a separate file. If you are interested in sprite sheets, you can rearrange the boxes and simply export them all as one file. Then I simply imported my sequence of ai files to Photoshop, colored each one of them and saved as bitmaps.
Walk animation sequence in Illustrator.
We did not come up with this animation method easily. In fact, it seemed quite IMPOSSIBRU in the beginning. But then I remembered that Disney initially used this exact approach (minus vector graphics) to create the infamous Steamboat Willie cartoon, and it all clicked and fell into place.
Going back to balloon animation in Anime Studio, I have to say that our job here would be much harder if the program didn’t have this brilliant in-built physics engine. I simply drew strings, attached them to balloon bitmaps, added bones looking up and turned the upside-down gravity on. Voilà! Ballons are swaying as if there was wind. Then I basically found the right number of frames for the animation to look complete and exported all of them as bitmaps. To simulate movement, I simply adjusted the gravity angle to 45° and −45° and cut the number of frames.
Everything else you see in the game is engine-processed movement and not really animation in the pure sense of the word.