Connect
To Top

FLASH OPEN SOURCE: Preloader driven animation

I know it has been way, way too long since I have uploaded any new open source to any of my sites. I used to have a better balance between design and production/actionscripting but lately have been concentrating almost entirely on design and I wanted to get things back in balance. I have started work again on the new version of my portfolio site, have been sprucing up this blog and have been coding again.

I started back in with this simple file that uses a preloader to control the progress of a timeline animation. In this case the couch animation is broken up into eight parts and each part will only play once the corresponding percentage has been loaded. If the whole file loads right away like in this case the animation will play straight through. The best way to see it in action is download the file, publish it and run the ‘simulate download’ under the View option.

The heart of the script looks like this –

p = Math.round((_root.getBytesLoaded()/tkb)*100);
// This calculates the amount of the file that has loaded in bytes and concerts it to a percentage.

// This uses the range calculated what part of the animation should be played.
if (p >= 90) {
this.couch.targetnum = 8;
} else if (p <= 89 and p >= 80) {
this.couch.targetnum = 7;

and so on. This runs in a loop until the file is loaded and it goes on to play the transition to the image.

Download for Mac | Download for PC

You must be logged in to post a comment Login

Leave a Reply

More in Digital culture

Creative Director, Designer, Brand Builder, Speaker, Podcaster, Crazy One. As a designer, I have 20+ years experience creating the strategy, concepts, and designs for award-winning integrated global advertising campaigns, building multiple global Fortune 500 brands and creating innovative digital experiences. As a leader, I have 15+ years transforming agency and client-side teams using a mix of creativity, business strategy, process and political skill to create innovative, world-class work and cultures that change industries and companies. My clients have included American Airlines, W Hotels, Disney, Citi, ExxonMobil, Acura, Old Navy, Nationwide Insurance, Verizon, Subaru and many others. My work has received over 150 international awards, my app designs have been named as one of the World’s 100 Greatest Apps, Apple has featured my work in 9 keynotes, 4 TV commercials and more.

Follow Me On Instagram

 @baitme did an incredible job on the Mr Dob by @takashipom - details are fantastic. #takashimurakami #takashimurakamiart #mrdob #complexcon #bait #arttoy #designertoys #contemporaryart #popart #vinyltoys #urbanvinyl  Love coming home after a long week to find Mr Dob by @takashipom and @baitme waiting for me. #takashimurakami #takashimurakamiart #mrdob #complexcon #bait #arttoy #designertoys #contemporaryart #popart #vinyltoys #urbanvinyl  More in love with our @obeygiant from @galerie_itinerrance more every day. #streerart #shepardfairey #shepardfaireyart #shepardfaireyobey #streetartist #globe #earthcrisis  Feels a bit like Xmas today as our Earth Chrisis @obeygiant pieces and more showed up from @galerie_itinerrance in Paris. #obeygiant #obey #shepardfairey #streetartist #streetart #streetartparis #galerieitinerrance  Briefcase 2.0 thanks to @louisvuitton Avenue champ de Elysees #apolloalldaybag #louisvuitton #louisvuittonmonogram #monogrameclipse #lv #design #creativedirector
 Hello my name is Steve Gates and I have a Mr Dob by @takashipom problem. #takashimurakami #takashimurakamiart #mrdob #complexcon #bait #arttoy #designertoys #contemporaryart #popart #vinyltoys #urbanvinyl  Spending a lot of time away from home lately so looking forward to getting home tomorrow to see these two crazy ones. #NationalPuppyDay #pugs #pugsofinstagram #pug #puglife  Brunch with @thechiclibrary before I hit the road again #chic #tomford @blackscale #blackscale @tomford #brunch #fashion  I always love the unwritten rule in Barcelona where you can create street art on doors and shutters but not the actual buildings. #streetartbarcelona #barcelona #streetartofficial #streetart #streetartist  Another preview of our commission from @tristaneaton and based on the 'crazy' in letterpress type and archery target you should know this is my side of the piece. #tristaneaton #tristaneatonart #tristaneatonmural #streetart #streetartist #streetartofficial
 Everything is better on pairs so we got the crazy limited edition Gold Mr Dob by @takashipom and @baitme too. #takashimurakami #takashimurakamiart #mrdob #complexcon #bait #arttoy #designertoys #contemporaryart #popart #vinyltoys #urbanvinyl  Another preview of our @tristaneaton commission. Full photos coming soon #tristaneaton #tristaneatonart #tristaneatonmural #streetart #streetartist #streetartofficial  The @obeygiant globe is a limited edition replica of the one which hung from the Eiffel Tower last year and was made by the worlds oldest globe maker. #galerieitinerrance #streetartparis #streetart #streetartist #shepardfairey #obeygiant #obey @galerie_itinerrance  My kind of street art from the Gothic Quarter in Barcelona #streetart #streetartist #streetartofficial #barcelona #streetartbarcelona #hola #skull  Our abdominal snow Pug loves the weather and the 16" of snow at our house north of NYC which feels more like north of the wall today. #pug #pugs #pugsofinstagram #nyc #westchester #snow #northofthewall

Copyright © 2015 Stephen Gates