歌枠(歌配信)のための、セットリスト表示と歌唱記録のツールです。OBS に曲名を出しながら「いつ何を歌ったか」を記録し、配信が終わったら YouTube のチャプター(概要欄の目次)と告知文をすぐ書き出せます。インストール不要の HTML ファイルです。 ■ 配信中 ・曲を「曲名 / アーティスト」で1行ずつ、まとめて貼り付け(／・タブ・「 - 」区切りも可、行頭の番号は自動で除去) ・ドラッグや ↑↓ で並べ替え、その場で書き換え、削除 ・▶ で歌い始め、■ で歌い終わり。「次の曲へ」(キー N)で、いまの曲を終えて次の曲を歌い始めます ・リクエスト受付メモ: 曲名・アーティスト・リクエストした人を控え、「次に歌う」で次の曲の前に差し込み ・OBS には「歌唱中の曲」「歌った曲(番号つき)」「次の曲」を表示 ■ 表示画面3種(どれも背景は透明・1ファイル) ・ミニマル: 縁取り文字だけのセットリスト ・半透明カード: 曲名の下にアーティスト名、何曲目かを表示 ・バナー: 歌唱中の曲を大きく出す帯。曲が変わると横からすべり込みます フォント・文字の大きさ・色・縁取り・表示する曲数・寄せる位置などを、表示画面ごとに設定して保存できます。フレーム画像12種(透過PNG・9分割で伸縮)をカードやバナーの枠に使えます。 ■ OBS 連携(OBS の WebSocket を使用) ・操作画面(OBS のカスタムブラウザドック、または Chrome / Edge)から、OBS のブラウザソースへ曲の状態を送ります ・OBS で配信を開始すると、操作画面のタイマーが自動で 00:00 に。途中から連携しても「OBS の配信時間に合わせる」で 00:00 を逆算します ・5秒ごとに最新の状態を送り直すので、ブラウザソースを読み込み直しても表示が戻ります ■ 配信のあと ・YouTube チャプター: 歌い始めの時刻から「00:00 オープニング / 03:32 曲名 / アーティスト …」の形で作成。YouTube ヘルプの条件(最初は 00:00・3つ以上・各区間10秒以上)を書き出す前に検査し、足りないときはどの行の間が何秒かを表示します。時刻補正(±秒)、10秒未満の区間の自動まとめ、最初と最後の行の名前の変更つき ・告知文: 歌った曲の一覧から投稿用の文章を作成(ひな形は自由に編集) ・履歴: 配信ごとに保存し、CSV(表計算ソフト用)と JSON(別の PC への引っ越し・復元用)で書き出し ■ 無料サンプル 無料サンプルは全12点のフレーム画像のうち3点と、表示画面「ミニマル」1本(どちらも製品版と同じファイル)です。OBS のブラウザソースに入れて、架空の曲名のデモ表示で見た目と映り方を購入前に確かめられます。操作画面・チャプター書き出しは製品版だけです。 ■ 収録内容 ・control.html(操作画面) ・looks/minimal.html・translucent.html・banner.html(表示画面3種) ・frames/frame_01.png〜frame_12.png(フレーム画像12種) ・README_JA.md(OBS への入れ方5ステップ、ドックの作り方、Mac / Windows の違い、困ったときの表)・history_template.csv(履歴CSVテンプレート)・LICENSE.txt(利用条件)・SHA256SUMS.txt ■ 動作環境・ご確認ください ・OBS Studio 28 以降(WebSocket サーバーが標準で入っている版)を想定しています ・操作画面は Chrome / Edge を想定。Safari・Firefox・スマートフォンは未確認です ・制作者の確認は、macOS の Chromium(ヘッドレス)での自動テスト32項目(OBS WebSocket の手順をまねた試験用サーバー経由の同期・認証を含む)とチャプター計算の単体テスト13項目です。実際の OBS Studio の画面での確認はしていません ・曲の情報はお使いのブラウザの中だけに保存します。外部のサーバーへは送りません(通信するのは入力した OBS WebSocket だけ) ・動画のプレビューはありません。見た目は無料サンプルでお確かめください ・商品画像の配信画面の背景はイメージで、商品に含まれません。曲名・アーティスト名はすべて架空です ■ 利用条件(要約) ・個人・法人、収益化の有無を問わず、配信・録画・アーカイブ・切り抜きに使えます。クレジット不要 ・本ツールやフレーム画像の再配布・再販売、本ツールを組み込んだ素材やツールの販売はできません ・楽曲の歌唱・配信に必要な権利処理は、ご利用の配信サービスの規約に従ってご自身で行ってください ■ 制作方法(AI 利用の表示) HTML / JavaScript / CSS のコードは、大部分を AI コーディングエージェントが書きました。フレーム画像は Python(Pillow)のプログラムで生成しました。画像生成 AI は使っていません。 OBS Studio・YouTube はそれぞれの権利者の商標または登録商標です。本品はそれらの公式の商品ではありません。