GameMaker Studio - Animation Tutorial Video Lecture - Game Maker Tutorial

alright guys welcome back today I'm
gonna be looking at something again
something a lot of people have requested
recently is if you've been following
along I guess who is like my very sort
of platform stuff you probably now are
at the point where you kind of
comfortably have something the
gameplay-wise it looks something like
this you can move around you can jump
and all that kind of stuff in your
character will change to face the
correct direction but a lot of people
have been wondering how to make your
character animate in terms of like the
you know walking along or you know doing
like a little jump animation or whatever
um so I'm just gonna cover that very
quickly today and just sort of you know
how I set it up in terms of how I made
animations for my characters what I do
is I use a combination of well actually
for this character here I think the only
thing I used was flash that's a totally
different package of software entirely
like like I said in one of my really
early videos like you know I I know a
lot of stuff beyond just game maker that
I used to put together my games um flash
is one of them I use that to do like
characters and character animations just
cuz I find it that just I just find not
the easiest tool to work with any number
of different tools you might use but I
can show you if I close this the the
animation frames for this character if I
just go to like hero idol here and edit
sprite you can see this idle animation
it is actually an animation um show
preview it's really really subtle and
it's really a waste of all these
billions of frames it's something I did
years and years and years ago well three
years ago I guess something like that
for um yeah that's like 70 frames long
the guy just very subtly bobbing his
head I could have probably done this in
like 7 frames if I wanted to and just
like massively reduced the UH the frame
rate was played out but um back then I
was always like no everything has to be
60fps and be really smooth and play at
60fps and so on so forth and I was a bit
stupid so yeah that does have animation
you can see he's bobbing his head
and down it was slightly and that's my
ideal animation so at the moment I took
out all the animation code so he will
just send play that one over in the game
is you saw us I gonna go
so also though I have here run animation
you can see there he is running trying
to preview at 60fps bunch of frames now
it's just in running as you can see I
only have him facing to the right
because you know I'm using image X scale
just to flip in left and right on the
same with the idle animation like I
don't have a version of this animation
that's facing to the left because I can
just flip the X scale and it's the same
thing but you don't flip to the left so
I have that and then for jumping and
falling
I actually just use single frames for
this a lot of the time because it saves
you otherwise you've got a writing code
to deal with sort of going from the
transition of jump in of you know being
on the floor the jump in which you know
I can't do but a lot of the times the
simplicity sake
especially if I'm trying to do something
quickly I'll just you know have one
frame and so when I'm in the air moving
upwards I will use this frame where is
you know is just rising upwards and the
same for falling when I'm falling I use
this frame just the Soviet spawn so how
I've got that set up normally what I
would do is in the code I would probably
look for the areas that change my
character state like if I'm holding to
the right then I'll start that animation
or whatever but in this case what I've
done just so I can demonstrate it as
well and it's not entirely an invalid
way to do it as I've separated out
I don't know this code this but I've
commented out of the bottom here just so
we can I can show you the effect it'll
has at the end compared to you know with
no animation code is I've just separated
out the animation code into a separate
sort of series of checks that just
checks what kind of stat a state our
player is in and then we'll just set his
sprite to be the thing it needs to be
based on you know whether or not he's
moving whether or not he's in the air
and so on and so forth so here if I just
the sound now what I have here is first
of all I'm checking if grounded you'll
remember if you've watched my in bet the
platformer tutorial grounded is a
variable I use and I've done a check for
earlier somewhere or other in the code
to see if there is a floor below me
things I ground at the false otherwise
sick renders are true otherwise said
grounded the false so whenever I'm in
the air grounded is false but so this is
saying if grounded is true so if I'm on
the floor then basically my animation
has to either be be idle animation or
the run animation so just got to say
which one of the two it is if our
horizontal speed is currently 0 H spur
Hesper which is as you know from a
previous tutorial if you haven't watched
that already go and do so because it's
kind of relevant for this one well
actually it's not that important I guess
if you're just here to learn how to
change your animation and you'll learn
that regardless but for the sake of the
platforming stuff husba is the variable
I use to contain my character's
horizontal speed so if that is zero then
that means we're stood still on the
floor that's that's what we've got
that's what we've concluded from those
two F statements therefore all I need to
do here is they set my sprites current
set my sprite to be my hero hero
underscore idle sprite which was the one
raised as bobbing his head up and down
we do that just by assigning sprite
underscore index to be the name of one
of our sprites over here simple as that
sprite index equals hero Idol semi come
on okay so that's you know if we're on
the floor we're not moving set the idle
animation and then how do we change that
to running if we're running well if our
horizontal speed isn't zero and we're on
the floor then we're obviously moving so
then we need to do something a little
bit different though we need to say if
our sprite index is not currently hero
run so that will then check to see if
we're already in the hero run animation
because if we're not then we want to set
our image indexed
zero your image in your sprite index is
what sprite your object currently is
using and your image index is the frame
of that animation so zero is obviously
the very very first frame at the
animation so if I go to here a run right
now I just close this run so as you can
see here image zero through two image 27
the index your image underscore index
will always be whichever frame of
animation you're currently on and that
doesn't change just by changing what
sprite you're on so if I'm on hero idol
and I'm animating and say I'm on like
the fifteenth frame of my idle animation
and I tell my sprite index to be a hero
run my image index doesn't actually
change from 15 so it'll go to run and
it'll put me on image 15 of run because
that's my image index that means I'll be
starting halfway through the run
animation whereas like if I you know
have a build up to my run or something
like that typically I'm going to want to
start from the beginning of the
animation just so it looks a bit more in
sync and you don't snap to sort of
halfway through animations and stuff so
that's the whole point of that that line
of code down there of this one so
basically if we're not already if we're
not already in our running animation
then saw our image index to be zero so
it's that's all that's our current frame
back to the start and then just set spry
index to be equal to here a run time for
the same format doesn't matter though
but good practice the only reason I
don't do that um help here is because
though most of my here are idle frames
the same anyway so it doesn't really
know what frame of idle I set myself to
and when I'm no longer moving but yeah I
just do that just to make sure I start
from the beginning of that every time
and then if if I'm already running then
it won't do this so like it's not gonna
permanently sent me to image index zero
because then I would never get past the
first frame
yeah that's that's all the animation
stuff forever on the floor and then we
just want to see if we're in the air
else so and that that else is linked to
this this top if statement appears you
can see from the indenting so I've kept
it separate so you can easily see if you
highlight one of these squiggly brackets
but that's something I'm not point out
before it'll show you the squiggly
bracket that it's linked to I keep
calling them squiggly brackets I don't
know what the proper name for them is so
on them you know leave a comment tell me
what the squiggle your back is they're
supposed to be called but yes you can
see if you highlight one of them it'll
turn blue along with the other one just
to show you which one is connected to
and I can help you sometimes if you have
one too many of these like if you've
accidentally done something like this or
something like you can start to see it
oh right and won't work out which one
and that will turn red if it doesn't
have one is packed with you can work out
how to keep those pet properly so else
over here so if are grounded isn't true
so that means if we're in the air then
we need either the jumping animation or
the falling animation this one's a lot
easier because like we don't have to do
any of this because they're just a
single frame so all we're gonna do is
say if our vertical speed the stuff from
before is less than zero so it's
negative so we're moving upwards search
sprite underscore index to be hero
jumping which as we saw is this little
guy so he's moving up like that hero
jumping and then basically you can
pretty much guess how it works now we
just say else
so if obvi speed is not less than zero
so it's either zero or above zero so
meaning we're either still in the air or
we're moving down in the air south
sprightly next to hero 4 and then that
shuts off falling animation so then I
mean I've only just uncommented that
Albee saw there was no animation before
so just to prove that that that works as
I have described in
yep there we go there's my run animation
so whenever I'm still and on the floor
it's gonna set me through my idle
animation and then whenever I'm moving
on the floor if I wasn't moving already
set myself at the very start of my
animation so my image index is zero and
then set my sprite index to be slight
index to be the hero run animation what
you can do if you you know if you have
an animation that doesn't quite fit with
your frame rate or something so I'll say
like you know like I didn't know about
this one I was doing it before so one in
my idle animation that's why I have all
these million frames so that I um I was
syncing up so that it was the speed of
animation I wanted I was sinking that up
to the framerate of my game so I was
like oh okay I want like a second of
animation so it needs to be like sixty
frames long don't need to do that
because what you can do is you can use a
property called image speed to basically
affect the the speed of animation so if
I always say wanted this to be say
actually I'll do it with well I need to
do in all of them ready when I say image
underscore speed equals one what that
means is that all move at exactly our
frame rate 100% of our frame rate so
sixty it'll it'll play back that sprite
index at 60 FPS every single frame it'll
take over by another frame basically so
that that's how many frames we move per
frames yeah if you get it so if we
wanted our run animation to be like
twice as fast or something we want her
to play it um well no actually that's
unlikely one that say we wanted it to be
half as fast so we only wanted it to
change we wanted to play a new frame
every two frames we could say image
underscore speed would be equals not 0.5
and then basically we're increasing by
half a frame every frame and obviously
our frames not actually animation lines
are going to change until we increase by
a full frame so two frames at the game
later we increase by one frame of
animation because of not 0.5 jumping a
four there yeah
they're single-frame so I don't need to
do anything with their speeds as we can
see now what should happen is we should
run a pretty much half the animation
speed yeah as you can see it's a much
slower now run animation so you can use
that to control the playback speed of
your animation as opposed to doing what
I used to do years ago and just setting
and just accounting for that with the
number of frames in your animation
because that will consume lots and lots
and lots of memory if you have a high
frame rate in your game as you can see
this guy alone is one megabyte it's
terrible especially when like I could
just you know like it just pretty much
delete half of these frames and get the
exact same effect like I could just make
delete every other frame animation would
look basically exactly the same so yeah
that's how you change that's how you
change animation that's how you set the
speed of an inanimate animation that's
how you set what frame of an animation
you're currently on and those properties
can be checked with this statement so
you can say if your sprite index is
something if your image index is if
you've you know if you're on a
particular frame of animation do this
you can say if your speed is currently
such-and-such you can set your speed to
different things and yeah you can do a
lot of different stuff just by using
things like if statements and and these
three different variables they're the
most important ones really when you're
working with animation sprite index
image index and image speed yep so
that's that for this tutorial I'll catch
you guys next week