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】 ・素材データの再配布、再販売 ・購入者以外への共有 ・自作発言 ・改変後データの配布、販売 クレジット表記は任意です。