店頭・レジの上・待合の画面で流すサイネージの動画を8種類の型に分け、再生できる見本・AIへの指示文・コードを載せています。見本ははじめから横長（16:9）で、縦置きの画面に合わせた縦長（9:16）も選べます。店の名前や営業時間、1つを見せる秒数を変えると、見本の動画と指示文にそのまま入ります。
お店のサイネージ動画はどの型を選ぶか
サイネージの画面は、離れたところから、音のないまま、ちらっと見られます。AI に「店頭で流す動画を作って」とだけ頼むと、文字が小さく、1枚に情報を詰め込み、最後で止まったままの動画になりがちです。何を知らせたいか（メニュー・店の案内・キャンペーン・呼び出し・営業時間・館内や会場の案内）で型を選び、文字の大きさと「1つを見せる秒数」まで渡すと、店で使える動画になります。
| こんなとき | 向いている型 |
|---|---|
| おすすめのメニューを、店頭やレジの上の画面で入れ替えて見せたい | おすすめのメニュー |
| 店の前の画面で、店の案内を一日中くり返し流したい | くり返す店の案内 |
| 受付や窓口の待合で、呼び出しの番号と待ち時間を出したい | 呼び出し番号 |
| ショーウィンドウの画面で、期間限定の値引きを通りへ知らせたい | 期間限定のキャンペーン |
| 営業時間や臨時休業を、貼り紙の代わりに画面で知らせたい | 営業時間と臨時休業 |
| 待合室で、待っている人へのお知らせを順に見せたい | 待合のお知らせ |
| 建物の入口やエレベーターの前で、どの階に何があるかを案内したい | 階ごとの館内案内 |
| イベント会場で、いまの演目とこのあとの演目を知らせたい | いまとつぎの演目 |
どの型でも守ること
- 離れたところから読める大きさにする。いちばん伝えたい文字は画面の短い辺の 12% 以上、ほかの文字も 5% 以上にし、細い文字を使いません。
- 1つのカットで知らせることは1つ。文字は 15字くらいまでにし、読める時間（1字 0.15秒＋1秒）より短い間隔で切り替えません。
- 音は出さない。切り替わったことは、文字が少し動いて出ることや、面の色が一度だけ変わることで知らせます。点滅や速い明滅は使いません。
- くり返しの間隔は1つの値にまとめる。CSS 変数（
--iv）に秒数を入れ、時刻をそこから計算すると、間隔を変えても全体がそろって動きます。 - 動きを控える設定の人には、止まった絵で見せる。最後の一覧や営業時間のカードが残るように作ります。見本の「動きを控える設定で見る」で、その見え方を確かめられます。
よくある質問 (FAQ)
画面につないだパソコンや小さな端末のブラウザで HTML を開き、全画面にします。テレビの USB の差し込み口で流したいときは、パソコンでブラウザを全画面にして画面収録し、動画のファイルにしてから USB メモリに入れます。電源を入れたら自動で開くように、端末の起動時にブラウザで開く設定をしておくと、毎朝の手間がなくなります。
「店頭サイネージ」の型は、はじめから最後のカードで止めずに先頭へ戻ります。ほかの型をくり返したいときは、指示文に「最後の一覧のあとで先頭へ戻してくり返す（すべての動きを同じ1周の長さにし、animation-iteration-count: infinite にする）」と書き足して渡します。共通の出力の段にある「1回再生して止まる」より、こちらを優先するように書いておくと、AI が迷いません。
ここでは、いちばん伝えたい文字を画面の短い辺の 12% 以上、ほかの文字も 5% 以上にしています。サイネージは、画面から数メートル離れたところや、歩きながら見られます。細い文字や、1つのカットに詰め込んだ文字は読めません。画面を置く場所から実際に離れて見て、読めるかを確かめてから決めます。
使えます。見本の下の「画面の比」で縦長 9:16 を選ぶと、形と文字が上下に並ぶ形に変わります。指示文の画面の比も変わるので、そのまま AI に渡せます。