Using CLIO in Open Broadcaster Software

From CLIO

Google material book.png

Overview

You can use Open Broadcaster Software to integrate CLIO and its activities into a video conference, live stream or pre-recorded videos that you can share online. This will require installing a Local Web Development Environment to host CLIO so it can be embedded into the streaming software.

Creating a Local Development Environment


CLIO is a web-based application, which means that it needs to be hosted on your local machine using a Local Web Development Environment (LWDE).  There are many free and open-source Local Web Development Environments available, which quickly create a local web server with all of the required tools. These software packages can also be used to quickly create kiosks.

Preparing Streaming Software

Installing Open Broadcaster Software

Open Broadcaster Software has an automatic installer for the Windows and MacOS operating system, as well as packages for a variety of Linux distributions.

Quickstart Guide

The Open Broadcaster Software Wiki has an official Quickstart guide for getting acquainted with the interface.

Understanding CLIO URL Parameters

The CLIO web application uses a URL query-based system to load the interface dynamically based on what parameters is based to it through the URL.  This can be thought of similarly to the way options are passed into a programming function.  When the CLIO web application directory is navigated to without any parameters, it will default to the full “Facilitator Mode” experience.

Adding CLIO Activities into OBS

Within OBS, you can use a Browser Source to integrate CLIO activities that are hosted through your Local Development Environment at http://localhost/clio/. You can use CLIO activities hosted on a remote host, such as your institution's website, but this may have latency issues that cause problems with live streams or recorded videos.

Interacting with CLIO Activities

When you right click on a Browser Source for a CLIO Interactive within the Sources pane, there is the option to interact with the Browser. This will open CLIO in a window where you can interact with the activity, with all changes reflected in the OBS recording or virtual webcam feed.

Documentation
Installation Look and Feel
Interaction Modes Developing Activity Types
Creating an Interactive Framework
Integrating CLIO Contribute