Flash Letter by Letter Animation with TweenMax: The NBC Effect

Awsome!!!!!! man this is getting more and more impresive, thanks Carl so much, those Tweens looks amazing, I cant wait for the next tuto.looks fantastic.

I have a dout, when I'm testing my video, after the flash text starts, those tinny little white squares appears too. how i get rid of them? and this is a silly question, I dont know how to loop the entire animation i just give to each Tween a repeat value?..

Thanks

keep up the good work.

Thanks for feedback. The white squares (which are the text folded down) caught me a little by surprise when I was recording!

when dealing with objects in 3D space they look different depending on where they are on the stage. You'll notice that they disappear once I move the white text down to the vertical center of the stage.
it all has to do with where the object is in relationship to the “virtual camera”.

imagine a piece of paper sitting flat on your desk. if you raise it up to be exactly at eye level so you are looking straight at the edge… you probably won't see anything at all. If you position the paper lower and lower you will see more and more of the top side. As you raise it above your head you will see more and more of the bottom. This is what happened when I put the white snorkl.tv text above the center point of the stage. so those little white squares were actually the bottom of the text when it was flattened out at a rotationX of 90.

to remedy this problem you could set the alpha of the movieclip containing the letters to 0 before the tweens start and then then set it to 1 when the tweens begin.

As for repeating the tweens… it is not so easy using the method I showed. The method I used is easy to set up and run once.. but not so easy to control later on.

To have control over repeating the entire animation, rewinding it or slowing it down you need to use TimelineMax. That was my original intention but it ended up being a bit too complicated to cover in a single video.

It is possible that when the last tween is done you can use onComplete to reset the values of all the movieclips and then run the sequence again, but it is a bit of work.

I plan on adding a follow-up video to this post to address your comments as I imagine others will have similar issues. Its really tough trying to cram the important details into 15 minutes!

Thanks again for watching. Stay tuned.

The alpha works as the same for the made fun word thanks, well I wait for those TimeMaxLineTime, I post a link , here the tweens in the link can be make with the same technique??????.

http://wow.spark.mx/

take care

Just wanted to say a big thank you for doing these tutorials – TweenMax has solved all the gripes I previously had with tweening in Flash, and your instruction makes it even easier to use…awesome work, and looking forward to more of your stuff!

Hi Angela,

Thanks so much for taking the time to comment. Glad to hear you have enjoyed the tutorials. I have a bunch more planned just gotta get a little pesky work out of the way.

If there is anything particular you would like to see, just let me know.

Carl

Hello Carl,
I'am a new fan Snorkl TV.
First of all: THANK YOU for your tutorials! They are great, clear and simple!
In the NBC Effect, why don't you use the Greensock's “SplitTextField” class to seperate the letters? Is it possible to use it for spanding time?

Sorry for my english: i'am a belgian french speaking.

Thank you for your answer and byes from Brussel.

Jan

Hi Jan.

Yes SplitTextField would be absolutely perfect in this scenario. I am itching to explain it to people. I have to experiment with it a bit myself as I am just newly a Club GreenSock member. SplitTextField is a very exciting tool with amazing potential. Starting out I wanted to focus on all that you could do with the free version of the GreenSock Tweening Platform.

Thanks for the kind words and for contributing to the conversation.

Carl

Bonjour de san Francisco

schoof awesome work man thanks,

Thomas M

Schooff

no sweat. glad you liked it. catch you around.

Check this class for split a textfield into lines, letters etc.and then use your tweening engine of your choice. Really nice in my opinion:

http://code.google.com/p/textanim/

I like the crickets in the background

Great Video!
i have a problem, whenever i play the animation, the first time (i made it repeat 3 times) the first letter is missing, then the second and third time everything is fine, i did it with timelineMax and TweenMax.

Thanks noob94.

i don’t have much to work with as far as trouble shooting from the information you provided.

remove everything from your code that isn’t necessary for the “glitch” to be seen. for example if you have 30 tweens in your timeline, but the glitch still happens with only 2 tweens… i just need to see the timeline set up and how you added your tweens.

carl