Vaihtuvat sisältöelementit mainosvideoissa

Abstract

Insinöörityön aiheena oli vaihtuvat sisältöelementit mainosvideoissa. Mainonnassa lisääntyneen personoinnin käyttö antoi idean tutkia, miten personointia voidaan käyttää yhä yleistyvässä videomainonnassa mahdollisimman helposti ilman aiemmin käytettyjä kolmannen osapuolten liitännäisiä ja ilman suurta koodaustaitoa.

Aihetta lähestyttiin ensin painetussa mediassa käytössä olevien personointitapojen kautta ja personoinnin videomainonnan tekniikkana päätettiin tutkia, miten nopeasti yleistynyt ja usean vuoden käytössä ollut HTML5-tekniikka sopii siihen.

Tutkittiin teoriassa ja testattiin käytännössä, miten HTML5:n uudet mediaelementit, canvas ja video, soveltuvat videon personointiin. Tutkimuksessa käytettiin lähteinä ja apuna sekä kirjallisuutta ja internetsivustoja että YouTube-videoita. Niiden avulla päästiin kokeilemaan, ensin valmiiden mallien myötä, miten helposti voitiin videota pikselimanipuloida. Myöhemmin kuvattiin oma video ohi ajavasta pakettiautosta, jonka kylkeen lisättiin canvas-elementin avulla muuttuvan tiedon osio. Tähän osioon tehtiin testattavaksi kaksi erilaista kuvaa, toinen JPG-bittikarttakuva ja toinen läpinäkyvyyttä tukeva PNG-kuva.

Työssä näytettiin, että peruskoodaustaidoilla oli mahdollista tehdä lyhyellä koodilla videoon personoitu osio, jota testattiin lisäämällä siihen kuva kuvapankista. Kuvapankin käyttö personointiin todettiin toimivaksi tavaksi, sillä siinä oli helppo muokata kuvaa ja jopa vaihtaa se, ilman että alkuperäiseen koodiin koskettiin.

Työssä todettiin, että HTML5 on hyvä tekniikka personointiin, mutta täysin ammattimaisia videopersonointeja varten on vieläkin käytettävä valmiiksi tehtyjä ohjelmia, sillä HTML5:n puutteena oli se, että canvas-elementin liikkuminen pitää laskea käsin.

Insinöörityötä voidaan hyödyntää, jos halutaan tietoa, miten mainonnan personointi on kehitttynyt ja halutaan tutustua HTML5:n käyttö- ja manipulointimahdollisuuksiin videoissa.

This final study examines dynamic content elements in advertisement videos. The increased use of personalization in advertising gave the idea to investigate how personalization can be used in videos, as the use of videos in marketing is increasing. It was examined how this could be implemented without third-party plugins and without advanced computing knowledge.

The subject was first approached by examining existing techniques for personalizing print media. The tools chosen for personalized videos was basic HTML5 and JavaScript to see how well that would suit the purpose.

Investigation was conducted in theory, and in practice it was tested how well the new media elements of HTML5, canvas and video, were suitable for the personalization of videos. Sources and help for the study were taken from literature, internet pages and YouTube-videos.

With these, it was possible to test, first through ready-made models, how easy pixel manipulation was. Later on, a video of a truck driving by was recorded. On the side of the truck, with the help of a canvas element, a dynamic overlay element was added. For this element two different images were made, one JPG-bitmap image and another transparency supported PNG-image.

In the work it was presented how, with basic computing skills, it was possible to create a personalized section, with a short code. The section was then filled with an image that had been uploaded into an image bank. The personalization functionality was confirmed by manipulating and changing the image from within the image bank without altering the original source code.

The study concluded that there is adequate techniques available in HTML5 for personalization, but for professional video personalization it is still more convenient to utilize commercially software, mainly because in HTML5 one will have to calculate the movement of the canvas overlay element by hand.