Best practice for using media

This page will provide you with the best practice of using media (images & videos) in your creatives.

1) Image resolution When uploading an image to your media library in the online Studio, make sure the image dimensions are as close as possible to the pixel size of the image as it will be in the target screen display. Example: if the image is to be used full screen on an HD landscape TV, better have it 1920 x 1080 pixels; If it needs to be on 1/4 of that TV, better have it 960 x 540 pixel. If you prepare an image for background, also better to make sure that the aspect ratio is as the screen ratio.

Using an image with huge dimensions is not needed an might even look worse than expected. A 3301 x 2550 pixels image will look good only on 4K monitor (in case the player also supports 4k), but players like Intel NUC are not capable to output even HD (1920 x 1080p) display as they have 1600 x 900p native resolution. Some cheap Android TV boxes will output only 1280 x 720p.

To give you better understand of what is happening behind the scenes: Unless there is a 4K display, 3301 x 2550p resolution is meaningless and this particular image if being displayed in a blended creative, will take even less pixels in reality. First, it is a waste of resources for low or middle end player: this single image alone will take 34MB of system and 34MB of video memory (and by the given cache and GPU handling it will more likely to consume 68MB). Second, it will provide lower quality display instead of making it better. The image will finally be scaled to the display resolution. Pre-scaling image offline to more or less the display resolution obviously provides better quality than scaling it fast in realtime. Third, consideration is that for less resolution and the same file size you can make compression with higher quality.

2) Image file size Better have an image of file size not greater than 2 – 3 MB. Images of more than that might take more time to appear on weak Android devices, not to mention that it will slow down the online Studio when editing it among your media.

3) Video resolution Same like in image resolution, but here it is more prominent. Always encode the video to the actual resolution which it will be displayed at. This will produce higher quality videos and better playback. If there is a 854 x 480p video widget in a blended creative on the actual TV display, it won’t be wise to put 1920 x 1080p video there. You might think that 1080p video is a higher quality, but in the end you will get the opposite result. Why? First, most user try to highly compress the video. Frequently, the result 1080p video has artifacts. If you compressed it to 854 x 480p, you would have gotten a much higher movie quality for the same file size. Second, as with images, pre-scaling to display resolution during compression will result in a higher quality display. Third, videos consume a lot of resources. On low end players, smaller resolution will not likely to have issues and will have smooth playback even when having simultaneous videos (if the device supports simultaenous videos on screen). Please also read this tech post, to learn more about the MP4 file extension and the AVC video format.

4) Video framerate This is less common, but is worth to mention. 60fps (=Frame Per Second) of video consumes more than twice of the decoder and other resources. If there are not very fast moving scenes in the video, there is no need for this high rate. On low end players with simultaneous videos or video slideshows in a blended creative, 30fps or less is recommended on all videos.

5) Different usage of the same media item If you intend to use the same creative to be displayed both on low end 720p device and high end 4K device, you will need to create 2 different sets of images and videos for that, in order to be displayed optimally on those 2 different resolutions. For example, YouTube’s way to handle this issue on videos is that they advise to upload a high resolution video and then automatically behind the scenes, a down-scaled versions are being generated. Then it auto-selects the resolution according to display size during playback.