Hi, this is CameraFi Live team.


CameraFi Live supports a feature called Web Overlay. 

This feature allows you to add web-based source to your live video to attract your viewers more and communicate better with them.

To understand how to use it, we have prepared this manual that explains everything you need to know about the web overlay function in CameraFi Live:


1. How to setup Streamlabs on CameraFi Live

2. How to use web overlay

3. How to edit web-based sources on your live stream


    [Camera]
  • Zoom In & Out
  • Resolution
  • Size & Location

    [Screen]
  • Transparency 
  • Size & Location
  • Fix

Then let's go one by one!



1. How to setup Streamlabs on CameraFi Live


With the CameraFi Live app, you can connect a donation platform like Streamlabs to apply chat box, subscription alerts, or donation alerts.


To setup streamlabs you can follow these steps:

1. Go to Streamlabs (https://streamlabs.com/) and log-in with your Google/Twitch/Facebook account.


2. Click the ALERTBOX under the Widgets theme on the left menu.


3. Copy the Widget URL link on the top and paste it on the web source tab of CameraFi Live in the Settings menu.


4. Turn on the web source overlay function and click the PREVIEW button.

5. Click the TEST DONATION/TEST SUPER CHAT and etc. for the test.


6. You will see the test donation alert is showing on CameraFi Live screen broadcasting.
*It is the captured image from YouTube live broadcasting.


7. Detailed settings such as alert sound volume, font size, or text color are available in Streamlabs dashboard. It is NOT available in CameraFi Live.

For more information about alert settings, please refer to the link; https://youtu.be/w058zjHfAW0


2. How to use web overlay


[Camera]



To use the Web Overlay function on Camera Mode, you should:


1. Click the camera option on CameraFi Live’s home screen, choose the platform to stream and click on START.


2. This action will take you to CameraFi Live’s main screen.


3. Click the wand icon on the bottom left corner of the screen to add web-based sources.  







4. Click URL#1. Then write your URL and click OK to fix it in your live stream. 




5. In the Camera Mode, there are a few extra features available for web overlay, such as clock, countdown, google, and other interesting effects.


 



[Screen]


To use the Web Overlay function on Screen Mode, you should:


1. Click the screen option on CameraFi Live’s home screen, choose the platform to stream to (Facebook, YouTube, Twitch...) and click on START.


2. This action will take you to your smartphone home screen.


3. Then, click the floating icon and tap the Overlay icon with the globe shape.


                     


4. Click URL#1. Then write your URL and click OK to fix it in your live stream. 

  


3. How to edit web sources on your live stream


You can edit the web sources according to your needs.
The provided features vary from the mode you are choosing: Camera or Screen.


[Camera]


  • Zoom In & Out


1. Click the web overlay button (globe icon) on the left bottom to choose URL#1.






2. Write your URL and click OK. (In the manual, we'll use Streamlabs chat overlay widget.)





3. Swipe from right to left and select the web overlay you'd like to apply.





4. Adjust the size and location of the web overlay.





5. Click the magnifier icon of the web source.





6. You can magnify or reduce the text on web overlay with the green bar.





Compare the size of the texts in web overlay.


    

  (REDUCED)                            (MAGNIFIED)    




  • Resolution


In Settings, you can adjust the resolution of web overlays.

Please choose according to the network status.


1) Click the Settings on the menu on the right side.



2) Select Web Overlay Resolution: 360p / 720p.



  • Size & Location


Drag the web overlay to the specific location you would like to display. Click the pin on the left side to fix the web overlay in the area.


With the double-sided arrow icon at the right bottom of your web source overlay, you can adjust the size and ratio of your web overlay. 

 
          
  

[Screen]



CameraFi Live provides the features for streamers to modify the size, transparency, and location of their web-based sources.

  • Transparency

You can adjust transparency with the red control bar at the top status bar.


  • Size & Location


Drag the web overlay to the specific location you would like to display.

With the double-sided arrow icon at the right bottom, you can adjust the size and ratio of your web overlay.


  • Fix


To fix the adjustments of your web source overlay, please click the pin icon.


With the picture below, you can easily see all three features at once:






If you have any questions while using a web source overlay feature or CameraFi Live, please feel free to leave a comment or leave us the email(apps.help@vaultmicro.com).

Thank you.