Impactvolle interactieve banners en advertenties

Ga voor maximale engagement met je doelgroep! Trigger ze om interactief aan de slag te gaan met je product of merk waardoor je nog langer top of mind blijft terwijl het resultaat van de campagne ook nog eens verbeterd wordt!

Wat zijn Interactieve HTML5 banners?

Interactieve banners zijn online advertenties die door middel van HTML5 technieken zoals Javascript interactief zijn gemaakt. Interactie kan zo simpel zijn als een muis beweging, maar zo ingewikkeld worden als advergame (mini game) met video animaties. Interactieve banners zijn Rich Media en daardoor niet via ieder advertentie platform in te zetten. Wij ontwikkelen het liefst interactieve HTML5 banners via het Weborama systeem, omdat zij ons veel vrijheid geven om jou een impactvolle campagne te laten draaien.

Interactieve banners zijn er vele vormen en maten en DSlab kan ze allemaal voor je maken. In theorie ligt de limiet bij wat de gewenste advertentie systemen toestaan op het gebied van interactie en niet op wat wij kunnen ontwikkelen. We zijn grote voorstanders van interactieve HTML5 banners, omdat je de doelgroep kan triggeren tot het daadwerkelijk kennis maken met je product zonder dat ze deze bijvoorbeeld gekocht hebben. Als je puur op CTR (Click Through Rate naar een landingspagina) gebied kijkt werken interactieve banners “slecht”, want kijkers klikken binnen de banner en gaan niet meteen naar de landingspagina. Echter de traffic die uiteindelijk door klikt naar je website zijn van hoge kwaliteit waarbij de kans op conversatie uitermate hoog ligt. Tevens heeft interactie al jaren haar kracht bewezen doordat een moment van “doen” door 90% van de mensen wordt onthouden en blijft daardoor veel beter in het geheugen hangen. Interessant? Bekijk onze interactieve HTML5 banner voorbeelden hieronder:

Muis interactie banners

Wist je dat interactie zelfs mogelijk is binnen Google Ads (voorheen Google Adwords) onder de 150kb? Er is helaas vrij weinig toegestaan binnen Google Ads, maar muisbewegingen mogen gelukkig wel geregistreerd worden en daar kan interactie aan gekoppeld worden wat zowel zorgt voor engagement als voor betere resultaten, want met deze vorm van interactie kun je de kijker uitdagen om te klikken / actie te ondernemen.

Hierin zijn verschillende toepassingen mogelijk zoals een object dat de muis volgt of bijvoorbeeld een scratch element.

Interactief banner voorbeeld op basis van muis beweging. Bekijk deze case!

Interactieve mobiele/tablet banner voorbeeld. Bekijk deze case!

Mobiele Interactieve banners

Steeds meer smartphones maken gebruik van allerlei hardware snufjes en voor mobiele banners is de accelerator een erg leuke om interactieve mobiele banners mee te maken. We kunnen bijvoorbeeld een fullscreen video op je mobiel starten als je je telefoon kantelt of de korting van een product laten zien als je met je telefoon op en neer schud. Draai je telefoon snel rondjes en je maakt vuur op het scherm. Natuurlijk is hier alles mogelijk wat met HTML5 gemaakt kan worden.

Naast interactie door hardware kun je ook denken aan de bewegingen die je met je vinger kan maken van het swipen door een cube, het weg moeten “krassen” van een ijslaag of interactie op basis van het scrollen in de pagina (zie een gaaf voorbeeld in de Glass case).

Interactieve video banners

Video wordt steeds belangrijker in de advertentiewereld, maar veel partijen zien video als alleen awareness terwijl er met interactie veel meer resultaat behaald kan worden! Zo maken we van een standaard video een interactieve video banner, door bijvoorbeeld op een cliffhanger moment te pauzeren en de kijker te vragen om te klikken/drukken om verder te gaan. Vanaf dat moment is er user interaction en mag ook het geluid automatisch aan worden gezet. Op deze manier komt de boodschap nog beter over en is de kijker echt actief bezig met je campagne boodschap en zal deze beter onthouden worden.
Een ander voorbeeld van interactieve video is in een catalogus video touchpoints te tonen bij producten die je in de video ziet. Ga je hier met je muis overheen dan pauzeert de video en krijg je in de banner meer informatie over het product.

Interactieve video banner in HTML5. Bekijk deze case!

Mini game banner voorbeeld. Bekijk deze case!

HTML5 Advergame banners

Leg je product uit aan de kijker door er een interactieve mini game (ook wel Advergame of Playable Ad genoemd) van te maken of toon in een banner een kleine demo van je echte videogame om kijkers nieuwsgierig te maken. Ook hier is enorm veel mogelijk, maar moeten we altijd rekening houden met de grenzen van HTML5, de specs van de publishers en de (device)hardware van de kijker.

Met technieken als mouse follow, slepen of drag en drop kunnen we al veel basic game mechanics maken die voor een kijker erg leuk kunnen zijn om mee te spelen. Onthoud dat het ontwikkelen van spelelementen extra productietijd (en kosten) met zich mee kan brengen.

Interactieve keuze banners

Geef de kijker een keuze die de verhaallijn in je banner kan beïnvloeden om direct te zorgen voor meer engagement met jouw product of merk. Terwijl de kijker denkt dat deze zelf een keuze maakt kunnen jullie natuurlijk alle keuzes zo buigen dat deze altijd in het voordeel zijn van jullie product of merk. Deze keuze kan in allerlei vormen getoond worden, denk aan animatie maar ook aan verschillende video’s.

Leuk weetje: dit is ook mogelijk in een interactieve Pre-roll (VPAID)!

Laat de kijker kiezen welke advertentie content deze te zien krijgt voor maximaal resultaat.

Interactief multi  “page” en video banner voorbeeld

Multi page / video banners

Of je nu meerdere producten in een banner wil laten zien of juist meer informatie wilt tonen dan er eigenlijk in een banner past. Het kan allemaal met een interactieve multi-item display banner. Als je meerdere producten hebt wil je deze misschien een soort product viewer laten zien waar kijkers zelf doorheen kunnen bladeren. Naast het tonen van een ander product kan er ook andere tekst of een video bij getoond worden.

Als je verschillende informatie wil laten zien maken we gebruik van een multi-page principe. In feite heb je een klein menu binnen een banner die verschillende pagina’s kan laten zien. Elke pagina kan weer helemaal naar wens worden ingevuld.

Pre-fill banners

Verhoog je conversie door een slim formulier (van kenteken tot postcode tot interesse) in je display banner te bouwen die bij het drukken op een knop alle informatie meestuurt naar jouw landingspagina. Zorg dat je op de landingspagina weer meteen aan de slag gaat met die informatie en een bezoeker is nog sneller geneigd om actie te ondernemen.

Er kan allerlei input worden meegestuurd in een prefill banner zoals tekst, keuzes, telefoonnummers, e-mailadressen of gegevens die via buttons worden ingesteld. Denk ook buiten inputvelden, maar ook aan bijvoorbeeld een meerkeuzevraag met knoppen met antwoorden. Ook kan een formulier als entertainment onderdeel worden ingezet om meer engagement met je bezoeker te generen. Denk hierbij aan prijsvraag of een quiz waar bezoekers een prijs mee kunnen winnen.

Onthoudt wel dat je adserving systeem URL parameters moet ondersteunen (dus waardes die we achter de click URL mogen plaatsen). Twijfel je of dit mogelijk is? Vraag gerust naar meer informatie.

Interactieve Pre-fill banner voor gespecificeerde exit clicks. Bekijk deze case!

Interactieve banner met hotspot technologie voor alle devices. Bekijk deze case!

Hotspot banners

Heb je een product met gave features zoals een nieuw type wasmachine of een nieuw soort auto? Laat de kijker door middel van hotspots op interactieve wijze de features ontdekken. Met beweging over een hotspot kun je extra informatie laten zien in tekst, maar je kunt ook een animatie of video afspelen van de betreffende feature om extra op te vallen. Met Hotspots kun je op deze manier veel informatie kwijt (die allemaal even belangrijk kan zijn) zonder dat het teveel wordt voor de kijker.

Hotspot banners zijn mogelijk op elk device en in elk systeem, maar het hangt van het systeem af hoe complex dit is toegestaan. Zelfs in Google Ads kan een basis hotspot banner worden gebouwd onder de 150kb.

Panorama / 360 display banners

Wil je dat de kijker écht in de wereld van jouw merk of product wordt gezogen? Ga dan voor een Panorama of 360 graden wereld banner waarin de kijker opeens veel meer kan zien binnen hetzelfde banner kader. Laat ze er doorheen bewegen met pijltjes, met de muis of met swipen. Vervolgens kun je binnen deze wereld bijvoorbeeld hotspots aanbrengen of verschillende exit clicks.

360 graden/ panorama banner voorbeeld. Bekijk deze case!

Cross device Swipe (cube) voorbeeld. Bekijk deze case!

Swipe en 3D cube banners

Met de DSlab 3D cube technologie kunnen we van elk formaat banner een Swipe Cube maken en daarmee beperken we deze technologie niet meer alleen tot een Rectangle. Naast andere formaten kunnen we ook 360 graden animeren (dus ook omhoog en omlaag) of juist alleen omhoog en omlaag in plaats van naar links en naar rechts. De Cube banners zorgen voor de mogelijkheid tot veel (statische) informatie binnen één banner waar de kijker interactief doorheen kan bladeren.

Met swipe kunnen we nog veel in een banner doen, denk aan bijvoorbeeld een keuze maken door naar links of rechts te swipen en daar een gepersonaliseerd vervolg aan te geven. Ook kun je met swipen door producten of highlights heen bladeren.

Divide & slide vergelijkings banners

Ook wel slide compare of slider banner genoemd; deze interactieve banner technologie laat de kijker de perfecte vergelijking maken tussen twee items door een schuif in het midden met de muis of met de vinger (op mobiel). Enkele voorbeelden zijn het laten zien van een gezicht met of zonder die nieuwe make-up of het effect van een product bij daglicht en bij een donkere nacht. Ook kun je denken aan een nieuwe versie van een product waarbij er bijvoorbeeld een “stoere” mannen versie is gekomen die je zo mooi kunt vergelijken met het normale model.

Interactieve vergelijkingstechniek ter voorbeeld

Interactieve banner formaten 2021

Interactie zit niet perse alleen in bepaalde banner formaten, want interactie kan in theorie in elk banner formaat ingebouwd worden. Wel zijn er enkele templates (bijvoorbeeld via Weborama) die al standaard gebouwd zijn om interactief te zijn. Hieronder enkele formaten:

  • Framescroller: animatie op basis van scrollen
  • Swipe ad / cube: swipe d.m.v. touch of pijltjes door verschillende Rectangles.
  • Rotation to Fullscreen: wanneer je je mobiel een kwartslag draait start er automatisch een fullscreen layer met bijvoorbeeld een video.
  • Shake ad: wanneer je je mobiel op en neer schud kun je een animatie of video laten starten
  • Scratch banner: beweeg met je muis of vinger over de advertentie om de bovenste laag weg te krassen.
  • Panorama banner: zie uitleg hierboven
  • Compare slider: laat de kijker d.m.v. een slider twee afbeeldingen die over elkaar heen liggen vergelijken

Check ook deze pagina’s met voorbeelden:

Interessant, right?

Wil je meer info, een inspiratie sessie of zin in een gratis kop koffie? Contacteer me via dit formulier of bel (+31) 085 303 7178.
Dan kijken we samen hoe we dé kans die je krijgt om je doelgroep te overtuigen met advertising perfect kunnen benutten.

Bosse Zaal
Product Expert

Schrijf je in voor de inspiratie updates!

Ontvang leuke inspiratie updates met vernieuwende cases en slimme tips, maar blijft ook op de hoogte van onze acties.

Cookie instellingen

Wie optimaal van onze website gebruik wil kunnen maken moet onze cookies accepteren. Je kunt hieronder instellen wat je wel en niet wil accepteren:

Wie wil er nou niet meer van de meest interessante content? Met Analytics weten wij hoeveel bezoekers we hebben en waar de interesses liggen om je in de toekomst nog beter te helpen met juiste content.
We maken gebruik van partnertools om onze website optimaal te laten presteren in het belang van jou als bezoeker.
required
 
 
Wie lust er nou geen cookies? Zelfs je browser heeft ooit honger dus laat hem ons voeden met wat lekkers :)