skip to Main Content

Animirani Display oglasi su veoma efektan i popularan način oglašavanja. U prethodnom blogu upoznali smo vas sa interfejsom i osnovnim fukcijama za dizajniranje i kreiranje HTML5 oglasa i reklama tj. Google Web Designerom.

U nastavku teksta, pozabavićemo se nekim od naprednijih funkcija Google Web Designer-a, kao i čuvanjem i implementiranjem samog oglasa u Google Display kampanju. Saznaćete kako se prave animirani Display oglasi.

Kako se prave animirani Display oglasi?

Kako se prave animirani Display oglasi i kako se efikasno koriste u dobro osmišljenoj kampanji pročitajte u nastavku teksta.

Događaji

Događaji su način na koji postavljate akcije (radnje) kao odgovor na neku radnju korisnika, neki trenutak u toku oglasa (timeline keyframe) ili neke druge pojave u oglasu ili HTML dokumentu.

Objekte i akcije povezujemo u posebnom prozorčiću koji otvaramo tako što obeležimo objekat, pritisnemo desni klik i izaberemo ‘’add event’’ opciju.

Animirani display oglasi i kreiranje HTML5 reklama

Nakon biranja opcije ‘’Add event’’, otvara se prozorčić koji nas vodi kroz 5 koraka za podešavanje događaja i to:

  1. Cilj – ovde biramo objekat koji pokreće događaj, kao na primer ‘’button’’
  2. Događaj  – biramo događaj koji će pokrenuti akciju, kao na primer kada korisnik klikne na dugme ili pređe mišem preko dugmeta
  3. Akcija – biramo radnju koja se desila kao rezultat, kao na primer otvaranje druge strane oglasa, reprodukcija videa, odlazak na landing page
  4. Prijemnik – biramo element oglasa koji izvodi radnju, na primer ukoliko klik na ‘’Tap area’’ učini da slika nestane, onda je slika ‘’prijemnik
  5. Konfiguracija – za neke radnje su potrebne dodatni detalji, kao na primer dodavanje konačnog URL-a za ‘’landing page’’
Animirani display oglasi i kreiranje HTML5 reklama

Svi događaji se nalaze u donjem levom uglu u prostoru za događaje. Tu dodajemo događaje klikom na dugme ‘’Add event’’, uređujemo događaje duplim klikom na određeni događaj. Događaj se briše odabirom događaja i klikom na dugme ‘’Delete’’ u donjem desnom uglu table.

Timeline i dodavanje događaja

Traka događaja se nalazi na vrhu Timeline-a i ona omogućava povezivanje animacije sa događajima pomoću oznaka i markera za događaje. Markeri događaja omogućavaju pokretanje događaju u određenoj tački vremena (na primer želimo da se u 2. sekundi oglasa nešto dogodi, pomeri, nestane itd).

Animirani display oglasi i kreiranje HTML5 reklama

Kada animacija dosegne marker događaja u vremenskoj traci, događaj se pokreće.

Marker dodajemo desni klikom na tačnu lokaciju u vremenskoj traci gde želimo da dodamo marker i iz padajućeg menija biramo opciju ‘’add event’’.

Oznake događaja (labels) su imenovane lokacije na vremenskoj traci. Njih koristimo da bi reprodukovanje oglasa poslali u određenu tačku na vremenskoj traci, na primer: 

Naše dugme za klik je pink, ljubičaste boje, dok nakon nekoliko sekundi promeni boju u tamnu ljubičastu.

Animirani display oglasi i kreiranje HTML5 reklama

U ovom slučaju, želimo da dodamo oznaku događaja ‘’mouseover’’ koju dodajemo u događaj da neko kada pređe mišom preko navedenog objekta, objekat promeni boju u tamno ljubičastu boju.

Exit ad i odlazak na landing page

Odabirom komponente ‘’Tap Area’’ postavljamo transparentan element koji nam omogućava da pokrenemo radnju klikom ili dodirom miša.

Iz panela za komponente, u sekciji ‘’Interaction’’ biramo ‘’Tap Area’’ i prevlačimo ga na poziciju gde želimo da nalazi.

Animirani display oglasi i kreiranje HTML5 reklama

Desnim klikom dodajemo događaj odabirom opcije ‘’Add event’’. U prvom prozoro biramo poslednju opciju ‘’Tap Area’’ – Touch/Click. Kao akciju izabraćemo ‘’Exit ad’’ kako bi nas oglas odveo na željenu destinaciju van HTML dokumenta. Kao prijemnik biramo čitav oglas, a na kraju konfiguracije dodajemo URL destinacije na koju želimo da vodi klik na dugme.

Animirani display oglasi i kreiranje HTML5 reklama

Objavljivanje oglasa ili HTML dokumenta

Pre čuvanja dokumenta, obavezno proveravamo da li je HTML funkcionalan i da li je potrebno napraviti neke izmene klikom na ‘’Preview’’ dugme u gornjem desnom uglu i odabirom pretraživača.

Animirani display oglasi i kreiranje HTML5 reklama

Nakon provere ispravnosti animiranog display oglasa, jedino što nam preostaje je da sačuvamo oglas i pripremimo ga za otpremanje na neku od platformi koju želimo da koristimo (AdRoll, Google Display...).

Sa leve strane prozora koji nam iskoči, nalaze se opšti podaci o dokumentu, poput veličine, provere validacije oglasa a sa desne biramo podešavanja kao što su ime oglasa i gde želimo da se zipovan fajl sačuva.

Mi smo spremni da naše znanje stavimo u službu Vašeg biznisa. Kontaktirajte nas!

Animirani display oglasi i kreiranje HTML5 reklama

Made by Nemanja Nedeljkovic – Senior Account Manager @Digitizer