Inkscape Tutorial - Game Art Creation - Animation Basics

[@barakatosalon]

Great tutorial, thanks buddy ! keep doing in that way !!!

[@danielsvocak5186]

Hi Chris, how do I transfer the png files into the animation ? I wish there was a video where fully shown the process from drawing to the actual animation...

[@OpenGL4ever]

Gif is a format that allows to have animated key frames inside your gif file. Thus you can convert the PNG formats to Gif and put them in the according frame. Another way is to control the switch to the next png frame by another means. A programmer would load all PNG files into memory and then display frame after frame with a small delay to show the animation.

[@cat1200101133]

I am looking for one too

[@ChamberlainCody]

DUDE! YOU KILLED IT THANKS!

[@Vengiism]

Great tut.Can we have the character so we can follow along,please?

[@OpenGL4ever]

That sounds very cumbersome if you need to export every layer manually step by step. Isn't there any plugin for Inkscape available that allows you to handle and export key frame animations much easier?

[@theajayyy]

try synfig, a program that has keyframing, and you can import inkscape files

[@Baekstrom]

Inkscape is a great vector drawing tool, but it needs an animation timeline. Would it be easier to make animations like this in Blender 2.8 with the new 2D animation features?

[@2dgameartguru]

Yes... for sure... When I did the initial animation in Inkscape, the other tools were not around. I haven't tried Blender 2.8 but it would seem like an 'overkill tool' for the job. A simpler, specialized bone system tool like spine, spriter or dragon bones [free] might be better suited for the task. Krita and Unity have their own 2D animation systems in place and I have worked with them in the past. Personally. I still prefer Spine - but that's due to the habit I guess. Best of luck!

[@Sergiy_Peresada]

Hello,how do you convert png to swf (translate.google)

[@2dgameartguru]

+Сергей П. - in adobe flash you can import a sequence of png files. You select the 1st file and the program detects the sequence (if the names are numbered).

[@leosilva8774]

great video

[@gagliardivex9218]

I wish there was a tutorial of how to draw the character

[@2dgameartguru]

There is... just not as a video but a step-by-step tutorial [as it happened before my youtube days started] 2dgameartguru.com/complete-game-project-character-design/

[@eduardoherrera1974]

How do you show the preview in adobe flash tutorial like in 1:20 ?

[@2dgameartguru]

+Eduardo H - I chose flash for a quick and easy preview. All that's needed is importing the images as a sequence and publish it to an swf. It will automatically loop. It's just quicker and easier than making an animated gif image in gimp. krita or photoshop. All I needed was a preview . a gif image would have done the trick just fine as well. I had the files open, sized and positioned before starting the recording to quickly bring them up when I needed them. They are just used to show the difference between the large work file and the final output in the ingame size.

[@eduardoherrera1974]

+Chris Hildenbrand what program do you use on how do you do it?

[@2dgameartguru]

+Eduardo H - the tutorials are done in inkscape and the art is then exported to png and scale in gimp or krita. I also work with corel draw, adobe illustrator and photoshop and did a lot of work for flash game back in the days. Here's a good index of the tutorials (seeing I am still working on a new blog layout): 2d-game-art-tutorials.zeef.com/chris.hildenbrand