Snorkl Report October 2012: New Beginnings

Dear Readers,

Just want to give you all a little (ok, long-winded) update on what I’ve been up to in recent months and what’s on the horizon. Its been awhile since my last post and I’ve been dying to officially share with you some tremendous news.

Continue reading

Posted in SnorklReport | View Comments

Exploring Generative Canvas Art with TweenMax JS and KineticJS

I continue to be blow away by how fast the GreeenSock Animation Platform is (js speed test), but often canvas performance disappoints and I get ridiculous CPU spikes. Most likely it is due to operator error. I found KineticJS to do a fantastic job of making it real easy to get up and running with canvas while achieving fantastic results.

After just a few minutes of trying to marry TweenLite with the basic KineticJS Circle Tutorial I stumbled into an amazing generative art experience. Take a look inside to get a feel for how a seemingly complex effect can be achieved by just combining a few very simple steps.

Continue reading

Posted in GreenSock Tweening Platform Tips | View Comments

The Long Road to Building an Interactive Peacock without Flash

Breaking News: As the tectonic plates of technology continue to shift beneath our very feet snorkl.tv unleashes more evidence of the growing potential of javascript-based animation. Rumor has it that animated interactive peacocks can be built today without Flash. Can it be true?

 

Continue reading

Posted in GreenSock Tweening Platform Tips, HTML5 JS CANVAS, Just for Fun | View Comments

Banner-style Animation with GreenSock-powered JavaScript

I have a really fun and stylish demo of banner-style javascript animation for you. The main player here is TimelineLite from GreenSock’s tangy Javascript port. I created this demo to try to prove to myself that:

  • banner animation outside of Flash is viable
  • the performance and precision of sequencing would not be barriers

Come inside to judge for yourself.

Continue reading

Posted in GreenSock Tweening Platform Tips | View Comments

GreenSock v12 Beta Released: JavaScript Preview

It’s finally here! GreenSock has just released the GreenSock Animation Platform v12 BETA (GSAP v12). The big news is that GSAP has now been ported to JavaScript. I know tons of you have been waiting for this. I whipped up a fun litte demo using all your favorite and some new features of this robust animation platform. Take a look!

Continue reading

Posted in GreenSock Tweening Platform Tips | View Comments

Fun Vector Butterfly Flash Animation

This movie requires Flash Player 9

Here’s a little departure from the norm. Just want to share with you a little butterfly animation that I whipped together. I grabbed a static butterfly and simply animated the wings in a self-contained movie clip symbol. Grab it and use it any way you like. Download and details inside.

Continue reading

Posted in Just for Fun | View Comments

SlowMo Ease with yoyoMode

This movie requires Flash Player 9

I have an exciting update for you regarding GreenSock’s SlowMo ease. There is a new feature called yoyoMode which allows you to easily synchronize fade, de-blur and other effects with positional SlowMo tweens. yoyoMode configures a SlowMo ease to tween to a target value, hold throughout the linear portion and then tween back to the original value. Prior to yoyoMode being invented it was quite awkward to synchronize a fade-in and fade-out tween with items that were being moved by a SlowMo ease.  It is now super simple.

Continue reading

Posted in GreenSock Tweening Platform Tips | View Comments

Introducing the SlowMo Ease in GreenSock Animation Platform v12

This movie requires Flash Player 9

I am hugely excited to introduce you to the new SlowMo ease! This ease is a total game-changer and will make it insanely easy to create animations that were previously very tedious and awkward. The SlowMo ease allows you to get super smooth transitions into and out of steady linear eases. This singular ease seamlessly combines 3 eases and is incredibly flexible. Come inside to find out more!

Continue reading

Posted in GreenSock Tweening Platform Tips | View Comments

GridSplitter: Solution

The GridSplitter challenge is over. I enjoyed receiving and reviewing all the AS3 and JS solutions. Take a peek inside to see how it was done.

Continue reading

Posted in Challenge | View Comments

Code Challenge: GridSplitter

This movie requires Flash Player 9

Time for a new code challenge open to both ActionScript and JavaScript developers! This challenge is going to be fairly easy for those of you who have followed this blog closely, but I guarantee it will be a worthy exercise for many regardless of experience or background.

The challenge is to take a single image and break it apart into many elements that grow and colorize on roll over as illustrated in the swf above.

Full scoop inside.

Continue reading

Posted in Challenge | View Comments