Articles, Blog

Basic Eye Rigging (Adobe Character Animator Tutorial)

December 8, 2019


The eyes are one of the most critical
parts of an animated character. They really help add some emotion and
personality and really bring the character to life. So what I’ve created
here is a free example project that will show you four different techniques for
creating the eyes. A lot of the differences are subtle between them but
depending on your style and your aesthetic and all of that one of these
might be the best fit for you. So this is a free downloadable project anyone can
download it but links in the video description below
feel free to take it apart and we’re gonna walk through each of these
techniques in this video so our first guy here on the left basic
eyes the yellow guy here he just has you know simple ovals with a pupil this
basically by default centered in the middle there and as I look around
up-down left-right he’s looking in those different directions he also has a blink
state so when I blink my eyes he is also very for a very short duration showing a
blinked close eyelid state then next we’ve got off-centered eyes this green
guy here so by default his eyes are a little bit closer to his nose right
they’re not in the center of the circle they’re a little bit off-centered and
there’s a special technique you have to do to make that work and I’ll show that
in a little bit the third one is large pupils this blue girl over here so this
is like if you’re doing an anime style character where the pupils are
traditionally a little bit larger and are fitting in a more constrained you
know eyeball space and there’s again some secrets and techniques to do that
sort of thing and she also has a blink state that’s a cycle layer’s blink so
you notice it’s a nice fluid three frame animated state when I’m blinking my eyes
and we’ll talk about doing that as well finally this last character is using
eyelids so this is in lieu of a blink state so instead of doing blink you
instead have a top and bottom eyelid and as I’m moving my eyelids up and down in
the kind of opening and closing them in the in the webcam the this character is
also reacting to that and showing that as well so let’s dig into this let’s go
into rig mode and the way I’m going to do that is by double clicking eyes down
here in the timeline that’s just a shortcut to get to that puppet in rig
mode alright so here we see the set up of these four different heads I see that
I’ve got yellow green blue and red each of these is
their own group and if you twirl them open you’ll see kind of all the
different contents inside I’m gonna do most of my explaining of how these
characters were created in Photoshop because that’s where I originally
created them and I didn’t really honestly do too much rigging you know in
here and character animator it just kind of automatically works if you name
things the right way so because this is called left eye for example you’ll see
it gets tagged over here in the tags panels left eye or you know the pupil or
whatever you want so you know you follow these conventions things should just
automatically work but um let’s go and see the original Photoshop file of this
and I can do that by some making sure the puppet is selected over here on my
project panel and then going to edit edit original alright so I have my
master artwork file here in Photoshop so let’s go through each of these
characters and see what they’re all about let’s start with this basic eyes
guy here so if I twirl him open I see that he’s got a head group here and
inside a left eye right eye a background sketch in a background color and then
each of his eyes are these things here these eyes are the simplest you’re going
to find and that is in each eye group left eye and right eye I have a blink
state which is hidden by default but this is the artwork that’s gonna show up
when I blink in the webcam and then I have a pupil this little black one right
here and the eyeball which is the surrounding area so in this basic set up
the way that it works is the eyeball is the kind of the confines of where the
pupil is going to move around so this pupil is never gonna go should never go
outside of the eyeball it’s going to stay within that specific shape and
that’s all there is to it and because you keep the eye of the pupil centered
inside the eye it’s going to look good no matter what you know direction you’re
looking in and then as I said the blink stage shows up when I blink and actually
what that’s going to do is make the pupil and eyeball disappear at the same
time but because this is covering everything you don’t really notice that
but that’s just what’s happening behind the scenes and that’s why you kind of
always want to have all your eye elements together in the same area so
when when the blink shows up you know other parts of your face aren’t
disappearing or that sort moving on to the next guy off-center
eyes over here so let’s close twirl up yellow and show us green now so this guy
is pretty similar but you’ll notice that the pupils are a little bit close to the
nose they’re not you know they’re not in the middle here instead I move them a
little bit closer and the way to deal with this sort of thing if you just left
these by themselves some of the time it’s going to look okay actually and you
know the eyes will move around but you do get into some weird states when
you’re looking diagonally or some other things and the eyes aren’t going to know
exactly how to compensate perfectly so the way that I get around this issue if
I’m doing this type of look is I’m actually going to do a little bit of a
trick where the white of the eyes so this part here is not actually the
eyeball this is not what I’ve tagged as the eyeball instead I have this layer
here left eyeball which I have at one percent opacity but if I bring that up
you’ll see this is the actual eyeball this is the actual range as we learned
with the basic guys that the pupil is going to move around in and so this is
kind of a hidden layer that’s showing up behind everything but this is what’s
controlling that I gaze process so so I you want to keep it at 1%
if you leave it at zero I think it doesn’t work exactly right so I always
just keep it visible and at 1% and that should work okay and yeah this does
constrain yourself a little bit so you’re never gonna get uhm the pupil is
moving all the way up to the corner like this um if I were to do that I might
make a trigger you know to make the eyes you know look all the way up like that
it’s going to only stay within you know this eyeballed range instead whatever’s
tagged here so that’s a you know that’s a small price you have to pay for this
sort of thing but I think it’s okay in this case with a blink state this is
completely you know overtaking on the eyes this is what shows up when this
character blinks and so this is just a different blink treatment for this endo
show kind of how it’s gonna hide everything else when you blink alright
so moving over to our blue head over here with the large pupils um if you set
this up normally like we’ve done with these other ones the pupils just they
wouldn’t have a lot of room to move around and so they either wouldn’t move
a lot they would feel constrained by the eyeball or they would feel you know they
can move out the eyeball and that looks bad too so
the way that you get around this sort of thing is to actually kind of create a
Halloween mask style treatment so if I remove the eyes here you’ll see that the
color this foreground color layer that I have here actually has holes inside of
it so I can see through it and what’s happening there is if I take these away
and now show the eyes the eyes are actually full eyeballs and pupils and
eyeballs that are showing up behind each of these you know behind this mask and
that allows them the mobility that they need to move around and look around
without being constrained by the shape of the eyes so if you’re doing this sort
of treatment this is how I would go about it create you know these cutout
Halloween mask style holes and then put the full eyeballs on behind them instead
now we notice with this character her blink state was a little bit different
so I made a lid group and then put a blink group inside of that and then this
is a three frame sequence that plays so when I blink it’s gonna play frame 1
Frame 2 and frame 3 to close the eyes and then when I open my eyes again it’s
gonna reverse the process that’s because I’ve added cycle layers behavior to it
we’ve gone over this before check out the puppet and character
animator to see how this was done but this just adds to a smoother blinking
process that I’ve started adding to most of my characters just because I think it
looks a little bit nicer to do it you know smoothly like this and said just
swapping out artwork and then finally that brings us to our red guy over here
and the technique the general technique is kind of the same as what we saw with
the large pupils here where I’ve got you know cut out holes in his his head here
but then the eyes below are actually interesting because they’ve got the
eyeball they’ve got the pupil but then I’ve also added these eyelid bottom and
eyelid top States so when you do this what’s gonna happen is these are going
to be tracked whatever you call eyelid top and bottom
or can be tracked to your own actual eyelids and so as I you know move my
eyelids and kind of squint these are also going to move up and down as well
and so this adds this actually replaces the blink you’ll notice this character
does not have a blink layer here because your eyelids are already moving
so if you have something called eyelid bottom and top then it’s gonna ignore
the blink part of it and it’s just gonna say this is the you know I’m moving I’m
tracking the eyelid movement instead and then the viewer is just seeing you know
everything behind this so as the eyelids you’re close they’re gonna see them move
like this so you want to make sure you have enough room so you’re not getting
into a state where you know you start to see the whites of the eyes that sort of
thing so make sure you know this could be a rectangle this doesn’t have to be
you know this type of shape it can be whatever you want whatever fits the
theme and styling of your character so yeah that’s all there is to it and then
you bring it in to character animator and look around and your pupils should
be moving your blinks should be happening or eyelids should be moving as
you would expect now you have a ton of customization with all the stuff with
the behaviors I’ve added individual I gaze and face behaviors for each of
these faces but if you’re making your own puppet you probably only see one of
these four eye gaze and face so for example my yellow eyes over here basic
eyes if I feel like they’re moving around a little bit too much I could
open up my I gaze behavior and change the camera strength parameter if I want
it to be like fifty percent or something like that now you’ll notice the pupils
aren’t going as far to the side they’re staying a little bit closer to the
middle and I could bring that down even further if I wanted to to make the the
movement very very very subtle thing that the eyelid controls on my red guy
over here so if I twirl open face red one of these is called eyelid strength
so let’s meet this back to a hundred and you’ll see I get a lot more sensitivity
over the eyes I can really squint and really open up the eyes or I could make
this a little bit further further down I think I added a 50% which isn’t gonna
close it all the way but it gives it enough that you can kind of get that you
know more squinted look and I could bring this even further down to even
make it a little bit more subtle so even something like this adds a nice subtle
effect to your character it’s but you have a lot of options about how you know
how expressive that is so yeah that’s a basic overview of the eyes we get a lot
of questions about eye rigging you know pupils coming out of the eyes or not
understanding blink States or stuff like that so please use this project as a
guide if something isn’t working look at your setup
get the most similar one of these faces to your particular setup and make sure
everything is named and organized correctly and tagged the right way and
all of that stuff and you should be good to go we would love to see what you
create so please use hashtag character animator when you are uploading you know
videos to social media or whatever of your characters we would love to see
what you’re making with this stuff or if nothing is working and everything is
just falling apart and you are completely frustrated with how things
are going the best place to get individual help with your puppet is post
a screenshot on the official character animator forums and we’ll try to help
you out as best we can that’s it for this video thank you so much for
watching and have fun

38 Comments

  • Reply Bahri July 17, 2019 at 10:55 pm

    man i needed this but i also need to know about how to build a character from A to Z with adobe illustrator coz im trying to make an anime character move and there is always something wrong with it

  • Reply Sleepy Newt Creature July 17, 2019 at 10:57 pm

    Oh man, this is too much of a coincidence to pass up! Haha, so Ive been rewatching all your rigging tips for the past hour and searching the forum to try and find a fix for an (admittedly totally non eye related ๐Ÿ˜‚) issue; Please would you be able to tell me why my hands aren't attaching to or moving with my arms? I've set it up exactly as you did in your complete workflow video, but the hands just keep showing up as a completely separate element, even if I put the draggers for the arms directly in top of them – any advice? Thanks so much ๐Ÿ™‚

  • Reply Dexter Monster July 18, 2019 at 12:44 am

    Thanks Dave. I like your "mask" technique for the large pupils. I'm going to re rig my animated self. I used a box with two holes in it but it gets in the way sometimes. Your method of putting the eyes behind the head will work great! I always enjoy your videos. Thank you for your hard work.

  • Reply SuperStory Animations July 18, 2019 at 1:00 am

    Hey! I actually figured out the off center eyes technique by playing around with it. Now I just need to finish my next project

  • Reply Robinson July 18, 2019 at 1:59 am

    hey Dave I have a question, is there a way to deform the eye as it moves to the sides? as you know the pupils are flat inside the eyeball so when you look to the side it looks like a plate and not perfectly round, if you look at a rig like "Any malu" here in youtube(which is a rig in toonboom harmony with lots of drawn frames) the behavior of the eyes can be scaled to give bigger pupils, flatten them when they look to the side etc, is there a way to scale like that, I would like to achieve a similar rig but in character animator.

  • Reply Robinson July 18, 2019 at 2:01 am

    thanks for the video, very nice explanations! especially the big pupil one.

  • Reply Etcetera TV July 18, 2019 at 2:10 am

    amazing bro! ๐Ÿ™‚

  • Reply Allen July 18, 2019 at 3:22 am

    What font are you using?

  • Reply rawan anas July 18, 2019 at 7:02 am

    Hi i am a biggener in cartoon animation, I am confused about what animation program to use,I decided to Adobe animate, but when I saw one of your videos about character animator I thought it's easer to use CH animator to animate face movement, but what about the whole body and the whole scene?.can I import and export files between adobe animate and character animate? Can you please create a complete animation scene video,from start to finish about that ..

  • Reply HotRock SupaJoint July 18, 2019 at 8:16 am

    Name and organization chart at the end is extra awesome. Thanks yo.

  • Reply Learning Software July 18, 2019 at 8:56 am

    You've done it again, fantastic tuturial and we'll explained!

  • Reply Tejiri Animation July 18, 2019 at 11:32 am

    Hi Dave! I'm am an eleven-year-old kid and I don't know how to make a walking position for my puppet, can you make a video on that? THANK YOU!!!

  • Reply Irrelevant News July 18, 2019 at 2:48 pm

    Thank you! I've needed this video for a while.

  • Reply Tony Luong July 18, 2019 at 3:37 pm

    Thank you! The eyes are always the trickiest part of creating the puppets.

  • Reply Kauรช Asciuti July 18, 2019 at 4:55 pm

    Great tutorial Dave! I've been working on a 3D-realistic project and had to make something like the 3rd example with big pupils. In that case I've created CLIPPING MASKS to hide the pupil and the big eyeball behind a form, and that possibility me to move around without problems with the style. Cheers!

  • Reply ATCS MEDIA July 18, 2019 at 6:25 pm

    Trying to locate any tutorial for a one-eyed wink. Can anyone please point me to such a tutorial?

  • Reply Brodie Rush July 18, 2019 at 6:29 pm

    Thanks! I was just having problems with large pupils with a characters. You're awesome!

  • Reply ์–ธ์ œ๋‚˜์›ƒ์Œ July 19, 2019 at 12:28 pm

    Thx! Great explanation!

  • Reply THE GAME SEEKERS July 19, 2019 at 11:18 pm

    Hi, Okay samurai-san. Thanks for the tutorial video. I would like to also see you make a tutorial of face rotation and tips. Thank you for your time.

  • Reply graphicary July 20, 2019 at 10:12 pm

    please can you make a tutorial making a character walks by using illustrator?

  • Reply Fishing in Thailand July 20, 2019 at 10:28 pm

    Thank you.๐Ÿ˜

  • Reply PC 2020 July 21, 2019 at 9:09 am

    The last character. I used that Eye rig and It seems like the eye lids slightly move up and down constantly (just barley but it looks like someone is quarter squinting constantly). It looks a little weird. Ant tips on how to avoid this? Thanks

  • Reply Stephan Bayless July 22, 2019 at 6:56 pm

    This is such a cool tutorial! I'm working on how to rig the eyes of a character with clockface eyes. Haven't figured out how to anchor the hour/minute hands to the center while having the outside move based on pupil movements. I will share my technique when I do!

  • Reply Rock Bottom July 25, 2019 at 12:01 am

    Great Information!

  • Reply Stefan Hanitzsch July 25, 2019 at 3:21 pm

    ten seconds into the video I hoooorray massively already. This is incredibly helpful! thanks!

  • Reply Jim Crick44 July 26, 2019 at 1:28 pm

    As always, an awesome video. Super clear and informative. Youโ€™r the man Dave

  • Reply Luna Zavroski July 27, 2019 at 10:49 pm

    Hello, Iโ€™m sorry to bother you. It I have a question about Premiere pro. I tried googling my question, even in the adobe community but I have found no help and I was hoping you might have the answer. Iโ€™m not sure if it happened after the update this month but I canโ€™t zoom in on my videos anymore. When I toggle the stop watch and change the scale size to animate it, it just doesnโ€™t do anything. The only trick I found was to nest the video and then zoom in(it does work) but it looses a lot of quality. My video looks very blurry. Thank you in advance!

  • Reply Johnas July 29, 2019 at 5:36 am

    Hi dave, I am a complete beginner and want to create an animated story for my students where the character can walk with different movements and there are different scenes for example, a guy walks about from a jungle and rides a boat. Can all this be done in animator cc?
    I have searched everywhere from Google to YouTube but I didnโ€™t find a single tutorial which teaches me to do so, is this even possible?

  • Reply Dwayn arang July 31, 2019 at 2:13 am

    On the eye lids example you say that blink layers are not needed, but your example character never closes their eyes completely. Can you have both eyelids and a dedicated blink layer?

  • Reply BoodleBobs August 5, 2019 at 1:10 pm

    Hi Dave, I wanted to let you know that, I have just won an award (well an honorable mention) at the Top Shorts film festival London for our animated Song #PLIM Perfect Love is Me. Thank you for all your tutorials. Without Dave, There would be no Roger!

    Here is a link to the song https://youtu.be/deV6peiuWZ8 .

    We have done/doing Hindi and Spanish versions too and plan a Chinese version too. it has been brilliant being able to regenerate the new lip-sync using character animator. Without it, these new versions would not have been possible.

  • Reply ู„ูŠู„ู‰ ูˆุนู„ูŠ August 8, 2019 at 8:28 am

    awesome tutorial!
    8:36 you can also put the pupil, and eye ball inside a "group eye", create top and bottom eye lids and make them mask on top of "group eye"
    that way you don't need to create wholes in the face layer, or try to make the eye lids the same size as the eye, you could even simply use rectangles.

  • Reply Creative Fun Learning August 17, 2019 at 8:56 am

    Fantastic video my friend ๐Ÿ‘๐Ÿผ

  • Reply ED October 12, 2019 at 2:12 pm

    In option 3,is there a way to place the blink over the face covering a bit more than just the eye sockets and not behind it like in your design? (let's say the character has permanent slight eye lids that are part of the face for example… or would you make the eyes larger and have those static lids in the eyes folder instead, and the blink over it)

  • Reply Kenneth Fabritius October 27, 2019 at 1:22 am

    Is it possible to use eyelids with a cycle layer?

    What I mean is: use the eyelids behavior as you did in the 4th puppet example, but instead of a single layer for the upper eyelid, cycle through several layers so the eyelid will move in a more realistic fashion (change curvature and shape).

    IF NOT: I would suggest adding that feature.

  • Reply Artifex Rex November 4, 2019 at 1:15 pm

    I've been stuck on pupils for way too long….I think I'm heading back to AE…I can't stand this. They just drift way off the pupil range for no reason

  • Reply Rach Allyson November 6, 2019 at 8:07 am

    Hey Dave, I've rigged my eyes like the first character, really simple, however I'm finding that my eyes are becoming warped whenever I move the pupils. Just on the right side, not the left. Any ideas? I've marked the eyes as independent and the pupils as independent, there don't seem to be any interfering tags or anything.

  • Reply Ace Hardy November 20, 2019 at 3:51 am

    ๐Ÿ”ฅ

  • Reply Don T December 2, 2019 at 8:17 am

    I'm having a tough time with the eye lids

  • Leave a Reply