33
IMDb.com Flash Ad Templates A StepbyStep How to User Guide
IMDb.com Flash Ad Templates A Step-‐by-‐Step How to User Guide
• QA-‐cer@fied tracking and compliance • Expanded and minimized frames • Easy to use components with tracking – Videos (including YouTube player) – Slideshows – Website buNons – Social media buNons – Timeline naviga@on buNons – Expanded and Minimized states
• Date-‐specific content
AS3 Ad Product Templates
2
• Billboard • Expanding Billboard • Auto-‐Expanding Rectangle • 3-‐Pack Expanding Rectangle • User-‐Selectable Wrap • HD Lightbox
Our Templates
3
Default clickTag clickthrough “M-‐BuNonBackground”. Place on a layer below clickable buNons and above background art. Uses primary clickTag.
4
Website BuNons 1. M-‐BuNonWebsite1-‐6. Drag from the library onto the stage 2. Enter Website URL , Tracking URL (gotoFrameLabel op@onal) 3. NOTE: Parameters can use either a standard URL, or clickTag# (for clickTag5, just enter 5).
5
1
2
Social BuNons 1. M-‐BuNonSocial. Drag from the library onto the stage 2. Enter Website URL , Tracking URL (gotoFrameLabel op@onal) 3. NOTE: Parameters can use either a standard URL, or clickTag# (for clickTag5, just enter 5).
6
1
2
Timeline BuNons
7
1 2
1. M-‐BuNonTimeline. Drag from the library onto the stage 2. Enter Frame Label to go to, and gotoAndStop or gotoAndPlay ac@on. 3. NOTE: Parameters can use either a standard URL, or clickTag# (for clickTag5, just enter 5).
BuNon States Change buNon graphics by double clicking into the MovieClip and changing the graphics on the hit states.
8
Expand BuNon 1. “M-‐BuNonTimeline#”: Drag from library to stage 2. Enter gotoFrameLabel for Expand frame and a Tracking URL
9
1
2
Minimize BuNon 1. “M-‐BuNonTimeline#”: Drag from library to stage 2. Enter gotoFrameLabel for Minimize frame and a Tracking URL
10
1
2
OnceADay (FP) aka Flash persistence “M-‐OnceADay” Component will play an intro anima@on or video once a day, and skip to a resolve frame on the next visit. 1. Drag the component from the
library to the stage on frame 1. Place it on the stage but out of view.
2. In “Component Parameters” enter the frame labels for the intro anima@on and the resolve frame.
11
OnceADay Component: Flow
12
1
2
SlideShow “M-‐SlideShow” cycles through up to 15 images and track start and slide changes. Enter URLs or clickTag number for slideshow images.
13
M-‐SlideShow: Flow
14
2
1
Manipula@ng M-‐SlideShow To resize M-‐SlideShow, double-‐click into the component. On the “SizeOfSlideShow” layer adjust the size of the green box and move the controls where you want. Images will automa@cally resize to the size of the green box.
15
Video
Videos can be resized and animated inside MovieClip. The controls are op@onal and can be changed by going into the MovieClip and changing the graphics.
“M-‐VideoMedium” and “M-‐VideoLarge” play date-‐specific videos with tracking for begin, mid and end. If clicked while playing, users are sent to the default clickTag. M-‐VideoMedium and M-‐VideoLarge are two instances of the same component, pre-‐op@mized respec@vely for a regular (resolve state auto and user-‐ini@ated video) and immersive (full autoplay intro) video state
16
M-‐Video: Flow
17
1
2
M-‐Video: Component Edi@ng To resize video, double-‐click into the video component. On the RESIZE SCREEN layer, adjust the size of the green box and move the controls as desired. The video will automa@cally resize to the size of the green box. The progress bar and scrubber will adjust to the width of the resized green box but need to be posi@oned ver@cally.
18
Video
For date specific videos, set Release Date: • Now Playing: release date + 25 hours • Today: release date + 24 hours • Tomorrow: release date – 24 hours • This X day: release date – 6 days • Next X day: release date – 13 days
REQUIRED Default URL, Track Start URL Track Mid URL and Track End URL
19
Immersive Video
20
Look for M-‐VideoLarge at the aStart label for the immersive video on billboards and expandable billboards.
YouTube
2
1
YouTube Resizing Video To resize video, double-‐click into the video component. On the RESIZE SCREEN layer adjust the size of the green box. The video and YouTube controls will automa@cally resize to the new dimensions of the green square.
YouTube Parameters NOTE: YouTube only tracks views that are manually clicked by users. Do not check Auto Play if you want YouTube to increment views. REQUIRED Default URL, Track Start URL and Track End URL (Use either URL or clickTag #’s for videos/trackers paths) For date specific videos set Release Date (This X Day and Next X Day can override the 6 and 13 day defaults) Now Playing = release date + 25 hours Today = release date + 24 hours Tomorrow = release date – 24 hours This X day = release date -‐ 6 days Next X day = release date – 13 days
Date Checking and Messaging
Use “M-‐DateSpecific” for date messaging.
24
2
1
Date Checking and Messaging: Component Edi@ng Change text and images on frames to display content on specific dates.
25
Best Prac@ces
26
Key Frame Anima@on Tips • Use frame labels and buNon components to move around
the @meline and track user interac@on • To stop the main @meline when a video starts, check the
box "onStart Stop Timeline" in the component parameters panel.
• Aqer a video finishes playing, the main @meline can automa@cally start playing or can go to a key frame. – To start the main @meline when a video ends, select "play" from the "goToFrame Ac@on".
– If you would like to jump to a frame label when a video ends, enter the frame label in the "onComplete Go To Frame" box in the video's component parameter box, and choose either "gotoAndStop" or "gotoAndPlay" in the goToFrame Ac@on" box.
27
Scripted Anima@on Tips • Keep anima@on simple, and place most of the keyframe
anima@on on the main @meline. Use frame label calls to play and move to keyframes
• Try to use classic tweens rather than tweenLite, mcTween or Caurina to keep file sizes down and reduce tween class overhead
• When using an external tween class, use only one and not a combina@on of classes
• Put stop() and gotoAndPlay() ac@ons on the AS layer • Put all frame labels in the Labels layer
28
Local Tes@ng • To test ads locally, use hNp:// paths for videos and
slideshow images instead of clickTag numbers. • To verify the click trackers are recording correctly, preview
in the Chrome browser and use the network traffic tab to verify click trackers are being requested when clicked. – In Chrome, Open Developer Tools (View > Developer Tools) – Click on Network tab – Network displays image requests and what files are loading, so tracking requests can be monitored when buNons are clicked
– Alternately, Firebug for Firefox can also verify network traffic
29
General
• In addi@on to photos and videos, large keyart should be called externally to op@mize file size.
30
Appendix
31
Naviga@on: Timeline, Website and Social Timeline navigaCon. Edit appearance by drilling into the movie clip. Enter a frame label and select gotoAndStop, gotoAndPlay or Play and enter a tracking URL.
32
Website/Social navigaCon. These work like @meline naviga@on buNons, but open external links in addi@on to naviga@ng the @meline. Social buNons conveniently include all current social network logos.
* M-‐BuNonBackground is the only buNon that does not allow users to enter a URL, but defaults to the primary clickTag for the default url. Duplicate this movie clip if addi@onal buNons with primary clickthrough func@onality are desired.
*
Ques@ons? Contact [email protected]
