【わんコメ対応】液体金属融合 コメント吹き出しテンプレート|OBS用HTML
- Digital1,800 JPY

液滴が集まり、つながり、ひとつになる。 **「LIQUID METAL FUSION」**は、複数の液体金属が融合してコメント吹き出しを形成する、わんコメ対応のOBS用HTMLテンプレートです。 コメントが届くと、周囲に現れた金属滴が中心へ引き寄せられ、丸みを保ちながら涙滴状に伸びていきます。 液滴同士が接触すると、間に液体の「首」が生まれ、そのまま大きな金属塊へ融合。 最後は表面張力による揺れが少しずつ収まり、クローム調の鏡面コメント吹き出しとして静止します。 ■ 「融合」そのものを見せる登場演出 単純に銀色の吹き出しをフェードインさせるのではなく、 複数の金属滴 → 中心へ移動 → 涙滴状に伸びる → 液体同士が接触 → ネック状につながる → 中央の金属塊が成長 → 一枚の液体金属へ融合 → 表面張力で反動 → 鏡面の吹き出しとして静止 という一連の変形を表現しています。 コメントが表示される瞬間そのものを演出として楽しめるテンプレートです。 ■ クロームらしい鏡面表現 完成後の吹き出しには、 ・明るい金属反射 ・深い暗部 ・細い反射帯 ・環境光を思わせる色反射 ・わずかに不規則な液体輪郭 を重ねています。 均一なシルバーの枠ではなく、明部と暗部の差を強くすることで、液体金属らしい鏡面感を表現しています。 完成後は融合用の液滴が残らず、一体化した金属面として表示されます。 ■ 表面張力による「ぷるん」とした反動 融合直後は、金属面がすぐに完全静止するのではなく、液体らしく輪郭がわずかに揺れます。 揺れは徐々に減衰し、最後は静止。 常時激しく動き続けるタイプではないため、複数コメントが表示された状態でも画面が騒がしくなりすぎません。 ※長文を横スクロール表示している場合は、本文のスクロールのみ継続します。 ■ 文字は変形させず、読みやすさを維持 液体金属そのものは大きく変形しますが、名前や本文まで一緒に歪ませる仕様ではありません。 形成演出と文字表示を分離しているため、演出後は通常のコメント欄として読みやすく表示されます。 名前と本文は別行です。 ■ 色・反射・粘りまでカスタマイズ 同梱の設定用デモから、液体金属の見た目や動きを調整できます。 主な調整項目: ・液体金属のベースカラー ・金属の暗部カラー ・反射光カラー ・差し色 ・鏡面反射の強さ ・金属の粘り ・表面張力の強さ ・融合する液滴数 ・液滴サイズ ・融合アニメーションの長さ ・登場演出ON/OFF さらに、 ・吹き出し幅 ・本文サイズ ・名前サイズ ・最大表示数 ・吹き出し間隔 ・画面端の余白 ・アイコン表示 ・絵文字サイズ ・スタンプ最大サイズ ・長文表示方法 ・横スクロール速度 なども調整できます。 シルバー系だけでなく、黒クローム系・青みのある金属・暖色系メタルなど、配信画面に合わせたカスタマイズにも使用できます。 ■ 見た目確認・設定用デモを同梱 商品ZIP内の obs_demo/index.html をブラウザで開くと、実際の配信コメントを使用せずに、融合演出や設定変更を確認できます。 デモ画面は、 左側:設定UI 右側:吹き出しプレビュー に分離しており、設定スライダーとプレビューが重ならない構成です。 設定後はconfig.jsを書き出し、わんコメへ導入済みのテンプレート内にある同名ファイルと置き換えてください。 その後、OBSのブラウザソースを再読み込みすると設定が反映されます。 ※デモ画面そのものは配信コメントを受信しません。 ■ コメント表示仕様 新しいコメントは下から追加され、古いコメントは上へ移動します。 最大表示数を超えた場合のみ、古いコメントから押し出されます。 時間経過だけでコメントが自動的に消える仕様ではありません。 長文は、 ・自動 ・折り返し ・横スクロール から表示方法を選択できます。 横スクロール時は右から左へ進み、最後まで表示したあと先頭位置へ戻ります。 短いコメントは静止表示です。 ■ 絵文字・画像スタンプの表示処理 通常テキストに加え、画像形式の絵文字やスタンプを表示する処理も実装しています。 画像の縦横比を維持して表示し、最大サイズも設定できます。 ※受信データの形式や画像URLの状態によっては表示できない場合があります。すべてのサービス・形式での表示を保証するものではありません。 ■ 背景透過 配信用テンプレートの吹き出し外は透明です。 ゲーム画面、雑談背景、配信オーバーレイなどの上へそのまま重ねて使用できます。 接続状態やデバッグ情報など、不要なステータス文字は配信画面には表示しません。 ■ こんな配信におすすめ ・SF、サイバー系の配信画面 ・メカ、機械、近未来系デザイン ・ダーク系・モノクロ系レイアウト ・金属やクローム素材が好き ・一般的なコメント枠とは違うものを使いたい ・コメント登場時の演出にもこだわりたい ・「素材そのものが変形する」吹き出しが欲しい ゲーム・雑談・作業配信など、幅広い配信に使用できます。 ■ 内容物 ・わんコメ用コメントテンプレート ・わんコメ追加用ZIP ・見た目・設定確認用デモ ・config.js ・editor_schema.json ・導入説明 ・設定ガイド ・トラブルシューティング ・検証内容 ・利用規約 ■ 導入方法 商品ZIPをすべて展開してください。 わんコメへの導入には、 install/liquid_metal_fusion_onecomme_v1.1.1.zip を使用します。 商品全体のZIPではなく、installフォルダ内の導入用ZIPをわんコメへ追加してください。 その後、追加したテンプレートをOBSへ読み込みます。 OBSブラウザソースは、 幅:1920 高さ:1080 を基準としています。 詳しくは同梱の README_FIRST.txt をご確認ください。 ■ 動作確認について Chromium上で、以下を確認しています。 ・通常コメント表示 ・液体金属の融合アニメーション ・融合途中の液滴形状 ・融合完了後の鏡面表示 ・名前と本文の別行表示 ・長文コメント ・画像形式の絵文字 ・金額表示 ・最大表示数を超えた際の押し出し ・同一IDコメントの重複防止 ・clear処理 ・deleted処理 ・模擬わんコメ受信 ・時間経過だけではコメントが消えないこと ・設定UIとプレビュー領域が重ならないこと ただし、 ・実際のOBS Studio上での表示 ・実際のわんコメへのZIPインポート ・YouTube実配信コメントの受信 ・Windows環境での長時間運用 については未確認です。 ご使用環境によって動作が異なる可能性がありますのでご了承ください。 ■ 利用条件 購入者ご自身の配信・動画で使用できます。 収益化した配信・動画でも使用可能です。 ご自身で使用する範囲で、色・サイズ・コードなどを調整できます。 以下は禁止しています。 ・元データの再配布、再販売 ・改変データの再配布、再販売 ・第三者とのファイル共有 ・自作発言 ・本商品の全部または一部を組み込んだテンプレート・素材の配布、販売 ・第三者がファイルを取得できる状態での公開サーバー等へのアップロード 詳しくは同梱の利用規約をご確認ください。 制作:たっくん
