MultiQ DSMS 3 User Manual

MultiQ Digital Signage
DSMS 3 User’s Manual
Contents
Introduction ............................................................................................................................................................................................. 4
Preparations ........................................................................................................................................................................................... 5
Set up your first physical media monitor or media player .................................................................................. 7
Setting up a media monitor ........................................................................................................................................................ 8
Unpacking ........................................................................................................................................................................................................................................ 8
............................................................................................................................................................................................................................................ 8
Connections
.................................................................................................................................................................................................................................... 8
Hardware Installation
............................................................................................................................................................................................................... 9
Control panel buttons and LEDs
.................................................................................................................................................................................... 9
Buttons
................................................................................................................................................................................................................................................ 9
Media players 4 and 5 ............................................................................................................................................................... 10
Connections ................................................................................................................................................................................................................................ 10
Hardware Installation
........................................................................................................................................................................................................... 10
Front panel LEDs
.................................................................................................................................................................................................................... 10
Configuration ..................................................................................................................................................................................... 12
Monitor adjustments ............................................................................................................................................................................................................. 12
To “Auto adjust” the image location on the monitor ................................................................................................................................................................................................. 12
To calibrate the touch panel
......................................................................................................................................................................................................................................................... 12
Configuration and connection check ............................................................................................................................. 14
Basic configuration ............................................................................................................................................................................................................... 14
Stand alone setup
.................................................................................................................................................................................................................. 15
Centrally managed network setup
............................................................................................................................................................................ 18
Downloading content
.......................................................................................................................................................................................................... 19
Flash installation ............................................................................................................................................................................. 20
Troubleshooting ....................................................................................................................................................................................................................... 20
Testing the web client and defining your first media player ......................................................................... 22
To find confirmation that the media player is connected to the DSMS .................................................. 25
Decreasing the media player report interval ..................................................................................................................................................... 25
Content Management basics ................................................................................................................................................ 27
Organizing playlists into channels ............................................................................................................................................................................. 28
Image retention
........................................................................................................................................................................................................................ 29
Exercise 1 – Create a simple full screen digital poster or an in-store TV channel .................... 30
To upload content to the DSMS (Digital Signage Management Server) .................................................................................. 31
Single file upload
.................................................................................................................................................................................................................... 31
Multiple file upload
................................................................................................................................................................................................................. 33
Creating playlists
..................................................................................................................................................................................................................... 34
To add a playlist ...................................................................................................................................................................................................................................................................................... 34
Adding media files to the playlist
............................................................................................................................................................................................................................................. 37
Editing the playlists
.............................................................................................................................................................................................................................................................................. 37
To create a channel (Group Playlist)
..................................................................................................................................................................................................................................... 38
To add playlists to your channel
................................................................................................................................................................................................................................................ 40
To associate the channel with the media player
......................................................................................................................................................................................................... 41
To add more playlists and content to the channel ....................................................................................................................................... 42
To create a second playlist ............................................................................................................................................................................................................................................................ 43
To play playlists in sequence ......................................................................................................................................................................................... 46
Scheduling
................................................................................................................................................................................................................................... 47
Adding more playlists
.......................................................................................................................................................................................................... 52
Adding a playlist with a movie file
............................................................................................................................................................................. 52
Using a web link (URL) as a media spot in playlists
.................................................................................................................................. 55
Add a playlist with an SWF Flash file
..................................................................................................................................................................... 58
A live stream treated as a media spot
.................................................................................................................................................................... 61
Exercise 2 – To build a web kiosk .................................................................................................................................... 67
Adding a virtual keyboard ................................................................................................................................................................................................ 69
Exercise 3 – Local interactivity ........................................................................................................................................... 74
Build a multi region application ................................................................................................................................................................................... 76
To build the Dashboard
..................................................................................................................................................................................................... 83
Making the html dashboard
............................................................................................................................................................................................ 89
Preview the dashboard web page in window
................................................................................................................................................ 101
To publish the dashboard website to a folder on your hard drive
................................................................................................ 103
To put the dashboard inside the media monitor
......................................................................................................................................... 106
To upload the Dashboard to the media player ........................................................................................................................................................................................................... 109
Exercise 4 – Adding a ticker .............................................................................................................................................. 119
Getting tickers from RSS feeds ............................................................................................................................................................................... 119
Exercise 5 – The “Stores” feature –Scalability .................................................................................................... 124
Scalability and how to handle multiple stores ............................................................................................................................................... 130
To control the display hours in the stores
........................................................................................................................................................ 131
Appendix 1 – Monitoring and logging the units ................................................................................................. 133
Appendix 2 – Controlling the default playlists ..................................................................................................... 134
Scheduling default playlists ......................................................................................................................................................................................... 134
Setting the time to revert to the default playlists
....................................................................................................................................... 135
Appendix 3 – Mixing local play with web elements in in-store TV channels ............................... 137
Building an in-store TV channel including web- and API controlled elements .................................................................. 137
Building the video mode to fit widescreen monitors
............................................................................................................................... 138
Appendix 4 – Local insertion ............................................................................................................................................. 139
Appendix 5 – Interconnected media players ........................................................................................................ 140
Appendix 6 – Synchronizing media players ........................................................................................................... 142
Appendix 7 – Rights management ............................................................................................................................... 143
Appendix 8 – How to secure your media player ................................................................................................ 145
Appendix 9 – Converting PPT to video clips ......................................................................................................... 146
To use Power Point Presentations for digital signage .......................................................................................................................... 146
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 4
Introduction
This manual is an introduction to MultiQ DSMS 3 (Digital Signage Management System 3) and Media player 4, 5 and Media monitors 4, 5, 6 and 7. DSMS 3 is backwards compatible with MultiQ Media player 3, Media player 2 and Media player 1. I.e. that previous Media player 1, 2 and 3 features may be administrated by DSMS 3 as well. To be able to use the web- and Open API features, Media player 3 or Media players 4, 5 or Media monitors 4, 5, 6 and 7 need to be used. It is possible to have a combination of all four generations of media players administrated in the same account.
It is also possible to manage the media monitors and media players in standalone mode without any central server.
To implement interactive applications for media players 1 and 2, Java script interactivity is used. Media players 4, 5 and media monitors 4, 5, 6 and 7 support Java script interactivity as well but it is recommended to use html interactivity instead since this gives access to the features of the API (Application Programming Interface).
The manual includes a number of exercises that are intended to introduce you to all the features of the MultiQ DSMS 3 step-by-step. Please do the exercises in chronological order since each exercise is based on prerequisites gained in previous exercises.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 5
Preparations
In order to make the exercises you will need the following:
One Media monitor 4, 5, 6 or 7 or a Media player 4 or 5. If a Media player 4 or 5 is used for the
exercises you will need a touch panel monitor to be able to do the interactivity parts.
As an option the MultiQ POS (Point of Sale) Pole with rotatable attachment for the monitor can be
used. This makes it easy to rotate the monitor between landscape and portrait orientation (pivot). Portrait orientation is not used in the exercises but a rotatable attachment is recommended when developing applications.
A PC with a web browser.
Your DSMS 3 content management account address and password*.
A broadband connection allowing for HTTP- and FTP traffic (see to that there are no restrictions in
your firewall preventing you from using the content management server) **
The content- and tool files required for your exercises (can be downloaded from the MultiQ
website,
www.multiq.com).
A web page creation tool according to your preferences. Serif Web Plus SE is a suitable choice and
is used in this manual (can be downloaded for free from
http://www.freeserifsoftware.com/software/webplus/index.asp).
As an option an external website where you can build your own website may be useful.
If you wish to try the Client Open API interconnectivity features you will need more than one Media
Player (preferable on Media monitor and one Media player with a separate widescreen monitor) and a gateway router (NAT box).
*) Required for centrally managed mode only
**) Required for centrally managed mode. An Internet connection is also required when using the media player/monitor as a web kiosk or when retrieving other content from external servers on the Internet.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 6
Figure 1. MultiQ Media player and Media monitor product range.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 7
Set up your first physical media monitor or media player
As soon as you have a unit defined in the DSMS we are ready to set up a physical media monitor or media player for test.
To be able to do all of the exercises (including interactivity), it is preferable to use a Media monitor 5 or
7. Media players 4 and 5 can be used but this requires a separate monitor to be used. To do the interactive parts of the exercises the monitor needs to include a touch panel with a USB interface that is to be connected to one of the USB ports of the media player.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 8
Setting up a media monitor
Unpacking
Please make sure that the following items are included in the package and in good condition. If you find that any items damaged or missing, please contact your retailer immediately.
One media monitor
AC/DC adapter with 12V DC output
AC power cord
This user manual
Mounting
Mounting and attachment hardware is not included. The monitor has a VESA 75 x 75 mm interface. Please contact your MultiQ reseller if you wish to mount your media monitor on the wall or on other kinds of stands. Mounting instructions are provided with each separate mount.
Connections
The media monitor has connections for Audio (digital and analogue), LAN and USB I/O are to be found behind the lid on the back of the unit. The knob on the lid is to be turned counter clockwise to release the lid.
Figure 2. Media monitor back panel connections are located behind the lid.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 9
Hardware Installation
The audio outputs may be connected to analogue or digital inputs on external audio systems. The LAN port must be connected to a LAN with Internet access.
During setup a USB keyboard should be connected to one of the USB ports. Do all connections before powering up by connecting the external power supply.
Control panel buttons and LEDs
On the back of the Media monitor there are three buttons and 4 LEDs.
Figure 3. Media monitor control panel with operating buttons and indication LEDs.
Buttons
Power on button
+ / – buttons to adjust brightness
LED indications:
Power – This led will be lit when the media monitor is on (Blue).
Status – This led indicates activities and result of activities
Flashing between red and green: ongoing activity as starting up, shutting down or download in
progress.
Green: download succeeded
Red: communication with digital signage management server failed or download failed
HDD – Flash memory activity (Yellow).
LAN – Flashes when there is activity on the LAN port.
Not lit: no network access
Constantly lit in green: Link up at 100 Mb/s or 1000 Mb/s
Flashing in green: Network activity at 100 Mb/s or 1000 Mb/s
Constantly lit in red: Link up at 10 Mb/s
Flashing in red: Network activity at 10 Mb/s
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 10
Media players 4 and 5
The Media players 4 and 5 are operated in very much the same way as the Media monitors. If you intend to use a separate Media player to do the exercises you will need an external monitor. To do the exercises including interactivity you will need to use a monitor with a touch panel. The touch panel needs to have a USB interface that is connected to one of the media player USB ports. In the sections below the controls and indications of the media players 4 and 5 are described.
Connections
The media player has connections for DVI-D (digital only), Audio (digital and analogue), LAN and USB I/O.
Figure 4. Media player back panel connections.
Hardware Installation
Connect the DVI-D output to the monitor to be used. If the monitor has an HDMI input a conversion cable should be used. A monitor must be used when configuring the media player.
The audio outputs may be connected to analogue or digital inputs on external audio systems. The LAN port must be connected to a LAN with Internet access.
If a touch panel monitor is to be used, one of the USB ports should be connected to the touch panel interface of the monitor.
During setup a USB keyboard should be connected to one of the USB ports. Do all connections before powering up by connecting the external power supply.
Front panel LEDs
On the front of the media player there are 4 LEDs.
Figure 5. Front panel with indication LEDs.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 11
Power – This led will be lit when the media player is on (Blue). Status – This led indicates activities and result of activities
Flashing between red and green: ongoing activity as starting up, shutting down or download in
progress.
Green: download succeeded
Red: communication with the digital signage management server failed or download failed
HDD – Indicates hard drive activity (Yellow). LAN – Flashes when there is activity on the LAN port.
Not lit: no network access
Constantly lit in green: Link up at 100 Mb/s or 1000 Mb/s
Flashing in green: Network activity at 100 Mb/s or 1000 Mb/s
Constantly lit in red: Link up at 10 Mb/s
Flashing in red: Network activity at 10 Mb/s
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 12
Configuration
To perform initial setup of a media monitor either the touch panel (Media monitors 5 and 7) or an attached mouse can be used (Media monitors 4 and 6 that do not have touch panels).
Monitor adjustments
To “Auto adjust” the image location on the monitor
Reboot the media player once more. After the media player has booted a white sign with two MultiQ logos is shown on the screen. If the image is not correctly centered on the screen this may be corrected by simultaneously pressing the “+” and “-“ buttons on the back of the monitor. It is crucial that this adjustment is done before calibrating the touch screen. This adjustment will secure that the content is presented at the correct location on the screen and the setting will be automatically stored in the monitor.
To calibrate the touch panel
Next step is to calibrate the touch panel to ensure that a touch on the screen is detected at the correct location on the screen.
During reboot of the media player a test pattern is shown. By touching the test pattern the calibration process will be initiated.
Figure 6. The calibration process is initiated by pressing the test pattern that occurs when booting up.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 13
When calibration is done it is automatically stored in the media player and no further calibration is needed as long as the same media player is connected to the monitor. If the monitor or the media player is replaced the calibration procedure has to be done once more.
Figure 7. Follow the instructions at the center of the screen to calibrate the touch panel.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 14
Configuration and connection check
Basic configuration
After the test card has been shown, the monitor orientation setting will appear. By pressing the centre button you can rotate the menu system to fit the orientation of the monitor.
Figure 8. By pressing the centre button the configuration menu can be rotated.
When the proper orientation of the menu system has been chosen the language setting menu will appear. By choosing the language, also the language keyboard setting is selected.
Figure 9. The language settings menu.
Next is the setup menu login page. You will find see the virtual keyboard at the bottom of the page. By default the username is “admin” and the password is “admin”.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 15
Figure 10. Use the virtual keyboard to enter username and password.
Stand alone setup
As default the “Basic” setup menu is chosen. If you intend to use the media monitor as a standalone unit (without access to a central managing system) press the “Standalone” button (default).
In most cases media players are connected to a local network that provides an IP address automatically. If so, press “DHCP”. Then press “Test connection”.
Figure 11. Standalone setup with DHCP selected.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 16
Before proceeding to the next menu a Test connection should be made. Clicking the test connection button will provide you with the IP address that the unit has acquired from the DHCP server.
Figure 12. The connection test will provide you with the IP address of the media monitor.
After pressing the “Next” button you will find yourself in the digital signage management system main menu.
As an alternative to acquiring an IP address automatically, the IP address can be set manually. In such case you must obtain IP addressing parameters from your network administrator.
Figure 13. As an alternative the IP address of the media monitor can be set as static.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 17
Most features of the media monitor can be handled using the onscreen menus. However in order to upload content files and for more practical handling of the unit, you are recommended to log in to the media monitor from your PC. To log in to the unit you need to know its IP address.
To be able to log in to the unit you also need to remove the web server lock. For security the web server is by default locked from inbound requests. To remove the web server lock you need to click the “Users” icon to the left. The “Disable remote access to web server” check box should be unchecked. Then click “Save”. After a while the media monitor will be available for inbound requests.
Figure 14. In the “Security menu” (reached by clicking the “Users” icon to the left), the web server lock can be removed and the password can be changed.
Another thing that should be done at an early stage is to change the administrator password. In the “Security” menu (Figure 9) tick the “Admin” checkbox and then click the “Modify” button to change the administrator password. After entering the new password, press “Save”. Finally press “Done” to leave the onscreen menu system.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 18
Figure 15. The administrator password can be changed by ticking the “Administrator“ checkbox and then clicking the “Modify” button.
By connecting your PC to the same subnet as the media monitor it is now possible to log in to the server from your PC or MAC. Just put the IP address of your media monitor on the address line of your web browser and log in to the media monitor web server using the password that you have chosen. Using your web browser you can now manage the content that is to be used in the media monitor.
A more detailed manual on how to manage content in standalone mode is included in appendix 1. If you intend to use your unit in standalone mode, please go there now.
The remaining part of this manual describes how to handle a centrally managed system.
Centrally managed network setup
If the media monitor is to be used in a centrally managed digital signage network you should choose “Managed” in the configuration menu. Add the media monitor ID and the URL of the server (Account URL) along with the username and the password that have been provided by the network administrator. Then click the “Test connection” button to verify that a script file is received from the management server. In order to get a successful connection test the media player or media monitor needs to be defined in the central management system. How this is done is described in the “Testing the web client and defining your first media player” section.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 19
Figure 16. Centrally managed setup of the media monitor.
If you are successful you will get a sign on the screen telling you that the unit has received a script file and that the connection is up. It also confirms that the media monitor Unit ID is defined in the digital signage management system.
If the connection test fails, start by checking the parameters once more to see that everything is correctly set. Also check the LAN cabling.
When everything is working correctly press “Next” to save the settings. After the reboot the media monitor will automatically start downloading the files decided by the digital signage management system. While downloading files the “Status” LED will flash between red and green.
Downloading content
After the reboot the media monitor will automatically start downloading the files decided by the digital signage management system. While downloading files the “Status” LED will flash between red and green.
If a touch panel (Media monitor 5 and 7) or separate monitor with touch panel, the touch panel must be calibrated according to before use.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 20
Flash installation
If the media monitor is to use Flash files a Flash plug in has to be installed. This is done by pressing the “Plug-ins” button in the configuration menu. Follow the instructions to install Flash. Also other plug-ins will become available in this menu.
Figure 17. Plug-ins such as Flash are available in the “Plug-in” menu.
Troubleshooting
The media monitor doesn’t power up
Check the LED on the power supply. If not lit, make sure it’s properly connected to a wall socket.
If the power supply LED is lit, but the media monitor still doesn’t power up. Check the cable between
the power supply and the media monitor.
The media monitor shows an “IDLE” message
Check the status LED, if flashing between red and green, the media monitor is downloading content.
Wait for download to complete.
Check the settings in the configuration menu and make a connection test.
Check the Ethernet connection. Make sure that the outbound ports 21, 80 and NTP 123 are left
open in the firewall.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 21
Check with the digital signage management system operator if any content is assigned to the
media monitor.
The media monitor displays the wrong content
Check the Unit ID in the configuration menu.
Interactivity between media monitors or other devices do not work
Check the IP addresses for each device and see to that they are set according to the instructions
provided by the digital signage management system operator.
Additional information on the media monitors and media players is to be found in the support section of the MultiQ website.
We have now installed our first media monitor or media player and in the next section we will start to learn how to put content on the screen.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 22
Testing the web client and defining your first media player
To operate a unit in centrally managed mode it is necessary to define the unit in the central management system before testing the unit in the field.
First try to connect to the digital signage management server (DSMS) using the web browser in your PC. To do this you need to know the address for the content management server, have a username and a password. These are provided separately as a part of the “Server account starting license” document.
Figure 18. Start by logging in to the server account.
It is recommended that you change password before putting the system into operation. How to change password is described in Appendix 1 where you also learn how to add users with individually selected rights.
When you have logged into the system you will first find yourself in the Units and Group Playlists menu. The upper part of the menu contains media players included in the system (infrastructure) and the lower part “Group Playlists” contain a summary of what content is used in the system.
The first time you log into the DSMS you will also find that there are no media players (units) defined in the “Units” section of the menu.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 23
Figure 19. The first time you login to the DSMS you will find that there are no media players.
Define your first media player. Click the Add button at the lower right of the “Units” portion of the menu (Figure 19) . You will now get into the “Add unit” menu shown in figure 20.
Figure 20. How to define your first media player in the “Add unit” menu.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 24
Enter “1” into the Unit ID box and type “Media player 1” into the “Name” box. Note that it is mandatory to type something into the “Name” box. Otherwise the unit will not be saved. The other fields, Location, Description and address details are optional.
At this stage the Video Mode shall be chosen. The video mode defines how the screen is to be used when it comes to screen orientation and resolution. The video mode also defines how a screen can be split into regions (which will be covered later on).
Select “SXGA- Full Screen without ticker- landscape(0)”. Finally click the “Add button” at the lower right of the menu. Your first media player is now defined in the system.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 25
To find confirmation that the media player is connected to the DSMS
In the DSMS web interface we can now find that the media player has recently communicated with the DSMS. By reloading the “Units and Group Playlists” by clicking the corresponding icon you can see when the media player did its most recent request to the DSMS. This is a way to keep track of that a media player is connected and working. Note that a media player will not make any requests to the DSMS while showing the media player configuration menu except from when a “u” button test request is initiated from a keyboard connected to the media player.
Figure 21. In the “Units” section of the “Units and Group Playlists” menu it is easy to see when a media player did its most recent request to the DSMS.
Decreasing the media player report interval
By clicking on the media player icon in the “Units” menu we get into the configuration menu for that particular media player. By clicking the “Settings” tab we can make a number of settings. One of these setting is to change the video mode (as we already set when defining the unit). To make thing more practical when making the exercises we will now shorten the “Report Interval” (the time between requests from the media player) from the default 120 seconds to 30 seconds.
Also see to that the aspect ratio is set to 5:4 when using a 19” touch panel monitor. If you want to make a presentation on a wide screen monitor you should select 16:9. In this example we assume a 5:4 aspect ratio monitor.
Then press the “Save” button at the bottom of the page. Making changes in the “Setting” tab will cause the media player to reboot.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 26
Figure 22. Decreasing the report interval for the media player.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 27
Content Management basics
In digital signage systems there are four basic stages that are followed in bringing the content from the creator to the screens.
The first step is to upload the content to and archive in the DSMS (A).
The second step is to arrange the content files into playlists and channels that are to be presented
by the media players (B).
The third phase is to transfer the required files to the media monitors and media players (C).
The last phase is to initiate the files on the screens. This can be done either by scheduling or by
some interactive command to the media player as if someone is pressing a button on a touch screen (D).
The time it would take for a content file to be transferred from the web client, of the content administrator, handling the DSMS account until it gets on the screens may vary from seconds to months due to the application. The transfer time is also affected by file size and the capacity of the broadband connections used.
Files may also be retrieved from external websites and by local input.
Figure 23. The basic flow of content in a digital signage system.
To use the files in our media players we need to organize them and to decide how they are going to be presented.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 28
Media files are organized into playlists. A playlist is a sequence of images, web pages and video clips that are repeated continuously. Each portion of a playlist (video clip, image or webpage) is called a spot. Therefore a playlist can be regarded as a repeated (looped) sequence of spots.
The reason why playlists are used in digital signage is that each customer stays only for a short while in the proximity of the screen. This means that there are always new people to watch the message and this result in a need for repetition. The length of a playlist may vary depending on where the monitor is located and the application. In a store people may not stay in front of a monitor for more than a few minutes while in an airport lounge they may stay for half an hour or more. These circumstances have a large impact on the choice of length of playlists.
Figure 24. The media files are arranged into playlists that are repeated in a loop.
Organizing playlists into channels
In the exercises you will learn how to create playlists and to organize the playlists into group playlists or channels. There is a special reason for using this procedure that may at a first glance seem a bit too ambitious.
It is possible to associate a particular spot or playlist directly to a media player to have it played instantly. However this is a very complicated way of handling content when it comes to updating a large number of media players. If you associate a media specific file to a media player and you want to have it replaced you either will need to manually associate another file to each of the media players in your system on an individual basis or to create another file having the same name. The same problem occurs with playlists. If you have a playlist connected directly to a number of media players you to either have to stick to one playlist name or to replace the playlist file in each of the media players on a one-by-one basis. This is not very practical. Therefore a better choice is to define a group of playlists (Group Playlist). This is also called a channel. Having a fixed channel associated to a number of media players means that you have a great flexibility when it comes to updating and changing the structure of the content without manually changing the configuration of each media player. If you make a change in the channel it will affect all of the media players using that channel automatically. By doing this you keep the content separated from the infrastructure of your digital signage system and you do not have to think about individual media players when making an update to your content.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 29
Figure 25. Organizing the playlists into channels before associating then with individual media players makes it possible to update the content in just one location without dealing with the individual media players.
Image retention
All monitors are more or less sensitive to image retention. Temporary or permanent image retention (visible tracks of previously shown images) is caused by long-time display of static images. Especially static images containing hard contrast transitions may cause image retention. Therefore it is recommended not to display the configuration menu or other static content during a long period of time. In applications where static images are inevitable as in kiosk applications with buttons, hard contrast transitions should be avoided and screen saver videos are recommended.
After this brief introduction we take a look at some exercises guiding you through the basic principles of content management. After having completed the exercises you will be able to design your own applications. Therefore you are recommended to make the exercises before starting on your own projects.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 30
Exercise 1 – Create a simple full screen digital poster or an in-store TV channel
Figure 26. In this exercise we will learn basic digital poster and in-store TV techniques
To proceed with the exercises we need content. On the MultiQ website
www.multiq.com you will find the
content files and other tools that are needed for the exercises. Download the files and place them in a (Content and tools) folder on your PC.
Figure 27. The training content can be downloaded from the MultiQ website and contains the files and tools needed for the exercises.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 31
To upload content to the DSMS (Digital Signage Management Server)
The first thing we need to do is to upload content to the DSMS. In the DSMS there is an archive, the Media Bank”. Click the “Media Bank” icon to get into the “Media Bank” menu. At first startup you will find that the Media Bank is empty.
To start uploading files to the system press the “Upload” button.
Figure 28. Press the “Upload” button to start uploading files to the DSMS.
Single file upload
If single files are to be uploaded to the DSMS then just press the “Browse” button and browse for the file to be uploaded from the content folder on your PC. After selecting the “Bank1_16_9.jpg” file, in the content folder, click the “Upload” button.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 32
Figure 29. Making a single file upload to the Media Bank.
Next you will see a menu where you can choose to keep the aspect ratio by having black borders added to the screen alternatively to have the image stretched. In this case we will add a 16:9 widescreen image file to the Media Bank. Since we intend to use a 5:4 SXGA monitor it is preferable to tick the “Keep Aspect Ratio” box and the click “Save”
Figure 30. In the “Modify uploaded media” menu, tick “Keep Aspect Ratio”.
Figure 31 shows the effects of the “Keep Aspect Ratio” parameter. Black borders will be added whenever needed to keep the correct aspect ratio of the image.
Figure 31. The effect of choosing “Keep Aspect Ratio”
A thumbnail of the uploaded image is now shown in the Media Bank.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 33
Multiple file upload
When uploading several images or video clips it is more practical upload them simultaneously. Instead of just clicking the “Upload” button, click the “Multiple Files” button to get into the Multiple Files upload tool. This is a Java script based tools that requires Java to be installed on your computer. You also need to allow your system to use the Java extension.
Browse to the folder where the desired files are kept and then mark and attach them to the tool. You can set the preferences for your files already in the upload tool. So tick the “Keep Aspect Ratio” boxes for each of the files.
Figure 32. Select, attach and upload a set of files using the Multiple File upload tool.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 34
When the upload is done, the files are presented as thumbnails in the Media Bank.
Figure 33. The uploaded images are presented as thumbnails in the Media Bank.
Hints!
It is easier to upload a larger number of files if they are located in the same folder right from the start. Otherwise you may have to do some extra browsing between folders before adding the files to the tool. The multiple file upload tool will save you a lot of time especially when uploading several larger video clip files.
While making an upload you may not go to another menu in the DSMS because this will stop the uploading process. If you want to perform other tasks in the DSMS while uploading you must open a second instance of your web browser and login separately to the DSMS.
Creating playlists
To add a playlist
The playlists are stored in the Playlist Bank (Click the “Playlist Bank” icon to get there). At first startup the Playlist Bank is empty. Start adding your first playlist by pressing the “Add Playlist” button.
Enter a playlist name, in this case “Playlist 101 Banking” into the Description box. Since we might want to add video clips at a later stage we need to click the “Movies and Images” box*.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 35
As will be discussed later, the screen may be split into maximum four regions where one of the regions may hold playlists including video files as well as images and web pages. The remaining three regions may just hold images and web pages. Therefore it is essential to consider in what kind of regions the playlist is intended to be used before it is created. In this case we intend to use region “0” which is the region allowing for video files.
Finally click “Save” to create the playlist. The new playlist now appears in the Playlist Bank.
*) The reason for having special playlists for “Movies and Images” is because we can split the screen in two, three or four separate regions. However, only one region can support hardware video decoding (since there is only one video decoding chip in the media player). The remaining three regions may be used to present images or web pages. This means that there is a need to keep track of which playlists are used for the different regions. That’s why we define separate playlists as they are created.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 36
Figure 34. How to create a new playlist.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 37
Adding media files to the playlist
However the playlist is empty and we need to add some media files. Click the “Add” button to get into the selection menu where you can see the files that are available in the Media Bank.
Select the files by ticking the boxes to the left of the file thumbnails. The list is divided into one Image, one video and one Html section. Right now we only have image files in the media Bank. When the files are selected click “Save”
Figure 35. To add media files to the playlist.
Editing the playlists
If you click a playlist in the Playlist Bank you will get into the playlist editing menu for that particular playlist. By licking the arrows to the left of the spots you may move them to any location in the playlist. You may also decide the duration for spot (the duration of a video clip is decided by its length).
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 38
Figure 36. The playlist may be edited by clicking the up/down arrows and selecting time for the duration of each image during the playlist presentation on the screen.
To create a channel (Group Playlist)
To create a channel (Group Playlist), click the “Units and Group Playlists” icon. In the “Group Playlists” section of the menu press the “Add” button (Figure 25).
Figure 37. To add a channel (Group Playlist) to the account.
In the “Add Group Playlist” menu (Figure 37), name the channel by filling out the “Descriptions” box with “Channel 1”. In principle you are free to choose any name you like.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 39
Just as for the playlists you need to decide if the channel is to house video clips as well as the other types of media (as images and web pages). This will decide in what regions you can use the channel. Press the “Add” button to have the channel (Group Playlist) created. An empty channel will appear in the Group Playlists menu.
Figure 38. To add a new channel to the Group Playlists menu.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 40
To add playlists to your channel
The channel is still empty and now we wish to add playlists to the channel. In the “Group Playlists section of the “Units and Group Playlists” menu, click on “Channel 1”. You will now get into the Channel 1 editing menu. Click “Add” and scroll to the bottom of the Media Bank content (SubPlaylist Video + Image) and tick “Banking”. Then click “Save”. Now Channel 1 has got its first playlist.
Figure 39. Add the previously made playlist to your channel.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 41
To associate the channel with the media player
Next step is to associate the media player with the channel. In the Units menu, click on “Media player 1” to get into its editing menu. Then click the “Primary” tab. “Primary” means the full screen region that is the only region that is available in this video mode. Click “Add” in the “Media from groups” part of the menu. Finally tich “Channel 100” to have it added to the full screen region. Soon the channel (including playlist 101) will be playing on the screen.
Figure 40. To associate a channel with a media player.
Since the group playlist named Channel 1 is now associated with Media Player 1 we do not have to bother more about the media player. Further content updates can be done by just editing the channel. And we may have the channel added to any number of media players.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 42
Figure 41. We can now see that Channel 1 is associated with the “Primary” region of Media Player 1 and that Channel 1 consists of the three pictures with Banking theme.
To add more playlists and content to the channel
Now we have one playlist playing in our channel. But we would like to have more playlists added. Therefore we will proceed by uploading more content to the Media Bank.
Figure 42. Currently there is only one playlist “Banking” in the Playlist Bank.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 43
To create a second playlist
In figure 43 a second playlist “Gaming” is added. Then there are three images added to the playlist. In figure 44 the playlist is edited.
Figure 43. A second playlist is added to the Playlist Bank.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 44
Figure 44. The second playlist “Gaming” is edited.
The next step is to add “Gaming” to Channel 1. In the “Units and Group” playlists menu click on Channel 1 to get into its editing menu.
Figure 45. Click Channel 1 to get into the Channel 1 group playlist editing menu.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 45
Figure 46. Click “Add” to add one more playlist.
Figure 47. Scroll to the lower part of the list and select Playlist “Gaming”.
Now, Channel 1 has two playlists, “Banking” and “Gaming”. If no scheduling is done it is always the playlist on top that will be played. Try to move the “Gaming” playlist to the top position.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 46
Figure 48. Try moving the “Gaming” playlist to the top position. Soon “Gaming” will be played instead of ”Banking”.
To play playlists in sequence
Sometimes it is desirable to play several playlists in sequence. This way it becomes possible to mix global playlists with local content and I also facilitate reuse of existing playlists.
Figure 49. It is possible to play playlists in sequence by disabling playlist looping.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 47
By disabling “Is Looping” in a number of playlists it is possible to play several playlists in sequence. When all playlists in the channel has been played the media player automatically starts all over from the top of the list.
Figure 50. Playlist looping is disabled by setting the “Is Looping” parameter to “No” for all playlists. In this example you need to do the same to both “Banking” and “Gaming”.
Scheduling
Before proceeding with the scheduling exercises, please reset the “Is Looping” parameter to “Yes” for both “Banking and “Gaming”. Also move “Banking” to the top position in Channel 1.
By using scheduling it is possible to use different playlists at different times. To enter the scheduling menu, click at “Playing (Change)” for the playlist in the Channel 1 editing menu.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 48
Figure 51. Click “Playing (Change)” to enter the scheduling menu for the playlist.
The scheduling tool allows you to add start and stop dates of campaigns as well as to enter daily or weekly active periods for the playlist. If the playlist on top is not active the player will check for active hours in the playlists below.
Figure 52. In the scheduling menu you can set start and stop of campaigns and select weekly or daily schedules.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 49
Figure 53. Enter active hours (0900-1200) for “Banking” playlist and press “Update Display”, then select “Save”.
Figure 54. Select active hours (1200-2100) for playlist 101 Banking.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 50
The playlists will be played during the selected hours. More playlists may be added to the systems and scheduled in a similar way. Now, it will not matter what playlist is on top. Scheduling always override the position in the list.
Figure 55. Scheduling always overrides the position in the list.
More complex scheduling conditions may be added by clicking the + button at the lower end of the tick boxes. This way you may have different schedules for different days of the week. Conditions may be removed by clicking the x buttons.
A second active interval for the “Gaming” playlist can be inserted as is shown in figure 56.
Figure 56. More conditions can be added to get more display intervals during the same day.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 51
Figure 57. More scheduling conditions may be added by clicking the + button. Clicking the x button to the left of a condition makes that condition to be removed.
Figure 58. By pressing the “Group Schedule” button in the Group Playlist menu it is possible to get an overview of the scheduled playlists.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 52
Adding more playlists
Before proceeding, reset both the “Banking” and the “Gaming” playlists so that they run all day from 0000-2359 with “Banking” on top.
Adding a playlist with a movie file
We have already uploaded the Movie.MPG file when we did the multiple file upload of the content files for the exercises. Now we will create an additional playlist to use with the movie file.
Figure 59. Go to the Playlist Bank and click the “Add Playlist” button to add another playlist.
Just as for the other two playlists, the Movie playlist should be a “Movies and Images” playlist to fit into Channel 1.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 53
Figure 60. Name the playlist “Movie”.
You will now find the “Movie” playlist in the Playlist Bank.
Figure 61. There are now three playlists in the Playlist Bank.
Now click the “Movie” playlist to get into the “Movie” playlist menu. Press “Add” to get into the selection part of the Media Bank.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 54
Figure 62. In the “Movie” playlist menu press “Add” to add the movie file.
In the Media Bank the files are sorted into groups. You will find the video files on top.
Figure 63. Select “Movie.MPG” from the list and clock “Save” to add the file to the playlist.
After you have clicked on “Save” the “Movie” playlist will contain just one file that will be played over and over in a loop.
If you at a later stage should find that you need to change the parameters of the video clip you can go to the Media Bank and click on the file to get into the parameter dialog.
Selecting “Anamorphic” means that the video will be stretched to fill the entire width of the screen. By selecting “Allow Ticker” to “Yes” you will have the ticker activated (Ticker described later) while the video clip is played.
The “Volume” setting is intended to compensate for variations between different video clips. In most cases it may be suitable to start off with 100%.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 55
Figure 64. It is also possible to compensate for varying audio levels by selecting “Volume” percentage.
Media players 4 and 5 as well as Media monitors 4 through 7 support HD video file formats 720p as well as 1080i and 1080p. MPEG-1, MPEG-2 and MPEG-4 (including h.264) are supported.
Note) With Media Players 1 through 3 video exceeding 720 x 576 pixels should not be used. With these media players preferably use MPEG-2 encoded files. MPEG-4 is supported but requires an AVI container to be used.
Using a web link (URL) as a media spot in playlists
As a next step we will add a playlist that will be used to house a web spot. Go to the Playlist Bank and click “Add Playlist” and name the new playlist “Web”. As before, it should be a “Movie and Images” kind of playlist.
Figure 65. Add one more playlist named “Web” (“Movies and Images” type)
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 56
Figure 66 We now have an empty “Web” playlist.
In the “Web” playlist we would like to have a web spot. A web spot is essentially a URL (an Internet link) that can be treated just the same as image- and video clip files in playlists and group playlists.
Figure 67. Click on “Add external” to get into the “Add external media to the media bank menu” menu.
The “Add external media to the media bank menu” is divided into several sections. The top section is used to add links to web sites that may be available on the Internet or stored inside the media players.
Insert a name of the link and fill out the address line in the box below. Remember that the entire link (including http://) is needed. Insert “http://google.com”.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 57
Figure 68. The link is added to the top section of the menu. Then press “Save” at the bottom of the menu.
Click on the Media Bank icon to see the web spot in the Html section of the Media Bank.
Figure 69. The “Google” link is now visible as a web spot in the “Html” section” of the Media Bank.
The web spot is now visible in the “Html section” of the Media Bank.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 58
Figure 70. Click “Add” to add the web spot to the playlist.
Figure 71.Tick the Google check box to add the web spot to the “Web” playlist.
Add a playlist with an SWF Flash file
The MultiQ media players can treat Flash animation files just as any other file format. This means that the files can be put right into a playlist (without being a part of a web page). This means that there is full support for “untagged” SWF files in the system. The duration of each file is set just as for an image file and the animation is repeated for the entire duration of the specified interval.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 59
Figure 72 In the Playlist Bank, click “Add Playlist” to add another playlist named “Logo”.
Figure 73. Click on “Logo” to get into the “Logo” playlist menu.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 60
Figure 74. Click on “Add” to get into the selection menu.
Figure 75. Select the Logo.swf file and click “Save” to have it added to the “logo” playlist.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 61
Figure 76. The SWF file will be played for the duration of the interval that is specified in the playlist menu.
A live stream treated as a media spot
Just as a web link can be used as a conventional media spot, also a stream can be treated the same way.
Figure 77. Add a playlist named “Livet TV” that can be used to house a live broadcast stream or a live feed from a surveillance camera.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 62
Figure 78. We now need a streaming spot to add to the empty playlist.
To add a Live TV streaming spot you click “Add External” in the Media Bank.
Figure 79. Click on “Add External” to get into the external media menu once more.
In the external links menu, tick the “Stream” box and add “Live TV” to the description line. Then paste the URL that addresses the streamer or the surveillance camera. For Live TV purposes a separate streamer is often used to obtain the IP stream. The syntax of the stream varies depending on what device is used and what signal is wanted from the device. In this example the address:
rtsp://192.168.118.108:554/axis-media/media.amp?videocodec=h264&streamprofile=high is used.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 63
Another example of a surveillance camera addressing URL might be:
rtsp://192.168.118.107/mpeg4/media.amp?videocodec=mpeg4&resolution=640x480&compression =30&color=1&clock=0&date=0&fps=0&audio=0&keyframe_interval=32&maxframesize=0
Before leaving the menu click “Save”
Figure 80. Add the URL of the streaming device to the “Stream” portion of the external media menu, then click “Save” at the bottom of the menu.
Finally add the streaming spot to the “Live TV” playlist by clicking “Add” in the “Live TV” playlist menu.
Figure 81. Click “Add” in the “Live TV” playlist menu to add the new media spot to the list.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 64
Figure 82. In the selection menu, tick the “Live TV” spot in the “Stream” section.
Figure 83. Now, we have six playlists each containing various kinds of media files or media links.
Finally we have six playlists that contain various kinds of media files or media links. However it is also possible to combine different kinds of spots in the same playlist.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 65
Figure 84. Click on “Channel 1” in the “Group Playlists” section of the menu to get into the “Channel 1“ menu.
Figure 85. Click “Add” to get into the media selection menu.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 66
Figure 86. Now, tick the remaining 4 playlists and click “Save”
Figure 87. Channel 1 now contains the 6 playlists.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 67
Exercise 2 – To build a web kiosk
A web kiosk can easily be made using a media monitor that fetch content from a web server on the Internet. The content we have prepared so far can easily be adapted to a web kiosk. In this case we will use a media monitor as a web kiosk with a touch panel and a virtual keyboard.
Figure 88. A web kiosk fetch information from websites that are available on the Internet
Figure 89. Move the “Web” playlist to the top position using the tiny arrows to the left.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 68
Figure 90. Soon the Google site appears on the screen.
The original size of the Google site is quite small when using a touch panel. A way to improve this is to use the built-in “zoom” feature. In the Media Bank click the “Google” web spot to get into the “Google” spot menu.
Figure 91. Click the “Google” web link to get into its menu.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 69
Figure 92. Set the zoom factor to 130 % to increase the size of the website as it appears on the screen.
Figure 93. The zoom feature improves touch panel manoeuvrability.
Adding a virtual keyboard
The next thing needed is to add a virtual keyboard that allows for transactions to be carried out by the user.
In the “Browser Library (Extensions)” there are two virtual keyboards available, the StdGrey and the StdBlack keyboards as is shown in
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 70
Figure 94. The Browser Library contains two virtual keyboards, a grey one and a black one.
To use a virtual keyboard the desired keyboard needs to be assigned to the media player or media monitor.
To assign the keyboard to the player you need to go to the “Settings” menu of the media player. This is done by first going to the “Units and Group Playlist” menu and then selecting the media player by clicking on its name.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 71
Figure 95. Go to the “Units and Group Playlist” menu and click on the media player.
Figure 96. Select the “Settings” tab in the Media Player menu and scroll to “Browser Settings” and click “Add”.
The “Language” setting will
decide what language keyboard to be used
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 72
Figure 97. Select the StdGrey.xpi file and click “Save”
Figure 98. After a restart the keyboard will appear on the screen.
Figure 99. You can also try to select the black keyboard.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 73
Figure 100. Then the black keyboard will appear.
Figure 101. The system comes with keyboards in UK English, French, German, and the Scandinavian languages. Additional languages and colour schemes adapted to branding can be made by developers, please download further information and tools from www.multiq.com.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 74
Exercise 3 – Local interactivity
Web kiosks provide global interactivity and transactional possibilities. However sometimes it is interesting to achieve local interactivity. Local interactivity is when the user can choose between content that is already available in the media player. This does not only save broadband capacity, it also provides extremely quick response when watching video clips and other larger files.
Figure 102. Local interactivity lets the user to choose between content that is already available in the media player (Local Play).
Local interactivity is very much about building dashboards that are used by the user to select between playlists and to move around within the playlists. The only difference between conventional signage that is scheduled is that rather than being controlled by the clock, what playlist to be played is controlled by someone touching a touch panel monitor (Figure 102).
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 75
Figure 103. The only difference between conventional, scheduled digital signage and interactive (local play) signage is the way the playlists are initiated.
An advantage in this way of thinking is that playlists used in conventional digital signage can also be used for interactive signs. As is shown in figure 102 playlists containing 16:9 widescreen format media files can be reused in an interactive sign with a dashboard added for user input. In this exercise we will build our first interactive sign.
The idea is to use a split screen video mode where the upper part is used to present movies, images and even web pages. The lower region is used for the dashboard which could be an image with a Java script attached or a web page.
The first step is to create a video mode with a 16:9 widescreen movie/image/web region on top (1280 x 720 pixels) and an image/web region at the bottom (1280 x 208 pixels). It is essential to understand that the media player can handle up to one movie/image/web region and three image/web regions simultaneously. We will also add a ticker which is 96 pixels high.
First we will go to the video mode editor. The Video mode editor is found by clicking the “Open Mode Editor” button in the “Settings” menu for the system which can be found by clicking the “Settings” icon at the bottom of the list of icons at the left (Figure 104). In the video mode editor, start by selecting orientation (landscape) and resolution (SXGA 1280 x 1024 pixels).
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 76
Build a multi region application
To be able to insert a dashboard and a ticker we would like to add two more regions on the screen besides the “Primary” region. You can design your own screen layouts by using the Mode Editor. To evoke the mode editor you first press the “Settings” icon at the bottom left. In the “Settings” menu click “Open Mode Editor”.
Figure 104. Click the “Settings” icon at the bottom left.
Figure 105. Click the “Open Mode Editor” button to start the Mode Editor.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 77
When in the “Mode Editor” the first thing is to select the resolution of the monitor to be used. In this case SXGA 1280x1024 pixels.
Figure 106. The first thing to do in the Mode Editor is to select the resolution of the monitor (In this case SXGA 1280x1024 pixels).
The toolbar at the top contains a number of buttons. Press the “Primary” button to add a primary region to your video mode. Drag the region across the screen to the desired location and dimensions. You may also enter numerical values at the lower left of the interface. In this case the “Primary” region should cover the upper part of the screen and have the dimensions 1280 x 1024 pixels. This corresponds to the 720p format (Figure 107).
Next, add a “Ticker” region by clicking the “Ticker” button and dragging the corner of the region to the desired size and position. For this exercise we choose the maximum height of the ticker which is 96 pixels (Figure 108).
At the bottom of the screen we need an image region to house the dashboard. Click the “Image” button and drag region to the desired location and size which is 1280 x 208 pixels in this exercise (Figure
109). Finally change the name from “New mode” to “Ticker” and press “Enter” before you click the “Save” button on top (Figure 110).
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 78
Figure 107. Add the “Primary region” by clicking the “primary” button and dragging the lower left corner of the region.
Figure 108. Add a “Ticker” region by clicking the “Ticker” button and then dragging it to the desired position. Select the maximum height (96 pixels).
Drag to the lower left
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 79
Figure 109. Add an “Image” region at the bottom of the screen by dragging it across to the desired size and location.
Figure 110. The final design of the video mode. Before saving, change the name to “Ticker” press “Enter” and then press the “Save” icon on top.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 80
Figure 111. To get the new mode visible in the “Settings” menu you need to update the page by pressing the “Settings” icon once more.
The next step is to assign our custom video mode to the media player. Click the “Units and Group Playlists” icon and then click the media player to get into its menu (Figure 112).
Next choose the “Settings” tab of the playlist menu and choose the new video mode “Ticker” from the video mode pull-down menu. Do not forget to click the “Save” button at the further down the media player “Settings” menu.
Click the “Settings” icon to
update the page
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 81
Figure 112. Click the desired menu player to get into its menu
Figure 113. Choose the “Settings” tab and then choose the new custom video mode “Ticker” from the pull down menu then click “Save” at the bottom of the “Settings” menu.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 82
Figure 114. The final video mode is saved by clicking the “Save” icon on top right.
Figure 115. The final video mode as it appears on the monitor screen. The Two idle areas are there because we have not yet assigned any content to the ticker nor the image area.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 83
Figure 116. In the media player menu you can now see the tabs that have been added with the new video mode. There are three separate tabs for the “Primary”, the “Image 1” and the “Ticker” areas.
To build the Dashboard
The next step is to build the interactive dashboard that is to be placed at the bottom of the screen. But in order to do this we must learn how to use the MultiQ open API. This is however not as complicated as it sounds.
The first step to master this is to log in to the media player web server. However there are a few things that must be fulfilled in order to do this.
The first thing is to see to that you are on the same subnet as the media player or the media monitor. A good way to solve this is to use a separate router that is connected to the Internet on its WAN port and you simply connect your PC (or MAC) as well as your media player to the same router. The router should be set to automatically assign an IP address to your PC as well as media player. Of course your PC should also be set to obtain an IP address automatically. The default setting of MultiQ media players and media monitors is to obtain the IP address automatically.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 84
The next thing needed to be done is to find out the IP address of your media player. To do this you go to the “Status” tab in the media player menu and check the IP address (Figure 116). Make a note of the IP address.
The media players (and monitors) always report back their local IP addresses to the management server. Note that the MAC address is the same as the unit serial number so you can actually keep track of your devices using the management system.
Figure 117. In the “Status” tab of your media player (or monitor) you can find the current IP address of your unit.
The third thing to see to is that your media player is open for incoming requests. As a security measure, by default the media players and media monitors are always locked for inbound requests.
In order to address your media player you first have to go to the “Settings” tab of the media player and uncheck the “Disable remote access to web server” box. Don’t forget to click the “Save” button further down the page before proceeding. The unit will restart automatically after this change has been done.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 85
Figure 118. It is necessary to uncheck the “Disable remote access to web server” box before addressing the media player web server from outside.
After the media player has restarted we are ready to go. In the address field of Mozilla Firefox (recommended), enter the IP address of your media player followed by “/multiq/”. You will now get to the index page of the “multiq” folder of the web server.
Figure 119. Once you have logged into the web server you should click the “example.html” hyperlink.
Uncheck this box
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 86
You will now find a valuable tool that makes it possible for you to create and try the commands needed to build any kind of interactive application you like. In these interactive applications you can control the playlists that are available in the media player.
In this exercise we will use the “Test links” in the upper part of the tool (Figure 119). These links address the playlists and the areas on the screen by name. In the lower portion of the tool there are “Deprecated links” that use database indexes for addressing. This is however a less universal and more complicated way of building the applications.
To user the tool we need to fill out the textboxes. Add “Primary” to the “Area Name” textbox. Then try to click the “next(area name)” hyperlink at the top of the tool. You will now see that you are able to step through the current playlist on the screen (that should be the “Banking” playlist). You can also try to step backwards by using the “previous(area name)” hyperlink.
Figure 120. The “example” tool is used to generate and test the API commands that are used in the applications.
By pressing “previous(area
name)” the medi
a player will
move backwards in the playlist.
The URL API commands are automatically generated the upper line contains the code
needed for addressing the media
player from outside while the lower line contains the “local
host” 127.0.0.1 command that is needed for the unit to address itself (internal interactivity).
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 87
As you click a hyperlink the API command that is sent to the media player is generated in the “Output URL” section of the tool.
Next step is to try to change playlist using the API commands. Now insert “Gaming” in the “Playlist Name” textbox. Then press the “goto playlist name(area name, playlist name” hyperlink (marked in red). As you do this the media player will change to the “Gaming” playlist and the corresponding API commands are presented accordingly.
Note that the API commands can be entered in the address field of a web browser to send a command to the media player. I.e. that the API commands are common web URL’s. So, we use the same kind of addressing techniques when we address the media player internally as other media players in the same network or even address other servers on the Internet.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 88
Figure 121. By pressing the “goto playlist name(area name, playlist name) hyperlink” (marked in red), you can make the media player to move to another playlist.
In the following pages we will produce an html dashboard using the API commands that we can produce with the tool just described.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 89
Making the html dashboard
Now we will create two websites with dashboards to control the media monitor. One of them will be able to address the media player from outside, just as we did when we previewed the site in window. The other site will have its IP addresses adjusted to make it work when placed in the media monitor itself. To keep track of our files it is suitable to create a folder named “Image Dashboard”. In this folder you should create two subfolders, one named “Dashboard” and the other “Dashboard_ext”.
Figure 122. Create a folder named “Image Dashboard” on your hard drive.
Web designers have their own favourite tools. In this exercise we have selected a very simple tool that is available for download on the Internet and that is well suited for demonstrating digital signage- and web kiosk applications. The Serif Web Plus SE application can be downloaded from:
http://www.freeserifsoftware.com/commence­download.asp?CommenceDownload=webplus&navproduct=webplus&Check=True
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 90
Figure 123. The start up screen in Serif Web Plus SE, choose “Start from scratch”.
The first thing to do in a web application to be used in a digital signage application is to choose the correct size of the page. The size is determined by the dimensions of the region of the screen where you intend to put the web page.
In our “Ticker” video mode we have an image area at the bottom of the page that is 1280 x 208 pixels. Therefore we want to produce a web page that has these dimensions.
First select “Edit”=>”Page Properties” (Figure 123). In the “Page Properties” menu deselect master and select (none) (Figure 124). Once in the “Properties” menu you select “Width”=1280 pixels and “Height”= 208 pixels (Figure 125).
The result is the strange looking web page in figure 126. However it is well suited for its cause. Building applications like this is very much about using conventional web technology but for new purposes.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 91
Figure 124. Select “Edit” => “Page Properties” to get to the “Properties” menu.
Figure 125. Deselect “Master” and select (none) to be able to freely select the page dimensions
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 92
Figure 126. In the “Properties” menu select “Width”=1280 pixels and “Height”=208 pixels.
Figure 127. The result is a quite strange looking web page. But it is well suited for its cause.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 93
Now save the project as “Dashboard_ext.wpp” in the “Dashboard_ext” subfolder.
URL’s are originally designed to retrieve a web page from the Internet. When the command is sent a response will be sent back. However in our dashboard application we are not interested in the response but we just want to send a command. But since we use conventional commands there will be a more or less unwanted response coming back anyhow. In our application we need somewhere to put the response. And what we do not want is the dashboard to be replaced by an incoming webpage as is the case in conventional Internet applications. The answer to all this is using a document frame to where we can target the web pages that we get as responses to our commands.
Click the document frame icon in the toolbox and place the document frame somewhere in the web page. You do not have to set any parameters for the document frame. Its sole existence in the web page is enough.
Figure 128. By inserting a document frame in our web page we get somewhere to target the web pages that are sent back to the dashboard.
As new web pages are sent to the dashboard the content of the document frame is replaced and we will never get into any trouble involving memory leaks due to web pages stacking up in the memory of the media player.
On top of the document frame we put an image with the buttons that we intend to use in the dashboard. Import the Dashboard.png file using the “Import Picture” tool and drag the image to fill the web page (Figure 128). As you can see the document frame is now hidden behind the dashboard image (Figure
129).
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 94
Figure 129. Import the Dashboard.png file using the “Import Picture” tool.
Figure 130. Drag the “Dashboard.png” image to get it to cover the entire web page.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 95
The dashboard is now completed from a visual point of view. Next is to add html code to get the interactivity working.
Figure 131. The visual appearance of the dashboard.
We will use the URL commands that we can get from the “example” tool that we used before to get interactivity. However to get it working we need to add some “Hot spots” to the image to house our hyperlinks.
First copy a hyperlink from the “example” tool. Figure 131 shows how to copy the URL command that addresses the “Banking” playlist.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 96
Figure 132. How to copy the external URL command from the “example” tool in the media player web server.
Figure 133 shows how the “Insert hotspot” tool is used to generate the hyperlinks. Click the tool and drag the tool across the buttons in the image.
Once you have generated a hotspot you select “Internet page” and then you paste the hyperlink into the “URL address” box.
Next thing is to select the document frame that you previously created to act s target for the response web page that you will get when using the hyperlink. If you fail this step you will get the dashboard replaced by a white web page and the application will get stuck (Figure 133).
Copy the URL command to be used to address a playlist (here “Gaming”)
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 97
Figure 133. Paste the URL command into the URL address box of the hotspot and select the document frame you previously created as target for the response you will get when using the hyperlink.
Now we need to add hotspots to the other buttons as well. A simple way of doing this is to copy the first hootspot “Banking” and then just adapt the hyperlink to each button accordingly.
Figure 134. Copy the hotspot of the “Banking” button.
Paste the hyperlink that you copied from the “example” tool in the media player web server.
Select the document frame as target.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 98
Figure 135. Paste the copied hotspot and place it on top of the “Gaming” button.
Figure 136. Edit the hyperlink URL address by replacing “Banking” with “Gaming”.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 99
Continue pasting the hotspot and place it on top of the other buttons as well. Do this for the “Movie”, “Logo” and “Web” buttons.
Figure 137. Paste the hotspot and put on top of the other buttons as well. Edit the hyperlinks by replacing “Banking” by “Movie”, “Logo” and “Web”.
When getting to the “Live TV” button we need to go back to the “example” tool in the media player web server. The thing is that we have a space in the “Live TV” playlist name. In the tool you can see that the syntax for the “Live TV” playlist name becomes “”Live%20TV” which we need to take into account when modifying the hyperlink name for the “Live TV” button.
MultiQ Digital Signage – DSMS 3 User’s Manual Ver. 2, 2010-06-08 100
Figure 138. In the “example” tool we can see that the syntax for the name of the playlist “Live TV” becomes “Live%20TV”.
Finally we need to add hotspots for the copy the “<” and “>” buttons and to copy and insert the “Goto Previous” (see Figure 120) and “Goto Next” commands from the “example” tool to the.
Figure 139 summarizes the API hyperlinks that are required to complete the dashboard web page.
Loading...