Articles on: Administrator

Overlay Images

SignalWire Work Overlay Images — Advanced administrators only



This technical documentation describes the settings used for advanced room configurations and user dial-ins to change behavior of SignalWire Work. The features described are subject to change without notice and are not recommended for most deployments.
More than one setting may be chosen. Because overlay images work in layers, the settings allow you to customize the layer order for all overlay images. All images should be a PNG format. If overlay images are the wrong aspect ratio, SignalWire Work will automatically scale them to size which may alter the intended design.

Overlay images are used in SignalWire Work to customize appearance of the themes. Supported settings include:

Background image / Wallpaper for the room (16:9 aspect ratio)


Background or "wallpaper" graphics inside the conference. Can be either custom background color as a hexadecimal color value (e.g., #FFFFFF) or URI to an image. (e.g.,https://imgur.com/7jRh226.png) This image should be a PNG with a 16:9 aspect ratio.

This option is great for customizing video calls without worrying about obstructing the view of conference participants as it is a background image and not an overlay image.

Preview image in Room Navigator / Home Screen when the room is occupied


This image overlays the room preview images that are shown on the Home Screen and Room Navigator. This setting is to add themes to each room. For example, a "Lounge" themed room for virtual conferences may include an overlay image of a lounge, or logos can be added for custom branding. Add transparency to this image if you want users to see the preview of participants. This image should be a PNG with a 16:9 aspect ratio.

Default image in Room Navigator / Home Screen when the room is empty


Image to use in the room previews section of the home screen when the conference is empty. URI to image. (e.g., https://imgur.com/7jRh226.png) This image should be a PNG with a 16:9 aspect ratio.

Image to display in place of video feed when video is muted


Customize the image that is shown when users are video muted. This image will take the place of the default image of a silhouette or the user's gravatar image. This image will be the same for all users. This image should be a PNG with a 16:9 aspect ratio.

Lower thirds Banner Logo (must be 120px in height and will be anchored to the bottom)


Background image for banner ("lower third"). URI to image. (e.g., https://i.imgur.com/LdV1Ldx.png) The banner aspect ratio is 1876x120 px. SignalWire Work automatically adds the user's name and email centered on top of the banner. Any graphics added to the lower thirds, such as logos, should be kept to the sides of the banner image and kept at 315px wide to avoid overlapping with the auto-generated text. The image below serves as an example template for the lower thirds. It is important to keep the transparency around the edges and only make changes to the opaque areas.



Try adding a small version of your logo to the left corner of your banner (lower third)

Banner Text color


Text color for banner ("lower third"). This setting requires you to enter a hexadecimal color value (e.g., #000000)

Completely cover the video with this image (MUST BE TRANSPARENT OR VIEW WILL BE BLOCKED)


Add an overlay image on top of the conference room itself when there is more than one user. This could be used to make audio only calls look more visually interesting or to add logos and custom borders. Add transparency to this image so it doesn't block users' videos. This image should be a PNG with a 16:9 aspect ratio.

Completely cover the video with this image where there is only 1 user (MUST BE TRANSPARENT OR VIEW WILL BE BLOCKED)


Add an overlay image on top of the conference room itself when there is only one user. This could be used to make the Lobby room more visually interesting for guests. This image should be a PNG with a 16:9 aspect ratio.

Make your Lobby room feel like an office lobby by adding an image of a waiting room, or use this as an opportunity to add custom branding to your Virtual Office.

Border Color around participants


Customize the image of the default border for podcast-enabled rooms. Enter a hexadecimal color value (e.g., #FFFFFF)

Border Width in pixels


Customize the width of the default border in podcast-enabled rooms. Pixel values between 1-5 will look best.

Updated on: 28/01/2022

Was this article helpful?

Share your feedback

Cancel

Thank you!