Roden Signage / アプリ設定ガイド
管理画面をひらく ↗
Operation Manual

サイネージ
アプリ設定ガイド

天気・ニュース・SNS・動画・Webページ・予約まで。画面に出せる12のアプリを、一つずつ「できること・設定手順・入力する項目・注意」の順に整理しました。

対象 管理画面での日常運用管理画面 signage.roden-factory.com

この資料は、店頭の画面に出せる12のアプリを、実際に設定するための手引きです。使いたいアプリ名をクリックすると、その設定へ移動します。各アプリには2種類あります。

2種類の違い:標準アプリは専用アプリがそのまま使えます。ウェブページ表示は専用アプリがないので、「ウェブページ」機能に埋め込みURLを入れて表示します。どちらも操作は管理画面だけで完結します。
Basics

アプリの入れ方(共通の流れ)

どのアプリも置き方は共通です。まずこの流れだけ覚えてください。各アプリの項では「そのアプリ特有の設定」だけを説明します。

  1. レイアウトを開くデザイン → レイアウト →「レイアウトを追加」。既存を直すときは行メニュー →「デザイン」。
  2. (分割する場合)領域を足す画面を区切って複数アプリを同時に出すときは領域を追加。全画面なら領域は1つ。
  3. アプリを配置する左のツールボックスから、使いたいアプリを領域へドラッグ。
  4. アプリを設定する右パネルで、そのアプリの項目(URL・地点・件数など)を入力。
  5. 表示時間を決めるそのアプリを何秒表示するか(動画は「0」で最後まで)。
  6. 公開する編集後は必ず「公開」。公開しないと画面は変わりません。
2つの大原則:① 編集は「公開」するまで反映されません。② 公開後も端末は数分ごとに受信するため、反映まで少し時間がかかります(正常です)。
Applications

12アプリの設定方法

天気 標準アプリ

地域の天気予報を自動表示。毎日更新され、店頭に季節感を出せます。

設定手順

  1. 「天気」を配置ツールボックスから「天気(Weather)」を領域へドラッグ。
  2. 地点を設定都市名、または緯度・経度で場所を指定(例:大阪/東京)。
  3. 単位・表示を選ぶ温度の単位(℃)、表示デザイン(テンプレート)を選ぶ。
  4. 更新間隔・表示時間更新のタイミングと、画面に映す秒数を設定 → 公開。
入力する項目
  • 地点(都市名 または 緯度経度)
  • 単位(摂氏℃ 推奨)
  • 表示テンプレート(デザイン)
  • 表示時間(秒)
注意:天気データの接続キーはサーバー側に初期設定済みのため、利用側は地点を選ぶだけです。表示されない場合はこの接続が未設定の可能性があるので、管理者へご連絡ください。

ニュース(RSS) 標準アプリ

ニュースサイトの見出しを、横や縦に流れる形(ティッカー)で表示します。

設定手順

  1. 「RSSティッカー」を配置ツールボックスから「RSS」または「ティッカー」を領域へドラッグ。
  2. RSSのURLを入力表示したいニュースサイトの「RSS」のアドレスを貼り付け。
  3. 件数・速度を決める表示する見出しの件数、1件あたりの表示時間や流れる速さ。
  4. 見た目を整える文字の大きさ・色などを設定 → 公開。
入力する項目
  • RSSのURL(ニュースサイトの「RSS」リンクから取得)
  • 表示件数
  • 1件あたりの表示時間/流れる速度
  • 文字サイズ・色
RSSのURLの探し方:多くのニュースサイトはページ下部や「RSS」ボタンからRSSのアドレス(https://…/rss 等)を公開しています。それをコピーして貼り付けます。

Instagram ウェブページ表示

Instagramの投稿を店頭に表示します。専用アプリがないため「ウェブページ」機能で埋め込み表示します。

設定手順

  1. 埋め込み用のURLを用意自社アカウントの埋め込み、または外部のSNS表示サービスで作った表示ページのURL。
  2. 「ウェブページ」を配置ツールボックスから「ウェブページ」を領域へドラッグ。
  3. URLを入力用意した埋め込み用URLを貼り付け。
  4. 表示方法を選ぶ表示方法は 「Open Natively(そのまま表示)」を選ぶ → 公開。
入力する項目
  • Instagram埋め込み用のURL
  • 表示方法:Open Natively
  • 表示時間(秒)
ヒント:埋め込み用URLの作り方が分からない場合は、管理者に依頼すれば用意してもらえます。

YouTube ウェブページ表示

YouTubeの動画を画面で流します。専用アプリはないため「ウェブページ」で埋め込みURLを表示します。自社にアップした動画ファイルは「画像・動画」を使います。

設定手順

  1. 埋め込みURLを取得対象動画の「共有 → 埋め込む」から埋め込み用URL(https://www.youtube.com/embed/動画ID)を取得。
  2. 「ウェブページ」を配置ツールボックスから「ウェブページ」を領域へドラッグ。
  3. URLを入力埋め込みURLを貼り付け。自動再生にするには末尾に ?autoplay=1&mute=1 を付ける。
  4. 表示方法を選ぶ「Open Natively」を選ぶ → 公開。
入力する項目
  • YouTube埋め込みURL(+自動再生パラメータ)
  • 表示方法:Open Natively
  • 表示時間(動画の長さに合わせる)
注意:ブラウザの仕様上、音声つきの自動再生は制限されます。自動再生はミュート(mute=1)が前提です。音を出したい場合は「画像・動画」で動画ファイルを流す方が確実です。

Facebook ウェブページ表示

Facebookページの投稿を店頭に表示します。Instagramと同じく「ウェブページ」で埋め込み表示します。

設定手順

  1. ページの埋め込みURLを用意Facebookページ プラグイン等で作成した埋め込み用URL。
  2. 「ウェブページ」を配置 → URLを入力用意したURLを貼り付け。
  3. 「Open Natively」で表示 → 公開表示方法はOpen Nativelyを選ぶ。
入力する項目
  • Facebook埋め込み用URL
  • 表示方法:Open Natively
  • 表示時間(秒)

カレンダー 標準アプリ

予定・イベント・営業案内などを一覧表示します。Googleカレンダー等と連動できます。

設定手順

  1. iCal(ics)のURLを用意Googleカレンダー → 設定 → 対象カレンダー →「カレンダーの統合」→「iCal形式の公開URL(.ics)」をコピー。
  2. 「カレンダー」を配置ツールボックスから「カレンダー」を領域へドラッグ。
  3. URLと表示期間を設定iCalのURLを入力。表示する期間(今日/今週など)と件数を指定。
  4. 見た目・表示時間を設定 → 公開表示形式・1件あたりの表示時間を設定。
入力する項目
  • iCal(ics)のURL
  • 表示期間(範囲)・表示件数
  • 表示形式・タイムゾーン
  • 表示時間(秒)
コツ:そのiCalのURLをブラウザで開いて予定が取得できれば、管理画面でも表示できます(ログイン不要で開けるURLを使用)。

SNSウォール ウェブページ表示

複数のSNS投稿をまとめて「壁」のように表示し、店頭をにぎやかに演出します。外部のソーシャルウォールサービスを「ウェブページ」で埋め込みます。

設定手順

  1. ソーシャルウォールを作る外部サービスで表示したいSNS・ハッシュタグを設定し、表示用(埋め込み用)URLを取得。
  2. 「ウェブページ」を配置 → URLを入力取得したURLを貼り付け。
  3. 「Open Natively」で表示 → 公開
入力する項目
  • ソーシャルウォールの表示用URL
  • 表示方法:Open Natively
  • 表示時間(秒)
補足:標準でそのまま使えるSNSは「Mastodon」です。Instagram/Facebook/X等をまとめたい場合は、上記の外部ウォールを使います。

画像・動画 標準アプリ

ポスター画像やPR動画を表示します。いちばん基本の使い方です。

設定手順

  1. 素材をアップロードライブラリ → メディア →「メディアを追加」で画像・動画をアップ。
  2. レイアウトに配置編集画面でその素材を領域へドラッグ(アップした素材はライブラリから選べます)。
  3. 表示時間・見せ方を設定画像は表示秒数、動画は「0」で全再生(尺より短い枠は「ループ」ON)。拡大方法(フィット/ストレッチ)も選べます。
  4. 公開
対応形式
  • 画像:jpg / png / webp など(アニメーションGIFは非対応 → 動画に)
  • 動画:MP4(H.264)推奨
  • 音声・PDF・PowerPointも利用可
差し替え:素材を新しくしたいときは、その素材を編集して「ファイルを差し替え」。使用中のレイアウトをまとめて更新できます。

Webページ 標準アプリ

予約ページ・自社サイト・キャンペーンページなどを、そのまま画面に表示します。更新すれば画面も自動反映。SNS・口コミ・交通情報の土台にもなる重要なアプリです。

設定手順

  1. 「ウェブページ」を配置ツールボックスから「ウェブページ」を領域へドラッグ。
  2. URLを入力表示したいページのアドレスを貼り付け。
  3. 表示方法を選ぶOpen Natively(そのまま表示・推奨)/Manual Position(位置指定)/Best Fit(枠に合わせる)から選ぶ。
  4. 更新間隔・表示時間を設定 → 公開
表示方法の違い
  • Open Natively:ページをそのまま表示。多くのサイトで確実に映る(推奨)。
  • Manual/Best Fit:枠内に収めて表示。ただし埋め込みを拒否するサイトでは映りません。
注意:多くのサイトは X-Frame-Options という設定で「枠内埋め込み」を拒否します。うまく映らないときは Open Natively に。Webページの表示にはネット接続が必要です(キャッシュされません)。

口コミ ウェブページ表示

Googleの口コミや評価を店頭に表示し、来店客に安心感・信頼感を与えます。「ウェブページ」で口コミ表示用のURLを出します。

設定手順

  1. 口コミ表示用のURLを用意Googleの口コミ表示ウィジェット等で作成した表示用URL。
  2. 「ウェブページ」を配置 → URLを入力
  3. 「Open Natively」で表示 → 公開
入力する項目
  • 口コミ表示用URL
  • 表示方法:Open Natively
  • 表示時間(秒)

交通情報 ウェブページ/RSS

最寄りの運行情報・道路情報などを表示し、来店客の利便性を高めます。「ウェブページ」または「RSS」で出します。

設定手順

  1. 表示元を決める交通情報のページ(URL)、またはRSSのアドレス。
  2. アプリを配置ページ表示なら「ウェブページ」、見出しを流すなら「RSSティッカー」。
  3. URLを入力 → 表示方法/件数を設定 → 公開ウェブページはOpen Natively。RSSは件数・速度を設定。
入力する項目
  • 交通情報ページのURL(ウェブページの場合)/RSSのURL(RSSの場合)
  • 表示方法・件数・表示時間

数値・ダッシュ 標準アプリ

価格表・メニュー・売上・来店数などの数値やグラフを表示します。データだけ更新すれば、画面も自動で変わります(レイアウトは触らなくてOK)。

設定手順(データセット方式)

  1. データセットを作るライブラリ → データセット →「追加」。表の列(例:項目名・金額)を定義。列の設計は初回のみ。管理者に相談できます。
  2. データを入力/更新作った表に価格やメニューなどの値を入力(以降はここを更新するだけ)。
  3. 「データセット」を配置編集画面で「データセット」を領域へドラッグし、作った表を選ぶ。
  4. 表示形式・列を選ぶ「表(Table)」か「ティッカー」を選び、表示する列・並び順を指定 → 公開。
入力する項目
  • 使用するデータセット(表)
  • 表示形式:表 / ティッカー
  • 表示する列・並び順・表示時間
別の方法:外部のダッシュボード(売上グラフ等)がある場合は、「ウェブページ」でそのダッシュボードURLを表示する方法もあります。
Layout

4つの出し方

同じアプリでも、見せ方を選べます。レイアウトの領域の切り方と、スケジュールの組み方で決まります。

出し方やること
全画面領域を1つにして、1つのアプリ/画像を画面いっぱいに。
画面分割で同時領域を複数に区切り、動画+ニュース+天気などを同時に表示。分割テンプレートを使うと簡単。
時間帯で自動切替朝・昼・夜などの時間帯(デイパート)を作り、スケジュールで選ぶと自動で切り替わる。
順番にローテーション複数のレイアウトをキャンペーンにまとめ、順番に繰り返し表示。
組み合わせOK:「昼はメニューを全画面、それ以外は動画+SNSを分割で順番に」のように掛け合わせられます。
Interactive

タブレットでタッチ予約

普段はサイネージを流しつつ、画面をタッチすると予約ページに切り替わる使い方です。「タブレットにタッチして予約したい」という要望は、この方法で実現します。1台でサイネージと予約を兼ねられます。

サイネージ表示 動画・お知らせ ▶ 予約はこちら タブレット 予約ページ Webページ(Open Natively) タップ 戻るボタン(自動では戻りません)
普段はサイネージ。画面をタップすると予約ページへ。終わったら「戻る」でサイネージに戻します。

設定手順

  1. 端末のタッチを有効化ディスプレイ → 対象端末を編集 → 詳細(Advanced)タブ → 「タッチ機能を有効化」をON
  2. 予約レイアウトを作る新規レイアウト →「ウェブページ」で予約ページのURLを入力 → 表示方法は必ず「Open Natively」。このレイアウトに「コード識別子(Code Identifier)」(例:reserve)を付ける=移動先の目印。
  3. サイネージ側にタッチアクションを設定サイネージレイアウトでインタラクティブモードをON → アクション「レイアウトへ移動」→ 予約レイアウトのコード識別子 → タップさせたい要素(ボタン画像など)を選ぶ → 保存。
  4. 戻る導線を用意予約レイアウトにも「レイアウトへ移動(サイネージ側のコード識別子)」または「前のレイアウト」のトリガーを設定。自動で戻る機能はないので、戻るボタンは必ず作ります。
  5. 公開してスケジュール両レイアウトを公開し、対象タブレットにスケジュール。実機でタップ→予約→戻る、を確認して完成。
注意:予約ページは必ず「Open Natively」で表示(X-Frame-Optionsのあるサイトは埋め込み不可)。Androidの画面下のバーはAndroid側のもので、Xiboからは消せません(Xibo自身のメニューは「隠す」に設定可)。タッチ予約はタブレットのみ(モニター/スティック型端末はタッチ非対応で表示専用)。
予約専用にしたい場合:その端末を予約ページ固定の専用キオスク(専用ブラウザで施錠)にする方法もあります。サイネージと予約を分けたいときは管理者に相談してください。
Troubleshooting

アプリ別 困ったとき

症状まず確認
変更が反映されない①「公開」したか ② 端末は数分ごとに受信(少し待つ)③ スケジュールで端末に割り当てたか
天気が出ない地点の設定を確認。表示されない場合は接続キー未設定の可能性 → 管理者へ
ニュース/交通が出ないRSSのURLが正しいか(ブラウザで開けるか)。ネット接続も確認
Instagram/FB/YouTube/口コミが出ない表示方法が「Open Natively」か確認。埋め込みURLが正しいか。ネット必須
Webページが真っ白/黒埋め込み拒否(X-Frame-Options)→「Open Natively」に。ネット接続も確認
カレンダーが空iCalのURLがログイン不要で開けるか。表示期間の設定を確認
動画が動かない/GIFが静止動画はMP4推奨。アニメGIFは非対応(動画に変換)
タッチで予約に切り替わらない「タッチ機能を有効化」ON・インタラクティブアクション保存・移動先のコード識別子・トリガー要素を確認
Support

お問い合わせ

埋め込みURLの用意、外部サービスの選定、データセットの列設計など、迷ったところは管理者(サービス提供元)がお手伝いします。

用意してもらえるものSNS/口コミ/YouTube等の埋め込みURL、天気・データ連携の初期設定、テンプレート
お問い合わせ株式会社ローデン(Roden Signage)/ info02@roden.co.jp
合言葉:どのアプリも「アプリを置く → 項目を入れる → 表示時間を決める → 公開」。この4つで、店頭の画面は自由自在です。