Display media content

From SpinetiX Support Wiki

Jump to: navigation, search


This tutorial explains how to include common media content (like image, video, audio) within your Elementi project and display the result on the screen.

A media resource can be a local file, previously imported inside the project, or a remote file, retrieved from a web server via HTTP protocol.

For the special case of streaming media, check out the dedicated tutorial: Display streaming media content.



  • Difficulty: Easy.
  • Total duration: < 5 minutes.
  • Requirements:
    • Elementi, version 3.x or later. (The latest version is recommended.)
    • One or more HMP devices using firmware 3.x or later. (The latest version is recommended.)
    • One or more media files compliant with the HMP specification. See Video decoding page for more details.


  1. Open Elementi and create a new project. (For further information, check out "My first Elementi project" tutorial as well.)
  2. The index.svg should be automatically opened, otherwise, double-click on the project icon in Browse panel.
  3. To include local media files inside the project:
    1. Import the media files into your project using drag & drop. If you have troubles with this step, check out this video tutorial.
    2. Once the media files are imported, simply drag & drop them into the Preview panel or the Edit panel.
  4. To include remote media files inside the project:
    1. Make sure that the remote media file is accessible via HTTP protocol, for instance by opening it in a browser.
    2. Add a new media layer using the "Add Media Layer" button on the toolbar.
      • Alternatively, right-click within the Edit panel and select "Insert Media Layer" (Ctrl+Insert key).
    3. Enter the URI of the remote media resource - for instance http://MyServer/MyImage.png.
    4. Click the "OK" button.
  5. Position the new layer within the Preview panel and / or fine tune its properties using the Layer Properties dialog.
  6. Click the "Save" button to save the changes in your project.
  7. Publish the project on the HMP device(s).

Note Note: For local media files, the URI property of the media layer is set to a relative address, like MyVideo.avi or media/MyVideo.avi.

This page was last modified on 24 March 2017, at 11:00.