FLASH CONSTRUCTION GUIDE (for the ESPN Expandable Leaderboard): If you are looking for general flash guidelines, please click here to view them. - How It Works - File Organization & Requirements - Layers - Timelines / Frames - Buttons - Clicktags - Clicktags: Multiple clicktags in one banner - Clicktags: Tracking Flash Pop-ups - Click Closure: Using the FS Command (Wide Ad Unit) - Sub-Files: Sub File Guidelines - Sub-Files: How to load external Flash movies/video files - CPU Usage Guidelines - Looping - Optimization HOW IT WORKS: A user lands on the site and receives an "intro" (950x210) ad for 8 seconds. The intro then collapses to reveal a banner (728x90) ad behind it. At right, the user has the ability to click a "plus" sign button to re-expand the ad so they can reveal either the intro. portion (950x210) again or if you choose, a completely different 950x210 ad. In short, the 950x210 file can be used for the intro and re-expand or a different 950x210 file can be built specifically for when a user "re-expands". Please visit the ESPN home page for an example. Note: The site may or may not be running an expandable today. This video example shows a previous format but has been provided for reference: Click here for an example that utilizes video. Notes: - The "expand" functionality is set-up within our system and does not need to be set-up using actionscript within the flash files. You do however need to include a clickable layer or layers for your clicktag(s); i.e. click-through links out of the banner. - The banners do not communicate with one another on the front-end so be sure to design them so they look good independent from one another. FILE ORGANIZATION & REQUIREMENTS: Your expandable banners are 2 flash files (3 if you are using a different "intro" 950x210 file) and 2 back-up gif files; 4-5 files total. The flash files are the primary focus of your campaign. The gif files are utilized as back-up for users who may not have flash installed and/or functioning properly. This allows those users to view something vs. nothing while on the site. When it is time to export your files, please name each in the following manner: 0. INTRO: CampaignName_950x210_intro.swf 1. RESOLVE: CampaignName_728x90_resolve.swf 2. EXPAND: CampaignName_950x210_expand.swf 3. RESOLVE (back-up): CampaignName_728x90_resolve.gif/jpg 4. EXPAND (back-up): CampaignName_950x210_expand.gif/jpg 5. VIDEO: CampaignName_(dimensions)_video.swf How to load external Flash movies/video files. REQUIREMENTS: - Flash SWF file needs to be version 7.0 or before. - A default GIF will be served to browsers that do not have a compatible Flash Plug-In. - Frame Rate: 18 frames per second. - Third party served Flash ads must be have a w-mode set to "opaque" in their object/embed code. - Sounds permitted; must be user initiated with an on/off switch (at least 25x25, and clearly visible). - All creatives must be designed with a solid background color to avoid unwanted color conflicts with the displaying page. LAYERS: - Label your layers. - Label and organize your symbols in folders within your library. - Keep actions, or similar types of actions, on the same layer. - Keep your timelime labels on one layer. - Keep each button on its own layer at the top of all the layers so it is never covered. - Make sure it is present throughout the entire movie. If you have multiple click areas, make sure each button has its own layer. See buttons below. TIMELINE & FRAMES: End all items that you wish to have on the screen the entire time on the same frame (at the end of the timeline). This will prevent your banner from going “blank” while it moves to the end of the timeline and then back through. BUTTONS: Set the dimensions of your button layer to be the same as the movie it is in (go to Window and then select “Info.” palette.) Make sure your clickable layer is present on the timeline throughout the entire timeline. CLICK CLOSURE : The 950x210 intro portion must be set up to auto-close at the end of its 8 second animation by calling the following actionscript (applies to Flash units only): fscommand("close","true"); CLICKTAGS/TRACKING: If you would like a step by step "How To", please click here. Click-through functions must use the "Get URL" command. The action script code needed for the button layer in your Flash file should look exactly as it is below. Do not insert your URL where the "http:" is below. This revised action script simply checks to make sure that "http:" is contained within the URL we pass into it. Note: Spell clicktag using only lowercase letters. on (release) { if (_level0.clicktag.substr(0,5) == "http:") { getURL(_level0.clicktag, "_blank"); } } - Hard coded URLs are not allowed to be passed via the "Get URL" action. - Current resources: http://mediakit.go.com/shared/flash_guidelines.html The action script for the button layer in your Flash file should look exactly as it is above. Do not insert your URL where the "http:" is above. This revised action script simply checks to make sure that "http:" is contained within the URL we pass into it. This is updated action script based on security measures recommended by Macromedia. According to Macromedia, "The ActionScript...is verifying that the clicktag URL begins with "http:". This is an important security measure. If you do not take this precaution, a malicious HTML page could source your SWF and pass a clicktag URL that begins with "javascript:" or another scripting pseudo-protocol. If your ActionScript code were to call getURL with a maliciously crafted JavaScript URL, it would be possible for the site serving the malicious HTML page to obtain the contents of your HTTP cookies or perform other actions on your site's behalf." For additional information on implementing clicktag ActionScript, visit Macromedia's Flash Tracking Kit. CLICKTAGS (MULTIPLE CLICKS WITHIN ONE BANNER): If you have several url’s that a banner will drive traffic to, use the same clicktag code as above, but for each different clicking url, utilize a different name for the clicktag - example below. Essentially, you just need to use a different clicktag so our system can react accordingly: url1 – clicktag url2 – clicktag2 url3 – clicktag3 url4 – clicktag4 Tip: When using multiple clicktags, be sure to designate each clickable area with a button of its own and make sure that you don't overlap buttons. SUB FILES: USING VIDEO IN YOUR 950x210 (expanded portion): If the additional Flash movies or outside data files are to be hosted by WDIG, the following action script method, or some suitable variation, must be used in the main Flash movie for pulling in the addition .swf files: loadMovie(_level0.moviePath, [TARGET]); _level0.moviePath will be specified in our Flash code. This allows us to pass in the full path to the video file where it will be hosted from on our ad server. [TARGET] specifies where in the main Flash movie you want to place the outside swf file. This can be either a level or a movie symbol, depending on how your main Flash movie was built. Upon receiving the video file, WDIG will save the files to be loaded into our ad server and referenced from that location. SUB FILE Guidelines: Here are the main components and aspects to consider when utilizing sub-movies: Click here if you would like to see HOW TO CREATE and LOAD A SUB MOVIE. GENERAL: - Mandatory controls: Play, Mute, and Pause or Stop. - Within the main movie, be sure to either create a button and the appropriate actionscript code to initiate the loading of the sub movie. - Oftentimes we receive files that have numerous sub loading files. For ease of launch and implementation within our system, please incorporate all files into the main movie except video files or extra large sub movies. - Create and add a sound control/mute button. Set the video to play silently so the user has the option to initiate it. - Mandatory controls: Play, Mute, and Pause or Stop This video example shows a previous format but has been provided for reference: Click here for an example that utilizes video. - When linking to an external video file, please just refer to it locally (moviename.flv) and keep it in the same folder as the main/referring flash file. We will adjust the reference url accordingly once we have it loaded into our Ad Scheduling system. - Video is not allowed in the 950x210 intro portion of your ad because it is not on the screen long enough to play much of the video. - When the bottom portion (950x210 expand) of the ad is expanded (by the user), the video "play" is required to be user initiated. It is also required that it stops when it resolves back up into the top portion (728x90) - which is controlled by user click. - It is recommended that you have a stillshot video image where your video will play within the (950x210 expand), and the proper video controls below it, so the user can initiate video play. - Audio is required to stop when a user closes the ad and it resolves back up into the 728x90 portion. CPU USAGE GUIDELINES: Macromedia's Flash Player utilizes a computer's CPU (central processing unit) in handling all animation, masking, and computation contained within a Flash file. If a Flash file contains heavy amounts of mathematical computation for elements such as animation, loops, or timers, it will require a much greater percentage of CPU usage. As a result, the Flash file is forced to compete with other Flash files and other applications for CPU usage, which causes all Flash elements on the page to slow down significantly. There are several ways to help cut down on the CPU usage your Flash file requires. One way is to limit the amount of "math-based" animation - animation which is controlled by mathematical-based action script. Another way is to limit or eliminate looping functions in action script. Looping functions are usually associated with timers. Masking and animated masking techniques can also require a large amount of CPU resources. One way to estimate how CPU intensive your Flash file may be is to open the "Task Manager" (control+alt+delete) and view the "Performance" tab -- this gives a graphical estimate of CPU usage. With the Task Manager open, then open your swf file in the Flash player - you may see a spike as your Flash file is animating.   A small spike of 20-30% is normal; if your CPU Usage jumps up to 80-100%, the Flash file may need revising until it uses less CPU resources. For more information on optimizing Flash files, see Macromedia's article, "Streaming and file optimization techniques for Flash Player". WDIG reserves the right to reject creative if it requires a higher than normal percentage of CPU resources and would, as a result of this, cause other page elements to slow down. TRACKING (Flash Pop-ups): Flash creative must adhere to all other WDIG standards, with the following exception -- rather than having the getURL function call "clicktag", it must call the following: getURL("javascript:popAd_SPONSOR_NAME_HERE();") In place of SPONSOR_NAME_HERE, you will put your company/sponsor name. For example, for Ford Motor Company, the action script would look like so: getURL("javascript:popAd_Ford();") Putting the sponsor name will help to assure that we are never calling the same function twice on any given page. This will call the function which pops open the window. This function will include our tracking script, along with the destination URL and all the specifications for the pop-up window. LOOPING: If you would like your banner to loop infinitely, just end your movie items all on the same frame and don’t use a stop frame at the end. Flash will automatically loop back to the beginning. Recommendation: If you would like some time to lapse before replays, then add frames to the timeline for the items you would like to leave on the screen. If you would like your banner to loop a specific number of times, use the following code: Arriving shortly. OPTIMIZATION: How to optimize a flash file. Macromedia Resource