Erstellung eines Wallpaper Ads / Hockeysticks - Stand 04/2010
←
→
Transkription von Seiteninhalten
Wenn Ihr Browser die Seite nicht korrekt rendert, bitte, lesen Sie den Inhalt der Seite unten
Erstellung eines Wallpaper Ads / Hockeysticks Stand 04/2010
Definition eines Wallpaper Ads
Benötigte Dateien:
• Kein Fallback!
• 1x1 swf: leeres transparentes Pixel zur Positionierung (max 40kb)
• 728x90 Superbanner Flash: Swf (max 40kb)
Alternativ kann anstelle des 728x90 Superbanner ein 972x90 Superbanner eingesetzt
werden.
• 120x600 Skyscraper Flash: Swf (max 40kb)
• 120x600 Skyscraper Fallback: Gif/Jpg (max 40kb)
Alternativ kann anstelle des 120x600 Skyscraper ein 160x600 Skyscraper eingesetzt
werden.
Optional ein zweites Ad: Hintergrundgrafik oder Farbe (Hexcode)
© 2008 Eyeblaster. All rights reserved
Hintergrund eines Homepage Takeovers
1. Als Hintergrund kann eine Farbe eingesetzt werden.
Dazu benötigen wir entweder einen Hexcode oder ein 1x1 großes gif mit der Farbe, dass dann gekachelt wird
2. Als Hintergrund kann ein Verlauf eingesetzt werden.
Er kann horizontal (1x3000 px) oder vertikal (2000x1 px) gekachelt werden
3. Ein Bild. Auf Grund der verschiedenen Auflösungen verschiedener Monitore kann es da zu Komplikationen kommen.
Es gibt Browser (Safari, Chrome), die Hintergrund über Eyeblaster generell nie anzeigen. Beim Ändern der Größe des
Browserfensters, kann sich der Hintergrund verschieben.
Außerdem sind Hintergrund über Eyeblaster niemals klickbar. Daher raten wir davon ab Motive oder Logos in den
Hintergrund zu setzen. Besser wäre 2 Skyscraper in bis zu 180x600 px Größe zu nehmen und neben den Content zu
setzen.
Beispiel mit Skyscrapern, wenn der Beispiel mit Skyscrapern, wenn der Hintergrundgrafik kann bei Verändern der Größe
Hintergrund nicht angezeigt wird Hintergrund angezeigt wird des Browserfensters Verschoben werden und ist
auch nicht klickbar
© 2008 Eyeblaster. All rights reserved
Erstellung eines Wallpaper Ads
Benutzen Sie ein Template
• Geben Sie dem Ad einen Namen (Ad Name)
• Wählen Sie einen Speicherort aus (Location)
• Wählen Sie ein Format-Template
• Klicken Sie “Create”
© 2008 Eyeblaster. All rights reserved
Expandable Banner im Workshop
Workshop Fenster zur Übersicht
vom Basiselement (1x1) und
Expandelement /Panels (alle
anderen Ads als Panel).
Es wurde ein Ordner auf Ihrem Rechner
erstellt mit dem Ad Namen. In der Flash Umgebung sind
Hier befinden sich die Dateien: nun Basis- und Panelelement
geöffnet und können
.fla (Basis-und Panelelemente), .ebs und
bearbeitet werden.
.eba
© 2008 Eyeblaster. All rights reserved
Eyeblaster Actionscript 1x1 und Layer
In jedem Ad, was über Eyeblaster laufen soll, muß folgendes im 1. Frame stehen:
AS2: #include "ebFlashActions.as“
AS3: include "/Documents and Settings//Local Settings/Application Data/Adobe/Flash
CS3//Configuration/Include/ebFlashActionsAS3.as"
Ansonsten soll der erste Frame frei von Movieclips oder Grafiken bleiben. Im Expandable Banner Template sind die Action Scripts
bereits voreingestellt.
Superbanner
Auf dem 2. Keyframe: Stop(); EB.ExpandPanel (“bigsize”,”Auto”); EB.ExpandPanel (“skyscraper”,”Auto”);
Der Banner selbst bleibt optisch völlig leer und wird später im Tag transparent eingestellt
Panel/Float/Layer:
Close-Button zum manuellen schließen (User Interaction): close_btn.onRelease = function(){EB.CollapsePanel(“float”, “user”);}
Ersetzen Sie “close_btn” mit dem Namen Ihres eigenen Buttons. Alternativ können Sie einen Klickbefehl direkt auf den Button setzten.
Setzen Sie in die Anführungszeichen den Namen ihres Panels wie zB panel1 oder Layer
Automatisches Schließen nach Ende der Animation:
Bitte nutzen Sie hier nicht CloseAd, da sich dann auch der Basisbanner mit schließt. Ersetzen Sie “show_roll_btn” mit dem Namen
Ihres eigenen Buttons. Alternativ können Sie einen Klickbefehl direkt auf den Button setzten. Setzen Sie in die Anführungszeichen
einen Namen für den Panel wie zB panel1 oder Layer
Nach Ablauf der Animation des Panels soll es sich automatisch schließen:
EB.CollapsePanel(“float “,”auto”);
Link-Button: clickthrough_btn.onRelease = function(){ EB.Clickthrough(“float”);}
Statt “float” können Sie gern einen alternativen Namen nehmen
© 2008 Eyeblaster. All rights reserved
Eyeblaster Actionscript - Hockeystick
Bigsize
Link-Button: Alternativ auf dem Button selbst (AS2):
clickthrough_btn.onRelease = function(){
EB.Clickthrough(“Bigsize”); on (release) {
} EB.Clickthrough(“Bigsize”);
}
Ersetzen Sie “click_thru_btn” mit dem Namen Ihres eigenen Buttons.
Alternativ können Sie einen Klickbefehl direkt auf den Button setzten.
Setzen Sie in die Anführungszeichen einen Namen für den Banner wie zB contentad
Skyscraper
Alternativ auf dem Button selbst (AS2):
Link-Button:
clickthrough_btn.onRelease = function(){ on (rollOver) {
EB.Clickthrough(“Skyscraper”); EB.ExpandPanel(“float,”user”);
} }
Expandieren mit Mouse Over:
show_roll_btn.onRollOver = function(){
EB.ExpandPanel(“float “,”user”);
}
Ersetzen Sie “show_roll_btn” mit dem Namen Ihres eigenen Buttons.
Alternativ können Sie einen Klickbefehl direkt auf den Button setzten.
Setzen Sie in die Anführungszeichen einen Namen für den Panel wie zB panel1 oder Layer
© 2008 Eyeblaster. All rights reserved
Positionierung Panels/Layers in Ad 2
Die Positionierung des Panels kann direkt in
Flash Umgebung eingestellt werden:
Verschieben Sie das Panel
manuel mit Ihrer Mouse
© 2008 Eyeblaster. All rights reserved
Preview eines Expandable Banner
Klicken Sie im Workshopfenster einfach auf Preview, um eine Vorschau Ihres Ads sehen zu können
Preview Funktion aus der Flash Umgebung heraus:
Positioning: Werbemittel positionieren (wird bei
mehreren Ads verwendet)
Preview Url: Werbemittel auf einer Website prüfen
Interactions Monitor: Actions Scripts prüfen
Share Preview: Preview Url des Werbemittels um
sie weiter zu versenden
Der Default 728x90 swf-Banner ist in der Preview
nicht transparent, sondern weiß. Das läßt sich erst
durch ein Zusatzcode im Tag ändern, wird also dann
auf der Testseite bzw Liveseite korrekt transparent
sein.
Bitte weisen Sie den Kunden darauf hin, falls er sie
Previewseite zur Abnahme bekommt.
© 2008 Eyeblaster. All rights reserved
Anpassungen durch “Ad Settings”
In Flash Umgebung können diverse Einstellungen durchgeführt werden:
Ad: Geben Sie ein Default Image
und eine Ziel Url an
Banner: Nehmen Sie hier die
Einstellungen für das Basisad vor
Panel: Nehmen
Sie hier die
Einstellungen für
das Panel vor
© 2008 Eyeblaster. All rights reservedUpload Werbemittel in Adserver
Laden Sie nun das Werbemittel
in einem Paket (.ebs File) aus
der Flash Umgebung hoch:
Das Werbemittel ist jetzt komplett im
Adserver eingestellt.
Bei Klick auf Edit Ad Online wird zum
Werbemittel im Adserver verlinkt
Geben Sie Ihre Zugangsdaten ein
© 2008 Eyeblaster. All rights reservedDefinition von .ebs, .eba und .ebc
Die .ebs und .eba Dateien werden automatisch nach
Upload des Bundles generiert und lokal abgespeichert:
Die .eba-Datei ist eine Eyeblaster Projekt Datei. Einstellungen
wie Panel Positionierung und Klick Url sind gespeichert. Eba kann
nur in Flash Umgebung im Workshop bei Open an Existing Ad
geöffnet werden. Sie wird automatisch generiert.
Die .ebs-Datei ist eine Eyeblaster Bundle Datei. Backup Image,
SWF„s und .eba-Datei sind in dieser Datei komprimiert. Kann im
Adserver bei Create Ad from Bundle als fertiges Ad hochgeladen
werden. Sie wird automatisch generiert.
Die .ebc-Datei ist eine Eyeblaster Quelldatei. Alle Dateien plus
Fonts und AS sind hier enthalten. Kann nur in der Flash
Umgebung im Workshop bei Open an Existing Ad geöffnet
werden. Sie wird per Klick generiert.
© 2008 Eyeblaster. All rights reservedUpload vom Workshop auf den Adserver
Die .ebs Datei kann ohne Flash Umgebung unter “Create Ad from Bundle”
hochgeladen werden:
Nach Klick auf Upload Bunde ist das
Werbemittel komplett im Adserver mit allen
Einstellungen aus der .eba Datei angelegt.
© 2008 Eyeblaster. All rights reservedWorkshop Werbemittel auf dem Adserver
Das Ad kann in Eyeblaster editiert werden
Ad Editieren: Klicken Sie auf das Bleistift-Icon oder
doppelklicken Sie auf das Ad selbst um es zu editieren.
Positionieren Sie die Panel, an Hand Ihrer
Testseite (dann wissen Sie die Breite des Ad Format: Hier können die Assets ausgetauscht
werden und somit zB korrigierte swfs hochgeladen
Contents) soweit nach rechts, bis es mit dem werden, ohne das Ad neu zu erstellen.
Skyscraper abschließt.
Nur wenn die Banner mit dem transparenten
Superbanner Pixel Defaultsky angelegt sind,
können sie zusammen Verschoben werden!
© 2008 Eyeblaster. All rights reservedWorkshop Werbemittel auf dem Adserver
Positioning: Hier können Sie Ihr Ad und die Panel Actions and Tracking: Hier können Ziel-URL und
positionieren Zählpixel angegeben werden.
© 2008 Eyeblaster. All rights reservedCustom Interactions – Links definieren
Die Vorteile des Eyeblaster Workshop • Templates sind vorhanden und individuell einstellbar • Unkomplizierter Upload direkt aus der Flash Umgebung • Preview Funktion in der Flash Umgebung • Interaction Monitor • Bundling alle Dateien zu einem Ad © 2008 Eyeblaster. All rights reserved
Allgemeines
• Der Eyeblaster Workshop ist nur möglich mit MXP Extension Kit. Download
• Ad Name = Asset Folder Name
• Einstellungen wie Positionierung oder Verlinkung können im Adserver oder direkt in der
Flash Umgebung durchgeführt werden
• Die Speicherort der Dateien sind beliebig auswählbar
• Eigene Templates sind einstellbar
• Alle Dateien eines Werbemittels werden zu einer einzigen Datei (.ebs) gebündelt
• Download von Step-for-step-Video-Dokumentationen und PDFs über die Erstellung von
Standard Ads mit dem Workshop (Download)
• Anfrage Zugangsdaten Eyeblaster Adserver bitte an:
creative_de@eyeblaster.com
© 2008 Eyeblaster. All rights reservedVielen Dank Bei weiteren Fragen zur Umsetzung bitte wenden an: Creative_de@eyeblaster.com
Sie können auch lesen
