Help! In Animate the color fill disappears between two keyframes with tweening

[student ID]

Hai Everybody! I recently started exploring Adobe Animate. I'm following tutorials, and have fun with it. If I happen to make something work correctly, I´m happy as a clapping seal, but there are these little obstacles I somehow just can´t get passed, and after days of trying, I must admit frustration takes over...:-S

Here's my current problem:

I created a simple image, using the pen-tool, and next I created several Key-frames based on that image, just in several extreme oposite positions (e.g. on frame 1,9,18,27 and 36 in a 24 frames per second document). Between these keyframes, I used tweeing, using the regular procedure: 'create shape tween', and I tweeked out the irregularities using Shape Hints.

So far, so good.

If I play my animation on a loop, all looks good.

The problem started after I decided I wanted to fill my shape using the bucket tool.

I did so, on every keyframe, all still looking good.

But if I play my animation in a loop now, the tween between keyframes 18 and 27 does something unexpected(to me): the color fill disappears at this point in my timeline.

If I select keyframe 18, the color fill looks O.K., If I select keyframe 27, the colorfill looks OK, but somehow on te tweenframes 19-26, the colorfill disappears. 

And despite trying everything I could imagine, including starting all over again, with the entire keyframes, I just can't get a colour-fill in this shape tween. And the weirdest thing to me is: it DOES work perfectly fine on all the other tweens, although I did the exact same thing there...?!

Can anyone help me out here, and tell me what rooky-mistake I'm making here? It's no-doubt too simple to get wrong, but some-how, I can't get it right..

Thanks!

[n. tilcheff · Accepted solution]

Hi mate,

Separate the line from the fill onto two separate layers. Then deal with each one as a separate object if you need with Shape Hints.

Hope this helps!

[student ID]

Hai Nick,

Thanks for your quick response!

I've been trying your tip, at first I thought I made it; throughout the entire loop I had a color fill for all my tweens,.. except now when I played the loop I had a wonky shape Hint in one of my tweens. So I fixed that, but after I did, I had the same problem all over again. So I started from scratch, -again- the outline and the fill on two separate layers, but no matter how I try, I cannot get...

Ohw! Wait 🙂  bashful me!!!

I had one of the layers hidden, because I clicked on the Eye-symbol next to my layer on the timeline, since that was easier during the editing-stage.. Now that I clicked on the Eye-symbol again, and both layers are shown, if I play the loop: miraculously the fill is indeed showing exactly as it should!! Wow!

Could have saved myself a few hours of bungling there, if only I had both layers showing 🙂  Oh well.. at least I won't ever make that mistake again 😉

I still don't understand Adobe's logic behind having to split-up the outline and the fill onto two separate layers in order for it to work, but I'm glad I know that THAT's the fix! 

Thanks ever so much, I would never have figured that out without your help!

But wait.. If I now hide one of the layers again, just to see if the fill disappears again in the tween, the color fill remains perfectly fine.. 

? It scrambles me big-time, but it seems to work for now. I hope that I can reproduce that somehow on my next little project, because it feels a little like it was more sheer luck that it all ended up just fine now, instead of me actually propperly knowing what I'm doing here 🙂

Anyway: I'll definitely use your advice from now on, since that was the change after which it all turned out O.K., So thanks so much!

[n. tilcheff]

Hi again, mate!

I'm glad you got it working!

Shape Tweens are a bit temperamental. 

They only work well with single objects in a layer and fairly simple shapes.

So often you may end up splitting your drawings into multiple layers to have them Shape Tween without issues.

Also: only use hints when you need to and try to use as few as possible. Sometimes they can be placed between points, but in most cases should be on the point.

They are supposed to be read in counter clockwise direction from top-right, so this is the best way to place them.

For best control you should nest shape tweens inside Graphic containers, so that you can move, scale, flip and so on on the outside.

A combination of techniques can produce optimal results.

I use Shape Tweens all the time, but in the case of these jellyfish that come at about 10 sec in the video - they are nearly 100% Shape Tweened.

Since you seem to be keen to learn and improve, here are two of articles that I wrote which may be helpful to get you going.

http://flash-powertools.com/character-rigging-for-flash-animation/

http://flash-powertools.com/workflow/

Good luck!

[student ID]

Thanks Nick!

And thanks for the guidance on the Graphic Containers too, because that is exactly what my next hurdle was gonna be, I allready wondered how to go from here! I figured I´d tackle the shape tween first, and than worry about that next step, since indeed I want to move, flip and rearrange on the outside, but I had no clue how to go about it.

And WOW! on the animation you send along with your reply! Like your style and execution! It made me both verry exited about the possibilities (in my far-far-future;-)), and it made me feel verry green as a freshman at the same time, and made me realise I have a looooong-looong- way to go before I actually am getting somewhere with my 'doodling'. Which is hard sometimes, because I have all these Ideas, and enthousiasm but for the time being no means to get there.. If I realise making a little fish swim for a second and a half allready cost me weeks, and I don't think I'm even half-way there 🙂

Anyways, I'll defenitely use your articles, and advice from now on!

Thanks again!

[n. tilcheff]

First steps are the most difficult ones, because at the same time you need to learn how to animate, how to draw better and how to use the tools to achieve this, while at the same time you often are lacking even the terminology to ask the right questions or express an idea.

It is an overwhelming experience.

So arm yourself with patience and perseverance, break things down to small doable tasks and progress one small step at a time. Small projects that start and end within a couple of months are the best. You learn as you go and apply the new knowledge to the next project. After a year or two you have a body of work which can show growth, exploration of styles and out of which you can assemble your first demo reel.

At the same time write your big, bold ideas down and keep them for the future when you will have the technical means to realise them, but may be struggling to come up with anything that is worth developing. All ages and stages of professional and artistic development come with their challenges and that is the best part: Animation is intellectually and technically very stimulating for the right type of person. It can also be very rewarding.

All the best, mate!

[student ID]

Thank you Nick, for your kind words of encouragement!

Entering this new world that seems to hold so much talent, and developed skills in every direction I look, I am very (self)aware of my own cluelessness.

After posting my question, for a minute there, I felt like I had to be apologetic for being this inexperienced.

I was a little insecure how my ‘dummy-question’ would be received in the community, and wondered a little if I had to brace myself for short-tempered or impatient reactions -if any- from people that where light-years ahead of me.

So I am relieved to receive your kind words of encouragement, which motivate me, and make me feel like I am allowed to learn, and be clueless for now.

Instead of feeling apologetic, I now feel excited about being at the very beginning of my very own journey.

So thank you for making me feel welcome in the community, clueless as I am 😊

I can’t wait to be able to look back a few years in time, and see how all that struggling I am doing now, turned into something I can proudly own,

Thanks again for your guidance!

[jinjala27381691fk8f]

After duplicating a shape in Adobe Animate, why is there no different color in both shapes, what is the solution