Aseprite – Creating Animation in Game Guide in 2021

Aseprite – Creating Animation in Game Guide in 2021 1 - steamlists.com
Aseprite – Creating Animation in Game Guide in 2021 1 - steamlists.com
Remember, this guide is more of a reccomendation than anything else, so, don’t go to me saying how I make you do stuff. Thank you!

 

Setup and other things

Well, it is very simple, but first ; I would go to File > Save As >*file_name*.ase, Aseprite crashes rarely, but still, be safe, you’ll never know. 😉

When you are done, go to File > Save(or “Save as,” if you ignored the first process)>*file_name*.gif, Why can’t I just save it as another file? A : A gif (animated artwork) is the only way you can save it as said animation.

 

Tip one :Don’t do everything all at once.

(IMPORTANT : Make sure you have the onion skin on before you start to animate, it makes it easier for animating, and if you don’t know how, go to Hatty’s guide to see how to turn it on)

Okay, what I mean is that, don’t do the entire animation all at once, same thing goes for normal art, but, this isn’t art.

Aseprite - Creating Animation in Game Guide in 2021
First, draw the base, don’t go for the art of it first (trust me, I have done that a lot of times), draw for the base instead, you’ll see how easy it is.

Aseprite - Creating Animation in Game Guide in 2021
Second, don’t think it is going to be perfect the first time you glance at your animation(s), everything isn’t perfect the first time it exists. It basically should just look like so :

Aseprite - Creating Animation in Game Guide in 2021

(note : It doesn’t have to look exactly like what is shown; your skill, your animation)

Aseprite - Creating Animation in Game Guide in 2021
Third, be okay with what you get, be glad that you are going into this stuff that most people don’t normally go into. Be proud!

If you’d just make a test, that would be great! : )

Tip two :Editting the speed of your animation.

This is somewhat important as much as this is a little tip, so it is debatable.

This is where fast motion and normal motion come in place, look closely at the animations I make on this guide, they are normal speed, no duh, but, it is going at the speed average of ‘100’, which is what it puts all animations’ speeds on. If it is not fast enough for your standards or your animation, I would recommend doing this.

There is a way to make it go faster through these easy steps, for one, make sure your animation is complete before doing this. Second, it will probably mess up some little detailed frames, like if it is supposed to going slow, but if you continue through this, there is a way to fix that.

1) Select the frames – To do that, just simply drag your cursor over the frames and it will look something like this :

Aseprite - Creating Animation in Game Guide in 2021

When that is done, right click it, then click on ‘Properties.’

2) Setting it up – There will be something called ‘Duration (milliseconds),’ and the settings are ‘100’ (average speed), if changed to go faster, set it to any number lower than 100. And to make it go slower, set it to any number higher than 100.

(Sidenote : I know when right-clicking “Aseprite - Creating Animation in Game Guide in 2021
” you get a set of speeds, but that is just for setting up how fast it needs to be, if you want to make it public, follow this instead)

3) Perfect frames – This is the part I was talking about, for those perfect frames. This is mostly useless because most frames should stay the same speed, but I will go on with it. It’s just like ‘1)’ but with dragging it over the frame(s) you want to slow down / speed up. Not a big difference, to be honest.

That is basically it for this tip, as well as giving a shout-out to http://steamcommunity.com/id/sonicbomb77 for helping me out with this problem. Thank you, ◢ k r i s ◤!

 

Part one :Start simple

Aseprite Creating Animation in Game Guide in 2021 steamlists comPart one : Start simple” title=”Aseprite – Creating Animation in Game Guide in 2021 – Part one : Start simple” alt=”Aseprite – Creating Animation in Game Guide in 2021″ title=”Aseprite – Creating Animation in Game Guide in 2021″ />
Step one ; Draw the body (Also, it doesn’t have to be like so) :

Aseprite - Creating Animation in Game Guide in 2021

Aseprite - Creating Animation in Game Guide in 2021
Step two ; Start animating the legs; just draw lines, it doesn’t have to be perfect (Sorry for the bumps) :
Aseprite - Creating Animation in Game Guide in 2021

Aseprite - Creating Animation in Game Guide in 2021
Step three ; Start animating the arms; it is an important process of making it (Sidenote : Make sure it flows with the legs, normal body movement, if you want to call it that) :
Aseprite - Creating Animation in Game Guide in 2021

Aseprite - Creating Animation in Game Guide in 2021
Step four ; To make sure it actually looks like it’s walking. So, add a little jump to it (Sidenote : Don’t do it at normal times, make sure it is when the second he is takes off for a walk, and also, this is not really important, but, you can add a landing (usually on the next frame from it) by moving it’s head 1 pixel down [0x, 1y] ) :
Aseprite - Creating Animation in Game Guide in 2021

Part two :Expressions

The best thing to show to your character is expression, make ’em look alive instead of just looking like a little bit dead. First, it can’t just be a smile like, that seems like the go-for (Meaning a little cliché) when going into this kind of expression, but, it doesn’t totally take that fact away from this problem.

Second, when I said that it doesn’t totally take away the fact is that it is mostly used in what is old games, and yet to say, creepypasta games. So, it’s sort of is confusing to say that it isn’t always the same everytime, only in certain situations it is. But, I don’t want to touch on this too much, considering this is a guide and not a rule book.

Third, don’t over-express ; be careful about that because most people don’t seem like they do it anyway, they are. But, don’t take this too seriously, mattering on the situation (As said in the Second rule), it is fine for that, considering on what genre it is (Cartoonic, silly, child-friendly, etc.).

I think this might be a better example of what I am really saying :

Part three :Fire

NO, BILLY GET AWAY FROM THE FIR… oh, wait, that is the fire you are animating, anyway, let’s do this thing.

(Sidenote : I would reccommend if you’d draw the base first, it will make Step two way easier, and the base is the purple part)
Aseprite - Creating Animation in Game Guide in 2021

Aseprite - Creating Animation in Game Guide in 2021
Step one ; draw your base, like everything else that envolves art and / or animation, and also, the fire doesn’t have to be perfect at all, fire is just fire, it’s not a cube or something, and that is why drawing the base is so easy.

(Sidenote : Of course, it doesn’t need to look like my fire)

Aseprite - Creating Animation in Game Guide in 2021
Step two ; Make sure it is moving in an abnormal way (let’s start with 7 frames)

Aseprite - Creating Animation in Game Guide in 2021

(Sidenote : Again, doesn’t have to look like mine)

Aseprite - Creating Animation in Game Guide in 2021
Step three ; It looks too childish to be a fire, let’s add a little transition to it. How? It’s simple, when the big flame goes downward, let’s make it depart the tip of it.
Aseprite - Creating Animation in Game Guide in 2021

If you are still confused, let me help with that!

Aseprite - Creating Animation in Game Guide in 2021

Aseprite - Creating Animation in Game Guide in 2021
Step four ; If you add a few more transitions, you’ll be basically done with this.

Aseprite - Creating Animation in Game Guide in 2021

Part four :Blinking (Facial Animation 1 / 2)

This is more explained on it’s own, so I am not going to deeply explain this one.

So, with that useless intro to this update to the guide, let’s get to the animation.

Line Eyes

It is more of this image :
Aseprite - Creating Animation in Game Guide in 2021

How do you do it, easily! First we need to start it off with the perfect 3 x 1 px. line (vertical ; | ) (Sidenote : When I say ‘3 x 1’ or a number closely explained to that, it means ‘height x width’, now that we got that “straight” *BUD-DUM CRASH*), after we got that done, make it so that it is 1 x 2 px. line (horizontal ; — ). Now, all you have to do is make it back to normal 3 x 1 px. line but add 1 more pixel upward (4 x 1 px.).

If that doesn’t “line” up with what you eyes are, there are more, step two and one to the process doesn’t need to be changed, just make the step three added 1 pixel higher, that’s it.

And if you don’t want to read what is above, just look at this ;

Aseprite - Creating Animation in Game Guide in 2021

Part five :Fast Movement(movement 1 / 3)

It is what makes everything look smooth / smoother than just normal movement, and it makes it more pleasing to the eye, well, in my opinion atleast. Take a look! :

Aseprite - Creating Animation in Game Guide in 2021

As you can see, there is that kind of drag in-between the frames of the animation, that is what makes it look like it is going faster and fresher, if you want to put it that way, it honestly is better than normal movement.

Here it is frame-by-frame :

Aseprite - Creating Animation in Game Guide in 2021

(Sidenote : The blinking part is optional)

Do you see the drag frames on Frame 3 and Frame 7? It is for dramatized reasons, but explainable. It’s mostly for it to seem appealing instead plain moving back-and-forth motion, because it’ll make your animation look much better. But, this can’t always be said, it matters on the situation.

Part six :Smoke

To be honest, this is actually the hardest one for me to do, it is annoying smoke. I wouldn’t reccommend you do this on if it is needed, other than that, it would be good to practice that.

Let’s get started.

I would start out by making a good base for the animation, and as I say as a Note or Sidenote, it doesn’t have to look like this.

Aseprite - Creating Animation in Game Guide in 2021

It is pretty much the same as the fire, but except, it’s not just the little detail, it is the whole thing. So, with that said, I guess I could explain how to do it.

Before we go on to the animation part, I would reccommend it shouldn’t be gray, it should be a color / colour that makes it better to see and also make sure you have the Onion skin turned on for this animation, it’ll make it much easier to do.

Aseprite - Creating Animation in Game Guide in 2021

Now with that over with, let me get to the explaining, this animation is 11 frames, so not much for it, just a little detail you should know.

As the particles of the smoke start to disappear, can you see them move in a different way? Let me show you the difference :

Aseprite - Creating Animation in Game Guide in 2021
Slower version :             Aseprite - Creating Animation in Game Guide in 2021

Blue – 11 frames – It flows downward with a little twirl

Red – 4 ~ 10 frames – It just flows upward

Pink – 4 ~ 9 frames – Flows upward and disappears quickly

Orange – 9 ~ 10 frames – Just disappears

Once you are done with that, just color it gray and you are basically done!

Part seven:Fast Motion(movement 2 / 3)

Let’s look into this wonderful use of animation again, I would recommend you look at Part 1 first before this. If you did or didin’t read it, so be that then.

This is for lines in particular, nothing else. So, it might not interest you. Anyway :

(Sidenote : I am going to be using numbers for the pixels they grow / increase, also, it is 8 frames)

Aseprite - Creating Animation in Game Guide in 2021

 

Greenhttp://1 , +2 , +3 , +4 , +3 , +2 , +1

Redhttp://1 , +1 , +2 , +2 , +2 , +1 , +1

Bluehttp://1 , +1 , +1 , +2 , +2 , +2 , +1 , +1

Purplehttp://1 , +1 , +1 , +1 , +2 , +2 , +1

Pinkhttp://1 , +1 , +1 , +1 , +1 , +2 , +1

Yellowhttp://1 , +1 , +1 , +1 , +1 , +1

 

Well, this is just for making it look fluent and not beefy (lagging behind / infront), just for better animation quality, or for other things I have no idea for or about. Just like Part 1.

As you can see, I made it slow down at the end by making what it started with :

Aseprite - Creating Animation in Game Guide in 2021

It will be like this it, starts with : http://1 , +2 , +3 , +4 …
Then, it’ll end with the one but still going upward : http://… +3 , +2 , +1 , +1

 

And it works with all of them (except for the Yellow one). Think of this : It’s going at a fast pace and would it be better to stop suddenly, or stop with a little drag?

That’s all.

 

Credits and knowings.

IrriNinja – Creator of this guide

Hatty – A help to the making of this guide

◢ k r i s ◤ – A help with Tip two.

Meanings of the words ;

cli·chéhttp://klee – shey

1)
(in art, literature, drama, etc.) a trite or hackneyed plot, character development, use of color, musical expression, etc.

2)
anything that has become trite or commonplace through overuse.

Written by irri

This is all about Aseprite – Creating Animation in Game Guide in 2021; I hope you enjoy reading the Guide! If you feel like we should add more information or we forget/mistake, please let us know via commenting below, and thanks! See you soon!


Be the first to comment

Leave a Reply

Your email address will not be published.


*