Twitchのコメント表示を、レコードの溝と深夜のラウンジ照明で、音楽・雑談配信をゆっくり聴かせるリスニングルームデザインに変えられる配信用コメントCSSセットです。 Social Stream Ninjaの dock.html / featured.html をOBS Studioのブラウザソースで使う配信向けに、Twitch用のセレクタを入れています。 ──────────────────── ■ 初版 v1.0.0 ──────────────────── カード形状、名前プレート、アバター装飾、背景レイヤー、入場／待機アニメーションをこのテーマ専用に設計した初版です。 カード外への装飾はみ出しを防ぎ、featured / dock、右寄せ、コンパクト表示、大アバター、アバターなしを実際の対象DOMで検証済みです。 ──────────────────── ■ 内容物 ──────────────────── ・Twitch用コメントCSS 5色（featured / dock 各5ファイル） ・導入説明テキスト ・ローカル確認用プレビューHTML 2種 ・サンプル画像 ・利用規約 収録カラー ・ナイトジャズ ・バーガンディソウル ・ティールボサノヴァ ・アンバーラジオ ・プラムミッドナイト ──────────────────── ■ このデザインの特徴 ──────────────────── ・レコードジャケットのように余白を取った横長カード ・センターレーベルを思わせる丸い名前プレート ・盤面のハイライトだけが回る低速グルーヴアニメーション ・長めのコメントや絵文字が混ざるチャットでも読める行間 ・アニメーションを抑えるための prefers-reduced-motion 対応 ・文字サイズ、余白、色をCSS変数で微調整可能 ──────────────────── ■ 対応環境 ──────────────────── ・TwitchチャットをSocial Stream Ninjaで表示する配信 ・OBS Studioのブラウザソース ・Social Stream Ninja の dock.html（連続コメント）または featured.html（選択コメント） ※ Social Stream Ninja本体・コメント取得機能は商品に含まれません。 ※ Twitchのバッジ・エモートを隠さず、流量が多い時も読みやすい余白を確保しています。 ※ サービスやOBSの更新、ご利用のURLパラメータにより軽微な表示調整が必要になる場合があります。 ──────────────────── ■ 導入の概要 ──────────────────── 1. Social Stream Ninjaでコメント受信を有効化 2. dock.html または featured.html をOBSのブラウザソースに設定 3. 用途に合う dock_ または featured_ で始まる、お好きな色のCSSを「カスタムCSS」欄に貼り付け 4. 必要に応じてファイル先頭の :root で文字サイズ・余白を調整 ──────────────────── ■ 利用について ──────────────────── 【OK】 ・Twitch配信での利用 ・収益化配信での利用 ・OBS上での利用 ・色、サイズ、余白などの軽微な改変 ・配信画面や告知画像への使用 【NG】 ・素材データの再配布、再販売 ・購入者以外への共有 ・自作発言 ・改変後データの配布、販売 クレジット表記は任意です。