N.S.L: WEEK 101 – Adobe Edge Animate CC: Animating and Keyframes

CURRENT Edge Animate  WEB-ANIMATION

I Never Stop Learning, and this week was no different! =D The whole time I’m freaking out because this was my first time trying out some of these techniques.

Layout in Adobe Edge Animate CC

Animation layout

This post is a continuation of Never Stop Learning week 100The first things that should grab your attention should be the fonts used in this animation. Since I’m an Adobe Creative Cloud member, I was able to use Typekit to bring in some cool fonts and my text is Searchable!!!

****

Staging for Adobe Edge Animate

I rebuilt my stage with assets from scratch

Last weeks post I used Adobe Photoshop to layout my animation to build my assets. Once I had an idea of what I wanted to do, I tried to make it happen in Edge Animate. You can tell right away that the look of the project changed a bit during this process. Notice that the pigs jet pack is not turned on yet. I turned him into a symbol and animated in some fire. That was the 2nd time I created a symbol in Edge.

****

Keyframes in Adobe Edge Animate CC

Keyframes

I used Javascript to insert a trigger for the flame on the jet pack. First time using Triggers… consciously at least =D I don’t know how to write JavaScript, I know what it is, and I am a lil intimidated =D If you check out the video below, you can see how easy it is to insert some JavaScript into your project with pre-baked triggers in Adobe Edge Animate.

****

I wanted to make some adjustments to the planet while inside Adobe Edge Animate. All was going well until I applied a contrast filter. I really like that Edge warns me that the effect will not appear on specific browsers. I then decided to make my contrast change BACK in Photoshop and update my assets.

****

Check out my:

CURRENT HOSTED WEB-ANIMATION

****

I got most of my info from on Lynda.com:

Edge Animate Essential Training
Creating Interactive Projects with Edge AnimateCreate an Animated Star Field with Edge Animate

****

Checkout:
SebastianBleak.Tumblr
www.SebastianBleak.com

Twitter:
@SebastianBleak
#AdobeGrind #StayMuddyGetFly
If you look up #NSL101 you should be able to follow my week, all of the videos I studied for this one, and other Tweets related to this post.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s