Tuesday, February 06, 2007

WPF/E - How to Animate your Name!

Hey Readers...

During my undergraduate career I studied computer science. I was looking to expand my knowledge into working with some technologies that were closer to the user experience. Because of this, I took a Flash class in another department. One of the required projects was to create a basic animation that would animate our name. At that time, the movie "The Matrix" was pretty big, so I used that as the premise for the animation. I'm sure you've all seen it.

I decided to take that animation and re-create it using WPF/E. My main focus was I wanted to see how efficient the JavaScript was while attempting to "animate" (please note, I'm not using the WPF/E Animation, rather animation via JavaScript) several items. The code for this project is available here. It would definately have been more savvy to let the JavaScript generate the textblocks. However, I wanted to see how the technology would perform with the manipulating each textblock individually. I was very happy with the result.

If you have any questions about the code, please feel free to post a comment. In addition, I have some ideas for some other types of controls I would like to post over the next couple of weeks, so stay tuned! Now, here is the little name animator. Enjoy!





NOTE: This code was written with the WPF/E Febuary 2007 CTP

7 comments:

rei said...

Hah nice :D

Mark Heath said...

very cool

jason said...

Nice! That's so much more ambitious than what I did with my WPF/E dynamic text input experiment. Nice to see more experimentation going on with WPF/E.

Sean Alexander said...

Cool- nice work

Caleb said...

Very cool Chad. I can barely spell WFP/E but it seems very slick. How does it compare to the Flash tools?

Anonymous said...

I took your example and tweaked it to use a Matrix digital rain type of animation.

http://blogs.sqlxml.org/bryantlikes/archive/2007/02/13/wpf-e-matrix-reloaded.aspx

Michael said...

Thanks for the nice post!