Previous: CSS Quicklinks - Page 8 of 14 - Next: Drew Homepage Flash

Drew CLA Flash

Perhaps the most complicated Flash object on the Drew University site, the CLA Cork Board is an interactive piece that presents the user with marketing content for multiple categories.  The Cork Board originally was envisioned as a pile of photos that the user could sort through.  Placing those photos on a wooden background like a desk eventually led to the idea of placing them on a cork board.

The navigational concept is a simple one ... a user clicks on a photo to find out more about that area.  However, instead of just bringing them directly to a new page with information about the subject area, the photo enlarges and then a flash movie is loaded on top.

Dynamically loading these movies allows for a much faster page load than would typically be available. This is important on the landing page for an entire school.  Current students have no interest in watching marketing materials, so it would be wrong to make them wait for them to load.  Also, having each presentation in a separate file allows us to update individual sections much more easily. 

The images are animated programatically instead of through traditional methods because it gives us smoother transitions and a more flexible system.  The images are placed in spots that defined by a position, scale, and rotation and are animated by interpolating between the previous position and a new position over the course of a given number of frames.  So, for example, if a picture is at coordinate (0,0) and needs to get to (10,10) in 10 frames, a counter starts and the program calculates the position along that counter.  At (counter=0), the object is at (0,0). At (counter=1), the object is at (1,1).

This sort of linear interpolation is very easy to implement, but leads to slightly "jerky" transitions.  So, to aleviate that we interpolate along a cosine curve.  This way the objects start moving gradually and then come to a gentle stop.

The campus map, instead of being implemented within the flash, is a popup window spawned from within the flash presentation.  The presentation will try to spawn the popup automatically, but because that will often get blocked by a popup blocker, there's also a button to push to start the popup (popups from button presses are usually not blocked).

To see the CLA Cork Board flash animation in action, visit http://www.drew.edu/cla.aspx.