Interactivity

From SpinetiX Support Wiki

Jump to: navigation, search

Introduction

In the digital signage context, interactivity refers to the HMP quality of reacting in a user-defined manner (i.e. reactive action), following the input received from external devices. The interactivity trigger could be a human input (via a touchscreen, a keyboard, a web page etc.) or machine input (e.g., another HMP, a Control System etc.).

Based on how the HMP communicates with the external device, three types of interactivity can be differentiated:

Based on the message received, the HMP can perform reactive actions like:

  • switch from the displaying the regular content to displaying a particular content;
  • display the message received (i.e. instant text messaging) or contextual animations, images and / or videos on the screen;
  • display or hide part(s) of the current content;
  • control the playback (e.g., play, pause, resume, stop) of video, audio or animated content;
  • send a message to other devices (including other HMPs, serial devices etc.);
  • do an AJAX request to an HTTP server;
  • ... and many more.

Process overview

The process to create interactivity is always the same, regardless of how the external device is connected to the HMP:

  1. Input
    HMP receives an input message from the external device via USB, Ethernet or serial port.
  2. Input conversion
    The HMP translates internally this message into an event (like keydown, mousedown, mousemove etc.) or a Shared Variable update action.
  3. Reactive output
    The HMP executes a reactive action according to the interactive logic (JavaScript / jSignage code, interactive widgets etc.) defined for that particular event or update action.

How to configure the HMP for interactivity

Further details about how to configure the HMP for the different types of interactivity are presented on:

How to create interactive content

There are different methods to create interactive content (projects) for HMP:

  1. Using the interactive widgets of Elementi (respectively, the interactive templates of HMD).
  2. Using jSignage library which provides many functions to build interactive content.
  3. Using pure JavaScript and SVG code: JavaScript, Input events and uDOM manipulation.

Further details about how to create interactive content are presented on:

Interactive projects

You can also build your interactive project starting from one of the following sample projects:

See also how to add a mouse cursor to an interactive project.

This page was last modified on 20 February 2017, at 13:42.