Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
StatuscolourYellow


titleWe're updating this page... stay tuned!


Panel
titleOn this Page:

Table of Contents


XCALLY MOTION is fully integrated with VIDAOO, a professional Video WEBRTC solution powered by Xenialab, in order to provide the best advanced Web Video experience both on the Customer side and the Agents side.


Please contact our Sales Team in order to get VIDAOO: sales@xcally.com



Requirements

The XCALLY Motion server uses the following TCP ports

  • 443


The tested as compatible browsers are:

  • Google Chrome (recommended 30+) 
  • Firefox (recommended 27+)

General Architecture and Features

The XCALLY Motion VIDAOO Video Web application architecture is designed to provide:

  1. Smart Video Routing Management to your Customer Care Agents, according to Queue distribution and Skills
  2. Strong security
  3. Easy configuration

Image Modified



How it works

The user experience of the VIDAOO Web Video communication channel is very simple and intuitive. 

There are two scenarios in which the solution Vidaoo VIDAOO can be used.:

SCENARIO 1  

The Customers can Customers can engage a Video Communication Session with the Agent using a simple Web browser button (on PC, Mobile, Kiosk, etc.), like in the following exampleexamples:



Image Modified

Configuration of XCALLY Motion with Vidaoo

Image Added

 AGENT

STEP 2 - The Agents belonging to the OmniChannel dedicated Video Service Queue receive the video request on XCALLY Motion Omni Desktop interface

Image Removed

STEP 3 -

In order to

configure your XCALLY Motion with VIDAOO Video integrations you need to create a new OpenChannel Account:
  • Create the VIDAOO OpenChannel Video Account

then edit it and take note of the Receive URL field associated to the VIDAOO Video Service Session:

You will use it to configure the Vidaoo Device in the Vidaoo Administration environment 

Create Automation with XCALLY Webhook Action (more info here)

  • Associate the Agents to VIDAOO Open Channel Video Account and Queue:

Now the configured Agents are ready to use the VIDAOO Video OpenChannel!

CUSTOMER

STEP 1 -

activate the Web browser button, follow these steps: 

  1. Create the Web Browser Button 

    • Activate the web project

    • Check and edit parameters

  2. Authenticate on VIDAOO

  3. Connect XCALLY to VIDAOO

    • Create an OpenChannel Account

    • Associate the Agents to the OpenChannel Account

  4. Track the video call route

    • Create a Webhook automation

    • Notify Agents of incoming video call


Create the Web Browser Button

Activate the web project 

The web button is able to connect the website and VIDAOO using a web project, through the API. In order to create the web button or a more complete contact form with the web button  on the specific website, you need to edit your website code.

  • Download the web project Vidaoo-contact form:

View file
namevidaoo-contactform.zip
height150

The project is based on: 

HTML (HyperText Markup Language)- standard markup language for documents designed to be displayed in a web browser. 

Java- high-level, class-based, object-oriented programming language that is designed to have as few implementation dependencies as possible.

CSS (Cascading Style Sheets)- style sheet language used for describing the presentation of a document written in a markup language such as HTML.

PHP- server side scripting language embedded in HTML, used for programming dynamic web pages


  • Drag the Vidaoo-contact form project into the domain directory (a server host supporting HTML and PHP is needed)


Check and edit parameters

The PHP file is responsible for making the API request. For the purpose of successfully activating and editing the request, check the parameters in the PHP directory. 


  • You have the possibility to edit the Contact Form with the web button, choosing and personalizing the fields shown to the Customer 

Image Added

Image Added



  • You have the possibility to edit the string $data in vidaoo.php, setting various fields of the meeting session

Image Added

For example:

- 'topic' is the topic of the meeting (i.e. MY_WEBSITE), which appears  also in the video call session and in VIDAOO reports.


Image Added

Image Added


- 'metadata' are video call data in JSON format useful for VIDAOO automations. 


Authenticate on VIDAOO

The API links the website to the VIDAOO solution, to which we must have access. So, you need to authenticate your account VIDAOO on the web project, inserting your API KEY.  

  • Login into VIDAOO. Check here VIDAOO documentation
  • Create a role with customized permissions (i.e. you can create the "Clicktocall" role only to generate and manage meetings) 

Image Added

  • Create a user, associating the customized role (i.e. you can create a user "Clicktocall" dedicated to the web project)

Image Added

  • Generate the token connected to the new user, clicking on the key button and then create the API token

Image Added

  • Copy the token

Image Added


  • Move to the Vidaoo-contact formweb project
  • Paste the token in the PHP directory string 'X-APIKEY', aimed at having your authentication done

Image Added


Connect XCALLY to VIDAOO

The Customer can now click a button and generate a video call (VIDAOO Quick Meeting).   

In order to let Agents receive notifications and answer the video call, you have to connect XCALLY to the VIDAOO project: 

  • Create an OpenChannel Account (i.e. Clicktocall Vidaoo)

Image Added

  • Add agents to the new OpenChannel Account to associate specific Agents to VIDAOO account and manage the video call


Track the video call route

Create a Webhook automation

  • From the XCALLY new OpenChannel Account, copy the URL included in the Receive URL section. This URL will be fundamental to create an XCALLY webhook from VIDAOO.

Image Added

Image Added


  • Move to VIDAOO
  • Create an XCALLY webhook automation : When the Customer clicks on the web button, the Agent receives a notification and can join the video call.  
  • Select the condition when: a meeting is created

Image Added

  • Among the Actions, select the XCALLY Webhook 
  • In the field Url, paste the URL included in the Receive URL section of the XCALLY Openchannel Account
  • You can also customize your webhook, according to your needs

Image Added


Notify Agents of incoming video call

  • When the Customer click on the web button, the Agents belonging to the VIDAOO OpenChannel Account receive the notification of a video request on XCALLY Motion Omni Desktop Interface

Image Added





  • When one of the Agents accepts the interaction

Image Removed

inside it
  • , he/she finds the video session link
to click.STEP 4 - After clicking

Image Added








  • After entering the link, the session is established and the
conversation
  • VIDAOO meeting starts
:
  • !



SCENARIO 2

The Vidaoo VIDAOO Session can be activated by the Agent with a Customer during a Chat interaction.  

Clicking on Start Video Call a web link to join a video call is generated. 


  • The
  • Vidaoo
  • VIDAOO link is shown to the Agent (in the interaction form):

Image RemovedImage Added

  • Simultaneously, the Customer receives the Vidaoo VIDAOO link and is invited to participate:


Please note: 

    • The Vidaoo feature is available only if the Administrator has configured the Video option for the specific Chat Website.
    • The number of available sessions set for your Account on Vidaoo must not be exceeded. 

Video call Overview 

When entering the Vidaoo VIDAOO meeting in following Scenario 1 (by clicking on the start button) or in Scenario 2 (by accessing the link sent by the Agent during the chat interaction), the Vidaoo meeting video call can be managed as usualin a very simple and intuitive way

Below, a brief overview of the video call is presented. Click  Click here for further reading. 

CUSTOMER

Image RemovedImage Added


The Customer can use the buttons on the screen in order to:

Image Removed


Image Addeddisable/enable Video
and

Image Added

disable/enable Audio

Image Modified

switch to full-screen


many more custom buttons can be displayed!

              

At the end of the conversation, the customer can press  to leave or end the video meeting.


 AGENT

Image RemovedImage Added


The Agent can use the buttons on the screen in order to:

Image Modified

disable/enable Video

Image Modified

disable/enable Audio

Image Modified

switch to full-screen

Image Modified

enable/disable screen sharing

Image Modified

Start/Stop recording the video

Image Modified

Snap a picture from the video 

many more custom buttons can be displayed!


At the end of the conversation, the Agent can press  to leave or end the video meeting.