◉
0000/00/00 00:00:00
≡
≡
≡
// PARTS
── HEADER
🔴 配信中バッジ
👤 プロフィール欄
✉️ メッセージ入力欄
🕐 時計(バー埋め込み型)
📺 テロップ(スクロール)
── BOX
🕐 時計(独立)
⏱ ストップウォッチ
🔢 カウンター
📝 メモボックス
▭ テキスト入力
◻ 図形 ▶
▭ 四角形
○ 円
🏷 タイトルボックス
🖼 画像ボックス
── BACKGROUND
🖼️ 背景を変える
── SYSTEM
⚙️ 設定(保存・OBS接続)
📡 表示更新(別タブ)
// HOW TO USE
PARTS
DOUBLE CLICK何もない場所でパーツ追加メニューを開く
MOVE & RESIZE
HEADER DRAGボックスを移動
LONG PRESS 0.2sボックス内のどこでも長押し → ドラッグで移動
HANDLE DRAGホバーで表示、ドラッグでリサイズ
≡ MENU右上に出現 → 複製・文字サイズ・色変更・削除
SAVE / LOAD
AUTO SAVE今の画面は自動で保存され、次に開いたときは続きから始まります
PRESET今の画面に名前を付けて、いくつでも保存・読み込み
EXPORT今の画面とプリセットをJSONファイルとしてダウンロード
IMPORT書き出したJSONを読み込んで、今の画面とプリセットを復元
DISPLAY UPDATE同じURLを別タブで開いている場合、その画面へ即座に反映(同一オリジンで開く必要あり)
OBS CONNECT「⚙️ 設定」からOBSに接続すると、Chromeで編集した内容がOBSのブラウザソースに反映されます(OBSのWebSocketサーバーを有効にする必要あり)。確定モードではメニューの「📤 OBSに反映」か Ctrl+Enter で送ります
SPEC
CANVAS1920 × 1080 px 推奨
Created by どんま / donnma web : donnma.com
// BACKGROUND
飾りを追加
色・画像
消す
飾り・色・画像をまとめて消して、透明(OBSでは下の映像が見える状態)にします。
// SETTINGS
保存・読み込み
今の画面は自動で保存され、次に開いたときは続きから始まります。取っておきたい画面は、名前を付けてプリセットにできます。
今の画面とプリセットを、まとめて1つのファイルに書き出します(画像も含む)。別のPCやブラウザへ持っていったり、バックアップにしたりできます。
OBS接続
OBSの「ツール → WebSocketサーバー設定」で「WebSocketサーバーを有効にする」をオンにし、「接続情報を表示」のポートとパスワードを入れてください。接続すると、ここでの編集をOBSのこのオーバーレイに送ります。
ポート
パスワード
反映のしかた
「確定したときだけ」は、メニューの「📤 OBSに反映」か Ctrl+Enter を押したときにOBSへ送ります。配信中にこっそり直したいとき向けです。
● 未接続
// PROFILE EDIT