Omnimaga

General Discussion => Art => Topic started by: XVicarious on December 26, 2011, 06:57:39 pm

Title: Art Porting Help -- Flash Art
Post by: XVicarious on December 26, 2011, 06:57:39 pm
So long ago (well... 4 years ago) I made a game called "[Danger in Shapes]" in Gamemaker.  I went on to make a sequel and started on the 3rd game (and last of the Trilogy).
So I want help porting some art to swf with animations and I am terrible at art.  I am porting my game to Flash/HTML5/Android.

So here is what I am requesting!!!
(http://xvicario.us/images/3_star.png)
I would like either this, or something like this but the background be more animated (moving stars, blackholes etc).

(http://xvicario.us/images/3_win.bmp)
Now this might have to be 100% remade because I want the background off of it and only have the "wormhole" or whatever the hell it is (honestly I made this game so long ago I don't exactly remember).  I want this a little more animated as well...

You guys are creative and I know that you will find ways to make both look a hell of a lot better!
Title: Re: Art Porting Help -- Flash Art
Post by: alberthrocks on December 26, 2011, 11:04:08 pm
One of the main differences between Flash and regular artwork is the term vector. It's not quite a special term - if you know vectors in math or physics, this is just like it, but in terms of drawn lines and such. :)

Your best bet is to start anew; you're very unlikely to get favorable results from trying to make this into a vector image (if at all possible).
If you have the original image editor file (Photoshop has PSD, GIMP has XCF), use it as a reminder of how you made the image.

Vector images in Flash are designed differently - you don't have an eraser or selection tool, or any of that kind of stuff. Instead, you design based on lines, curves, rectangles, and other geometric shapes. It sounds horrifying, but it is very intuitive, and is the standard for all 2D animation studios today (including anime studios). (Post-processing can add effects and the like, but that's after the animation.)

The other main difference between regular artwork and vector artwork is scalability - you can easily scale vector art to any size you want, including big-banner-in-the-mall size. (This doesn’t mean you can see more details in your artwork, just that it’s crisp clear for any size.)

It will take some time to get used to - not surprising, since this is an entirely new concept. But you'll get used to it and start liking it. ;)

Besides Flash, the other vector format that isn’t commonly known is called SVG. It’s an open standard for scalable vector graphics, and it’s pretty darn good. :) It’s also 100% XML... not that you would (or should) modify the SVG’s XML. :P

To send you along your way, I recommend Inkscape (http://inkscape.org/). This is a very popular, free and open source, and decent SVG editor. Why start with this? Not just the fact that it’s free, but also because SVG is the vector graphics format for HTML5 development. SVG graphics can also be imported to Adobe Flash [IDE], so it’s a very good starting point. (Flash development files to SVG is a bit murky - it’s possible, but I wouldn’t recommend it unless you have technical experience, even if I don’t own a copy of Adobe Flash :P)

To be fair, Adobe Illustrator is also a decent (but expensive) SVG editor. I think it also has more effects and such (translated to the SVG format if it doesn’t exist), but I’m not terribly sure.

For HTML5, CSS, HTML, and Javascript will form your game. CSS and HTML are used to design the game, and Javascript to make it interactive - the true programming language in all of this.

For Flash, ActionScript and your graphics will form your game. (For HTML5, the HTML tags will allow you to include your artwork and other assets for your game. In Flash, this typically is all bundled in.) ActionScript, as the name implies, is the programming language for Flash. Flash also offers animation - SVG is getting animation support, but it's not widely supported yet - animation is typically done via Javascript in HTML5. (Inkscape is getting this soon. (http://wiki.inkscape.org/wiki/index.php/Animation-(Timeline)))

Hopefully this helps! :) The journey will be long, but in the end you won’t regret it. ;) I will warn you that SVG may cause you to think only cartoons can be made with it - there are some high quality graphics to be had with SVG, it just takes work! :) (Inkscape’s About screen is a good example!) There are also effects inside the SVG format, like blurring and lighting effects.

Good luck! :D
Title: Re: Art Porting Help -- Flash Art
Post by: XVicarious on December 27, 2011, 08:23:02 pm
Thanks for that.  Sadly since someone made these for me, I do not have the original files.  The reason I am requesting SWF is because of the platform I am using to re-make my game.  It uses SWF for the flash and it converts them to a special format for the Android and iOS versions.
I'm just thinking now that all of the graphics will have to be redone and wonder if anyone here could/would do it for me, since I have little to no artistic talent.