alohahands.com Blog

Transitions, web site transitions

September 15th, 2008

According to the msdn website, “Transitions are time-varying filters that affect how a change of content is displayed.” Basically this means that a transition is the same as other events, but instead of an instantaneous change of state, it happens over a specified period of time.  Mostly, we see transitions used during slide shows containing different images.  These are usually a wipe, or fades; a screen slide from right to left or left to right or a fade in and out.  An interpage transition is a transition that affects the entire window as the window loads and/or unloads.    This can be the same type of fade as the slide show.

In my opinion a lot of the web site trends are revolutionary and based on the latest technology.  With a new software product and capability, something old becomes new again.  The concept of most web sites is “attraction”.  The owner of the site wants you to view their site.  Transitions may or may not keep our ADD intellects amused long enough to hang out longer than 10 seconds.  I think I read the average web page can expect a visitor to make up his mind about leaving the site at about 4 seconds.

What do I think about the growing trend of using transitions?  Well, depending on their use, I think there is great potential for transitions. I like to think that transitions can be used for wonderfully interesting visual explanations for complicated or convoluted processes; for example this one showing how our bodies use energy and the resultant free radicals are bounced down the electron transfer chain to O2 in the process of oxidative phosphorylation:  http://www.brookscole.com/chemistry_d/templates/student_resources/shared_resources/animations/oxidative/oxidativephosphorylation.html

Transition trends are pretty cool; some are so cool they’ll stick around for over a week.  If you only want to show off your new skills and your transition does not enhance or contribute to the value or message of your site (determined by the visitor) then you’re likely to come to your senses or latch on to the next super coolness.

http://www.webpagesthatsuck.com/does-my-web-site-suck/does-my-web-site-suck-checklist-part-one.html

http://www.webpagesthatsuck.com/topic60.htm

http://msdn.microsoft.com/en-us/library/ms532847.aspx

http://www.webdevelopersjournal.com/wacky/transitions/transitions.html

http://www.xeogen.com/

http://www.adobe.com/devnet/flash/articles/animation_guide_13.html
http://tutorials.learnflash.com/tutorials/flash/bettertransitionss.html
http://www.adobe.com/devnet/flash/articles/creating_animation_as3_02.html

The page located here:  http://www.jumpeyecomponents.com/Flash-Components/Transition-Effects/MovieClip-Transition-Effects-V3-45/
has a graphic that transitions from one image to the next.

AS 2.0 thread on transitions:  http://forums.creativecow.net/thread/190/862393

http://www.robertpenner.com/presentations/rpenner_Animation_Workflows_in_Flash_CS3_FITC_2007.pdf

sliding door transition:  http://www.swishzone.com/index.php?area=resources&tab=movies&do=page&action=detailed&link_id=598

Entry Filed under: AS2, AS3, All, DHTML, JavaScript, Tutorial, actionScript, css, personal computer, web design