Touch Player logo

Touch Player beta

A interactive touch based content player

This package allows you to created interactive video/image displays. Users can navigate content by touch. Each page consists of a single piece of content shown on the screen. You can create touchable links to navigate to other pages. Additionally you can specify timeouts so content can automatically transition between pages without user interaction.

Configuration

Create a new setup. You will be greeted by the default configuration:

Index page

In the General settings section you should set the target resolution of your content as well as the rotation of your screens. The resolution doesn't necessarily have to match the resolution on your screens. It's mostly used to figure out the aspect ratio and how content placement works.

Click on the small content icon left to the Index line. You'll see the page editor:

Page editor 1

This page allows you to edit the selected page and create or link other pages. Here is what you can do:

  1. The top left button allows you to navigate back to the page index.
  2. This text field allows you to name the current page. This makes it easier to work with your content.
  3. Allows you to select the video or image shown on this page.
  4. Previews the current page. The size and aspect ratio is determined by the resolution and rotation settings on the index page. You can click and drag an area on the screen preview to create a new touchable link. See below.
  5. This button allows you to create a new touch link to another page. This will cover the complete screen. If you want to create a smaller touch area, drag/drop on the preview screen (4.) instead.
  6. This creates a new timeout navigation.

A page on it's own is pretty boring and will endlessly loop its configured content (changable by clicking on 3.). Pages get interesting if you link them to other pages. There are multiple ways to create new links: Click on 5. or 6. to create a fullscreen touch area or timeout link. If you want to have multiple touch areas resulting in different target pages, click and drag on the preview area (4.) instead.

Here's a page with two links added already:

Page editor 2

This page has a single touch link and a timeout link configured. Let's go through the interface:

  1. This is a configured touch area. When the user touches the area, the configuration in 2. decides what happens.
  2. This is the corresponding configuration for the above touch area. It's also color coded, so this configuration is for the red area in the preview screen.
  3. There are two types of links. This is a touch link. A user has to activate it by touching the screen.
  4. This is a timeout link. After a configured time (10 seconds in the example), the screen navigates to the configured target page.
  5. Every link triggers an animation when transitioning to the target page. You can chose from the available effects here.
  6. Chose the target page from your existing pages.
  7. Select Previous page if you want to navigate to the previous page. If you think about a browser, this is essentially a "back button".
  8. If you want to create a new page, click Create new page

You can simulate some of the content navigation by clicking on the touch areas (1. in the above screenshot) or by clicking on the small preview next to 3./4.

If you need help with this package, you can post to this thread on the info-beamer community forum.

Want to run Touch Player on your Raspberry Pi?

This package is ready to run on your Raspberry Pi using info-beamer.com hosted. Easily manage unlimited number of Raspberry Pi devices and centrally configure and run visualizations like this on them. info-beamer.com is a prepaid service. You only pay for the resources you are using. No long term commitment, no hidden fees. Learn more...

Source code for this package

You can view (and modify) the source code for this package on https://github.com/info-beamer/package-touch-player

Copyright