ImageLayer

ImageLayer is a super useful utility template for displaying a full screen image over a video using SPX Graphics.

---

Test the template online.

---

---

This is a PAY WHAT YOU WANT item on the Store with a minimum price of nothing. If you want to show your appreciation you know what to do. Any help is highly appreciated. THANK YOU ❤

---

This is a simple template for revealing an image over a live video. Sounds simple - and it is! All the complexity is upstream, in your image editing software. Get creative and create whatever assets you need: fullscreen photos or presentation slides, titles headlines, maps. Or with transparent images there are no limits: sponsor logos, social call-to-actions, quizzes, namestraps - anything really.

Images can be loaded from local ASSETS/media/images/hd -folder of the SPX-GC software or from a web URL.

---

( low quality preview )

---

USE CASES

The ImageLayer can be of great help in any production.

• TV productions, events, presentations, streams
• Sponsor logos, subscribe and other social call-to-actions are easy to use as images.
• Need to present Slides? Load those as images.
• If you don't have an animated template package at hand, this will get you going anyway. Create backgrounds for your graphics as images and use Texter template for texts on them.
• Need a solid color, such as black or chroma green? Use an image.

PACKAGE CONTENTS

The template is provided as a zip file at checkout which includes all required files (html, images, fonts, css styles, etc). All source code is left editable for easy customization and adaptation.

• Files delivered as a zip file at checkout for manual installation. For Windows, an installer is also available for automated setup.
• 2 copies of the "same" HTML template (HD 1920x1080) with predefined layers.
  • Layer 2 - for images "further back"
  • Layer 10 - for images "closer to the camera"
  • Remember you can assign a different layer number in the project settings. These two are just starting points.
• Supporting files (such as fonts, images, javascript, etc)
• Example image files to ASSETS/media/images/hd -folder (1920x1080, PNG format)
• README.pdf for installation and usage instructions
• FREE LICENSE allows you to modify and redistribute the files but there are conditions. Please see the free license.

TEMPLATE CONTROLS

The template can play out an image from a local media folder or SPX-GC or from a web URL. The image will be streched to fill the HD area, so optimal image size is 1920x1080 pixels. Local files must be in PNG format, URL images either PNG or JPG images. URL images have higher priority, so if both image sources are set, the URL one will be loaded.

Animation types provided by the template by default:

• Fade in
• Slide in (from top, left, bottom, right)
• Wipe in (from top, left, bottom, right)

Easing types provided by the template by default:

• Smooth
• Linear
• Ease back
• Bounce

More animation types and easing types can be added by modifying the source code of the template.

LIVE DEMO

You can testdrive ImageLayer and all our other templates at the live online demo. Please note: there may be others using the demo at the same time which can cause unexpected glitches.

Click on Add to Bag to get the template now.

This is a Pay What You Want -item, because we believe everybody will appreciate the help it gives them. And we will appreciate any help you can give us.

---

Need more info? Try the chat on this page or contact us.