Sunday, June 30, 2013

Backgrounds and Effects


I added the snow maybe a year later.

The pirate's cave and the vampire stage

For reference I collected many images from old Disney films and Warner Brothers cartoons (digital images, mostly from the internet - but I used to purchase art books - which are a lot less practical to have as a digital artist, I even started scanning my books).
  Having to keep elements separate so they can be used in parallax movements is a bit of a drag - having to deal with a number of layers in Photoshop and having to be careful to only paint on the correct layer - that slows down the flow. 

It's fun when you receive the newest build from your colleague and can check out the art as it appears in the game. As an artist, I'm very critical of my work and will hunt for flaws or things to improve. It's hard to stop.

Effects and Special Events

Another aspect that was new for me was drawing and painting effects. How do you draw a HitFx? Should you use motion lines or motion blur? What's a good BlockFx? When a character launches a special attack - what should the effects be? How does the background change?

I would look at scenes from various Anime frame by frame and analyse them. I had never even considered how they managed to make the glows so sweet back in the '80s. They didn't have cool software and hardware to do nice blurs when compositing on a computer. I guess they used optical effects (shutter-speed and multiple exposures).
  Anyway, we have a lot of advantages today - looking stuff up on the internet in seconds, throwing a gradient behind something or changing digital paintings on a new layer, preserving the old one, etc..
A pretty good look - glowing stripes rushing by. I didn't keep them though...
I was quite happy when I eventually arrived at this. Yes, very '80s.
Their fashion was terrible, but glowing grids and space - that's good!

Various things

The character selection menue (British spelling of menue, just because)
Originally I had planned on creating an ending for each character (for the championship mode). For various reasons I eventually decided against it.
I painted an island so you could move from station to station, but I wanted more freedom with the stages and fitting them all on one island... not ideal.

Here you can see an example of my designer-mind demanding improvement. I had the version on the left, functioning in the game - but then I purchased After Effects and went serious on this effect. I redesigned and re-painted the letters and added the Light Sweep effect, Light Burst and Light Rays in After Effects, exported as sprites and eventually got the timing to look good in the game. Don't think it's something I did in a day or two. Oh no. The design of the letters, the painting, the gradients, the animating and adding the effects, re-learning After Effects, figuring out the exporting of frames (unmatted, duh) and then getting everything to work in the tool Martin had programmed - we're talking a process of constant fixes here and there over a period of several weeks until it was cool.

Take a look at it in motion:

  This endeavor was worth it, however, as I can say I'm truly proud of how it turned out!

2D Animation in Photoshop

If you're interested in creating some 2D animation yourself, you might find my process of interest. Before I landed back in Photoshop, I did research looking for 2D animation software:

Retas Pro - supposedly used to make such high quality anime as Cowboy Bebop

Toon Boom - also looks promising 

TV Paint - not cheap either 

Now, spending good money to get great tools can be a good investment and I wouldn't shy away from something just because it costs more than what you make in a day's work or two.
  For my purposes though, I was able to use Photoshop's tools (Windows > Animation). Photoshop is not cheap either, but I sure got my money's worth, since I use it so much.

I would draw the linework with a size 6 brush in a 1280x1280 image, then use the magic wand to select the outside space, then invert and fill, then paint on an indented layer. This way, I don't have to worry about painting outside the line.


© 2013  Foxy Robot. All rights reserved. iPhone, iPad, & iPod touch are trademarks of Apple Inc.

No comments:

Post a Comment