|
Hello world! This week has been all about our boss Grubby McGrub. Grubby is a big, fat caterpillar. She glows in creepy orange and yellow and have a witch-like appearance. Her battle is in whack-a-mole style, she will move around under the floor and smash up through the fabrics trying to head-butt you. If she hit you it’s a one hit kill so you really have to look for the cracks appearing right before she comes up. If you’re fast enough and avoid her you better keep on running as she sends out waves of projectiles in a lot of directions. For concept it’s the same as last week. Måns from my group have done some awesome work on the concept art of Grubby and some key-frames for the animation which makes the star a lot faster and simpler as I don’t have to come up with the basic character myself. This is the concept I got from Måns…
After receiving Måns concept-art I simply open it up in illustrator and start doing the basic shapes converting his work in to vector graphics. After that I evolve the shapes to a more characteristic look and add colour. While I’m still in Illustrator I do the different frames I will use later for the animation. Illustrator has an awesome feature where you can export your work to Photoshop and keep all your layers. This action simply converts your work in to pixel-graphics and saves them as a .PSD/.PDD for continuing your work in Photoshop. Just make sure the layers you want to have with you are visible while exporting. When in Photoshop I first of create the basic animation to see that it flows well. If I need I can go back to Illustrator adding more layers for more frames. When the animation flows well I add the glowing effect using the very soft standard brush in Photoshop. (When I draw in Photoshop I almost never use any other brush than the hard and the soft tip standard brush, as with these two you can draw almost anything you want) This is how Grubby looked like after all the steps up to the glowing one…
When the glowing is added I go on to do the more fluid moves of the character. When I’m in this part of the progress of doing an animation I render the timeline to get each frame as an individual .PNG files and reopen them in Photoshop. I do this as it can be really heavy for the computer to update the frames by selecting new layers and moving them around each tenth of a second ( and sometimes even faster) and that the warping-tool in Photoshop doesn’t support warping multiple layers at once. So to get my animation more lively I simply distort some of the frames slightly creating a very simple moving effect. When all frames are looking the way I want them to do I scale them down to the in game size to save memory of the computer running our game later. Then I render them out again as .PNGs and pack them up in to a sprite-sheet using sprite-sheet-packer. This is how She turned out. the crack she creates is going to be on a different sprite-sheet so it doesn’t show on here, but you will see for yourself when playing the game in about one week.( OMG. IT’S SOON DEAD-LINE!!!)
This is basically how I’ve done all our animations for Suit Em’ Up (recently renamed S.W.A.G. lol). So this might mostly seem like a repost but with some steps slightly different as I learn along the way. I can say that I work at least twice as fast now compared to my first animation for this project. For the problem I had in the post before this one I have now solved it. If you only get broken files out of your exported timeline it’s probably because it’s in repeat mode. So to as simply and fast as possible get your frames out just put all your frames to 1 sec long and the timeline to play once. Then go to File – Export- Render Video… – choose “Photoshop Image Sequence”, set format to “.PNG” and set the frame rate to 1 FPS, then choose where to export too and press Render. TADA! You should now have a map named to whatever your project is called or what you choose to name the rendering, and in this map you should find each individual frame as a .PNG to use in which way you please!
Guess that’s all for this week, until next time take care! -Ludwig Lindstål  |
