Виджеты – это компоненты системы Digital Signage, предназначенные для отображения контента, обновляемого автоматически. Компания SpinetiX создала более 250 бесплатных виджетов для создания графических макетов в Elementi и их показа на различных видеоэкранах с помощью медиа-контроллеров SpinetiX сери HMP.

Виджеты могут быть легко интегрированы в ваши проекты Elementi и предназначены для совместной работы с медиа-контроллерами SpinetiX HMP. Они легко настраиваются с помощью различных параметров и свойств, которые пользователь может изменить в интерфейсе Elementi, не обладая навыками программирования.

Интерактивные виджеты были разработаны для облегчения создания интерактивных проектов Digital Signage. Например, они помогают вам получить обратную связь от вашей аудитории или предоставить полезную информацию, такую как интерактивная навигация. Эти виджеты отображают страницу контента по умолчанию, которая заменяется другой страницей при нажатии кнопки на сенсорном экране, нажатии физической кнопки или срабатывания какого либо датчика.
В новой версии Elementi предусмотрены функции обратной связи и интерактивные виджеты Blue Pack.

Выбор интерактивных виджетов

Существует много интерактивных виджетов на выбор: обратная связь, горизонтальное и вертикальное меню, клик для переключения, виртуальная клавиатура для действия и т. д.

Встроенные виджеты

Feedback (Обратная связь)

Отображает три смайлика, чтобы получить обратную связь от посетителей. При нажатии на смайлик в базу данных добавляется ответ и при необходимости отображаются результаты обратной связи.

Menu Horizontal (Горизонтальное меню)

Отображает горизонтальное меню вверху или внизу экрана по умолчанию. При нажатии на пункт меню отображается выбранная страница контента вместо контента воспроизводимого по умолчанию.

Menu Vertical (Вертикальное меню)

Отображает вертикальное меню в левой или правой части экрана по умолчанию. При нажатии на пункт меню отображается выбранная страница контента вместо контента воспроизводимого по умолчанию.

Click to switch (Нажмите, чтобы переключиться)

Отображает кнопки и контент воспроизводимый по умолчанию. При нажатии на кнопку отображается соответствующая страница вместо страницы, воспроизводимой по умолчанию.

Click Through (Пролистать)

Отображает только кнопки в качестве контента по умолчанию. При нажатии кнопки вместо нее отображается соответствующая страница контента.

Click to Action (Нажмите, чтобы начать)

Отображает только кнопки в качестве контента по умолчанию. При нажатии на кнопку для связанного триггера действия устанавливается соответсвующее значение. Лучше всего он работает с виджетом “Action to switch” (Действие для переключения) и может использоваться для создания интерактивного контента на нескольких устройствах.

Virtual Keyboard (Виртуальная клавиатура)

Отображает на экране интерактивную виртуальную клавиатуру, которая генерирует события нажатия клавиш. Лучше всего работает с виджетом “Key to Switch” на сенсорных экранах, где к плееру не подключена клавиатура.

Key to Switch (Ключ для переключения)

Отображает контент по умолчанию и считывает события нажатия клавиш. При нажатии предопределенной клавиши вместо содержимого по умолчанию отображается назначенная страница контента.

Key to Action (Ключ к действию)

Слушает ключевые события нажатия. Когда нажата предопределенная клавиша, для связанного триггера действия устанавливается соответсвующее значение. Лучше всего он работает с виджетом “Action to Switch” (Действие для переключения) и может использоваться для создания интерактивного контента на нескольких устройствах.

Action to switch (Действие по переключению)

Отображаетконтент по умолчанию и интерактивно загружает «страницы» предопределенного содержимого при каждом обновлении связанного триггера действия.

Media Playback (Воспроизведение медиа)

Отображает медиа (изображение или видео), которое можно поставить на паузу или воспроизвести, установив для связанного триггера действия значение «ПАУЗА» или «ВОСПРОИЗВЕДЕНИЕ».


Feedback (Обратная связь)

Этот интерактивный виджет отображает три смайлика, чтобы получить обратную связь от посетителей. При нажатии на смайлик в базу данных добавляется ответ и при необходимости отображаются результаты обратной связи.

Конфигурация

Locale. Выберите язык, используемый для отображения процентов голосов.

Заголовок. Введите текст, отображаемый при ожидании голосования. 

Обратная связь:

  • Текст. Введите текст, отображаемый после голосования.
  • Продолжительность. Введите продолжительность отображения текста отзыва и результатов (если включено).
  • Показать результаты. Включить / выключить отображение результатов обратной связи. 
  • Фильтр. Выберите фильтр, применяемый к набору голосов: «Нет», «Текущий месяц», «Сегодня» (по умолчанию) и «Последний час». 

Хранение:

  • Ключ Введите имя ключа (по умолчанию «демо»), под которым будут храниться голоса обратной связи. Используйте разные имена ключей, чтобы разделить результаты разных опросов. 
  • Предел. Введите максимальное количество голосов, которые необходимо учитывать. Совет: Установите значение 1, чтобы удалить существующие голоса.

Этот интерактивный виджет отображает отображает горизонтальное меню вверху или внизу экрана по умолчанию. При нажатии на пункт меню отображается выбранная страница контента вместо контента воспроизводимого по умолчанию.

Конфигурация

Transition (Переход). Нажмите кнопку «Свойства перехода» (откроется диалоговое окно «Свойства перехода») и выберите эффект перехода и его свойства. 

Menu (Меню):

  • Position (Позиция). Выберите позицию меню между «Сверху» и «Снизу» (по умолчанию).
  • Size (Размер). Выберите размер меню между «Большой» (по умолчанию) и «Маленький».
  • Number of columns (Число столбцов). Введите количество столбцов для отображения на экране. Если количество предопределенных страниц больше, то меню становится прокручиваемым.
  • Spacing (Интервал). Введите процент высоты меню, который будет добавлен в качестве поля пустого пространства вокруг пунктов меню. По умолчанию: «0%». Совет: введите положительное значение для создания вкладок!

Finger touch (Касание пальцем):

  • Show (Показать). Включение / отключение отображения значка касания движущегося пальца. 
  • Delay (Задержать). Введите задержку, после которой отображается значок касания пальцем.Счетчик сбрасывается после каждого события нажатия. 
  • Animate (Анимировать). Включение / отключение анимации значка касания пальцем.

Этот интерактивный виджет отображает вертикальное меню в левой или правой части экрана по умолчанию. При нажатии на пункт меню отображается выбранная страница контента вместо контента воспроизводимого по умолчанию.

Конфигурация

Locale (Место). Выберите язык, используемый для отображения номеров страниц.

Transition (Переход). Нажмите кнопку «Свойства перехода» (откроется диалоговое окно «Свойства перехода») и выберите эффект перехода и его свойства.

Menu (Меню):

  • Position (Позиция). Выберите позицию меню между «Слева вверху», «Слева по центру» (по умолчанию), «Слева внизу», «Справа вверху», «Справа по центру» и «Справа внизу».
  • Size (Размер). Выберите размер меню между «Большой» (по умолчанию) и «Маленький».
  • Numbers or row (Количество рядов). Введите количество строк, отображаемых на экране. Если количество предопределенных страниц больше, то меню становится прокручиваемым.
  • Spacing (Интервал). Введите процент высоты меню, который будет добавлен в качестве поля пустого пространства вокруг пунктов меню. По умолчанию: «8%».
  • Show page Number (Показывать номер страницы). Включение / отключение отображения номера страницы рядом с меткой меню.
  • Auto-hide labels (Автоматически скрывать метки). Включение / отключение автоматического скрытия меток меню.
  • Delay (Задержка). Введите задержку, по истечении которой метки меню будут скрыты.

Прикосновение пальца:

  • Show (Показать). Включение / отключение отображения значка касания движущегося пальца.
  • Delay (Задержка). Введите задержку, после которой отображается значок касания пальцем. Счетчик сбрасывается после каждого события нажатия мыши.
  • Animate (Анимировать). Включение / отключение анимации значка касания пальцем.

Click to Switch (Нажать, чтобы переключить)

Этот виджет показывает контент по умолчанию и некоторые кнопки навигации – всякий раз, когда нажимается кнопка, назначенное ей содержимое будет отображаться вместо контента по умолчанию. Чтобы вернуться к контенту по умолчанию, каждая внутренняя страница должна заканчиваться через определенный период времени – для этого может потребоваться установить фиксированную продолжительность. Кнопка «Выход» закрывает сам виджет. Этот виджет лучше всего работает с сенсорным экраном.

Конфигурация

Properties (Характеристики): 

  • Transition (Переход). Установите переход, используемый при переходе на другую «страницу» контента.
  • Switched layer (Переключаемый слой). Это заполнитель слоя, полезный для размещения области содержимого на экране. В более старых версиях Elementi это также использовалось для установки содержимого по умолчанию.

Mappings (Сопоставления):

  • Button (Кнопка). Вставьте слои кнопок, используемые для переключения содержимого. 
  • Page (Страница). Вставьте слои содержимого, которые будут отображаться при нажатии соответствующей кнопки.

Примечания:

  • Первая строка используется для определения содержимого по умолчанию, которое должно воспроизводиться при открытии виджета. Для простоты это по умолчанию текстовый слой, тем не менее, его можно изменить на любой другой тип слоя (например, текст, изображение, видео, макет, список воспроизведения и т. д.). Например, чтобы использовать изображение в качестве содержимого по умолчанию, просто перетащите это изображение с панели «Обзор» и поместите его в ячейку «Страница по умолчанию».
  • Следующие строки используются для связывания кнопок с конкретным содержимым, которое будет отображаться при их нажатии. Как кнопку, так и связанную с ней «страницу» можно изменить, как указано выше. Обратите внимание, что если для страницы установлена фиксированная продолжительность, в конце этого периода виджет вернется к содержимому по умолчанию.
  • Дополнительные кнопки можно добавить, добавив дополнительные слои с помощью значков на панели инструментов или перетаскивания.
  • Также присутствует кнопка выхода, имеющая свойство “[ЗАКРЫТЬ]” как URI. При нажатии соответствующей кнопки виджет завершается – это лучше всего работает, когда виджет включен в другие документы.

Click Through (Пролистать)

Этот интерактивный виджет можно использовать для отображения некоторых кнопок навигации в качестве контента по умолчанию и интерактивной загрузки «страниц» другого контента при каждом нажатии кнопки. Чтобы вернуться к контенту по умолчанию, каждая внутренняя страница должна заканчиваться через определенный период времени – для этого может потребоваться установить фиксированную продолжительность.Этот виджет лучше всего работает с сенсорным экраном.

Примечание: Этот виджет можно использовать только для создания одноуровневого «меню» – для большего количества уровней вы можете использовать виджеты Click to switch или Action to switch.

Конфигурация

Этот виджет представляет собой упрощенную версию виджета Click to switch, описанного выше.


Click to Action (Нажать, чтобы запустить)

Этот виджет управляет изменением общей переменной с помощью кнопок, нажимаемых пользователем. Каждый раз, когда нажимается кнопка, общая переменная устанавливается на желаемое значение. Этот виджет можно использовать вместе с Action to Switch, например, для создания интерактивного контента на нескольких устройствах.

Конфигурация

Shared Variable (Общая переменная). Введите имя общей переменной для обновления.


Virtual Keyboard (Виртуальная клавиатура)

Этот виджет отображает интерактивную виртуальную клавиатуру, которая генерирует события нажатия клавиш, поэтому его можно использовать с сенсорным экраном, когда к плееру не подключена клавиатура. Простой способ использовать этот виджет – объединить его с виджетом Key to Switch. 

Можно определить несколько раскладок клавиатуры (переключение между ними осуществляется нажатием специально назначенных виртуальных клавиш), а размер клавиш может быть разным.

Конфигурация

Numbers of row (Количество рядов). Введите количество отображаемых строк ключей. 

Mappings (Преобразования). Настройте различные раскладки клавиатуры (по умолчанию используется первая). Каждая запись из таблицы соответствует раскладке клавиатуры. Каждая раскладка клавиатуры состоит из одной или нескольких строк клавиш (обычно с тем же номером, который указан на вкладке «Свойства»). Используйте один пробел для разделения клавиш и «//» для разделения строк клавиш. Например, при вводе «7 8 9 // 4 5 6 // 1 2 3 // 0 [2] Enter» отобразится типичная цифровая клавиатура. Используйте «Пробел», «Ввод», «Shift» или Unicode (например, U + 0008 для возврата на место), чтобы указать специальные клавиши. Внешний вид и / или поведение каждого ключа можно изменить с помощью [size] или [size-> index] перед ключом. Например, [5] Space отображает очень большую кнопку пробела, а [2.5-> 1].? 123 отображает большую клавишу «перехода», которая переключает на вторую раскладку клавиатуры (первая строка имеет индекс 0).


Key to Switch (Ключ для переключения)

Этот виджет показывает содержимое по умолчанию и прослушивает события нажатия клавиш – при нажатии клавиши он проверяет, находится ли эта клавиша в списке предопределенных идентификаторов клавиш, и если да, отображает соответствующее содержимое. Виджет возвращается к содержимому по умолчанию, когда переключенный слой заканчивается – для этого может потребоваться установить фиксированную продолжительность слоя.

Этот виджет лучше всего работает с HID-клавиатурой. Этот виджет похож на виджет Click Through, за исключением того, что вместо кнопок используются ключевые события.

Конфигурация

На вкладке Properties (Свойства) вы можете установить переход, используемый при переходе на другую «страницу» содержимого. 

На вкладке Mappings (Преобразования) вы можете определить, какой контент отображать в зависимости от нажатой клавиши. 

Key identifier (Идентификатор ключа). Введите клавишу или комбинацию клавиш, на которую нужно реагировать. Примеры допустимых идентификаторов: A, Ctrl + A, Ctrl + Shift + S, 0, 1, 9, F5, U + 000B (Backspace), U + 0020 (Space), Enter, PageUp, PageDown и т. д. Обратите внимание, что нижний – регистр букв не является допустимым идентификатором. 

Page (Страница). Определите уровень содержимого, который будет отображаться при нажатии соответствующего идентификатора ключа.


Key to Action (Ключ к действию)

Этот виджет управляет изменением общей переменной с помощью клавиатуры. Каждый раз, когда нажимается кнопка, общая переменная устанавливается на желаемое значение. Этот виджет можно использовать вместе с Action to Switch, например, для создания интерактивного контента на нескольких устройствах.

Конфигурация

Variable Name (Имя переменной). Введите имя общей переменной для обновления. Когда пусто, используется значение из предыдущей строки. 

Key identifier (Идентификатор ключа). Введите клавишу или комбинацию клавиш, на которую нужно реагировать. Примеры допустимых идентификаторов: A, Ctrl + A, Ctrl + Shift + S, 0, 1, 9, F5, U + 000B (Backspace), U + 0020 (Space), Enter, PageUp, PageDown и т. д. Обратите внимание, что нижний – регистр букв не является допустимым идентификатором. 

Value (Значение). Введите значение, до которого обновляется общая переменная.


Action to switch (Действие по переключению)

Этот виджет показывает содержимое по умолчанию и прослушивает обновления управляющей общей переменной – при получении обновления он проверяет, находится ли это значение в списке предопределенных «действий», и, если да, отображает соответствующее содержимое. Виджет возвращается к содержимому по умолчанию, когда переключенный слой заканчивается (для этого может потребоваться установить фиксированную продолжительность) или когда полученное значение не является частью списка предопределенных «действий».

Примечание: Общую переменную можно обновить с помощью виджетов Click to Action или Key to Action (они должны быть настроены на использование того же имени Shared Variable!) Или с внешнего устройства через сетевое взаимодействие.

Конфигурация

На вкладке Properties (Свойства) вы можете настроить следующие параметры виджета:

  • Transition (Переход). Установите переход, используемый при переходе на другую «страницу» контента.
  • Shared variable (Общая переменная). Введите имя общей переменной, которая управляет виджетом.
  • Close Action (Закрыть действие). Введите значение, при котором виджет будет принудительно завершен.
  • Multiscreen synchronisation (Многоэкранная синхронизация). Установите значение «true» в случае синхронизированного содержимого.
  • Start with default page (Начать со страницы по умолчанию). Если этот флажок установлен, виджет игнорирует предыдущие обновления и при открытии загружает страницу содержимого по умолчанию.

На вкладке Mappings (Преобразования) вы можете определить, какой контент отображать в зависимости от значения общей переменной. 

  • Action (Действие). Введите строку, с которой будет сравниваться обновленное значение общей переменной. 
  • Page (Страница). Определите слой содержимого, который будет отображаться, когда значение общей переменной совпадает со значением из столбца Action (Действие).

Media Playback (Воспроизведение медиа)

Этот виджет используется для интерактивного воспроизведения, паузы и возобновления видео или анимации путем установки для общей переменной управления значения «PLAY», «PAUSE» или «TOGGLE». Эти команды могут сопровождаться числом (в секундах) или процентом, чтобы указать положение относительно начала носителя, где должна быть применена команда. Например, используйте:

  • «PLAY 8.5», чтобы начать воспроизведение с секунды 8.5; 
  • «PLAY 50%» / «PAUSE 50%» для воспроизведения / паузы в середине; 
  • «PAUSE 0», чтобы сделать паузу на первом кадре. 

Конфигурация

Shared variable (Общая переменная). Введите имя общей переменной, используемой для управления воспроизведением мультимедиа. По умолчанию это называется «воспроизведением». 

Media (медиа). Перетащите медиафайл, который нужно воспроизвести. 

Multiscreen synchronisation (Многоэкранная синхронизация). Выберите, следует ли синхронизировать обновления общих переменных по времени. Это должно быть установлено на «Нет», за исключением случая многоэкранного содержимого. 

Optional playback reports (Дополнительные отчеты о воспроизведении). Виджет также может отправлять отчеты о воспроизведении (прогресс, статус, текущее положение во времени и продолжительность мультимедиа) через равные промежутки времени с помощью еще четырех общих переменных.


Редактирование интерактивных виджетов

Для редактирования виджета просто перетащите выбранный виджет в макет, плей-лист или расписание. Выбранный виджет будет автоматически скопирован в текущий проект.

Интерактивные свойства

В зависимости от того, какой интерактивный виджет вы выберете, вы можете изменить его свойства перехода, положение на экране, размер, добавить индикатор касания пальцем и настроить виртуальную или физическую кнопку или комбинацию кнопок для управления контентом на экране.

Техническая поддержка

Используя эти бесплатные виджеты, не обладая специальными знаниями в области дизайна или программирования, Вы можете самостоятельно создать привлекательный контент для ваших экранов, используя программу Elementi.

Или Вы можете обратиться к нам специалистам, чтобы создать макет Elementi для демонстрации на ваших видеоэкранах с помощью медиа-контроллеров SpinetiX.