【わんコメ対応】七宝焼き・クロワゾネ コメント吹き出しテンプレート|OBS用HTML
- Digital2,000 JPY

金属線が描かれ、色ガラスが満ちていく。 **「CLOISONNE ENAMEL」**は、七宝焼き・クロワゾネの制作工程をモチーフにした、わんコメ対応のコメント吹き出しテンプレートです。 コメントが届くと、まず細い金属線が吹き出しの輪郭と区画を形成。 その小さな区画へ色ガラスが順番に流れ込み、最後に焼き上がった七宝のような艶が表面を走ります。 ただ完成した装飾枠を表示するのではなく、 金属線 → 区画形成 → 色ガラス充填 → 焼き上がり → 光沢 → コメント完成 という「七宝が作られていく過程」そのものを登場演出として楽しめるテンプレートです。 ■ 金属線から始まる七宝焼き演出 新しいコメントが届くと、最初に現れるのは細い金属線。 吹き出しの外周と複数の区画が少しずつ描かれ、七宝焼きの土台が作られていきます。 最初から完成した枠が表示されるのではなく、金属線そのものが伸びてデザインを形成するのが特徴です。 ■ 区画へ色ガラスが流れ込む 金属線によって作られた一つひとつの区画へ、色付きのガラス質が順番に満ちていきます。 複数色の七宝面が少しずつ完成していくため、コメントが表示されるまでの過程にも見応えがあります。 色ガラスには単純なベタ塗りではなく、深みと透明感を感じられるような濃淡を加えています。 ■ 最後に釉薬のような光沢 色ガラスが満ちたあと、最後に表面を光が走ります。 焼き上がった七宝や釉薬を思わせる艶が加わり、完成状態へ移行します。 演出終了後は激しく動き続けず、七宝装飾のコメント吹き出しとして静止します。 ※長文を横スクロール表示している場合は、本文のスクロールのみ継続します。 ■ 金属線とガラス面を細かくカスタマイズ 同梱の設定用デモから、配信画面に合わせてデザインを調整できます。 主な設定項目: 【金属部分】 ・金属線カラー ・金属線の暗部カラー ・金属線の太さ 【七宝ガラス】 ・七宝色1 ・七宝色2 ・七宝色3 ・七宝色4 ・色ガラスの深み ・釉薬の光沢 ・色ガラスが流れ込むタイミング差 ・上下の区画数 【コメント表示】 ・中央表示面の色 ・本文カラー ・名前カラー ・吹き出し幅 ・本文サイズ ・名前サイズ ・最大表示数 ・吹き出し間隔 ・画面端の余白 ・アイコン表示 ・絵文字サイズ ・スタンプ最大サイズ ・長文表示方法 ・横スクロール速度 【演出】 ・焼き上がり演出の長さ ・登場演出ON/OFF 配信のテーマに合わせて、鮮やかな宝石系、落ち着いたアンティーク系、寒色系、暖色系などへ調整できます。 ■ 文字は変形させず読みやすく 金属線や七宝面は大きく変化しますが、コメント文字そのものを歪ませる仕様ではありません。 名前と本文は中央の表示面に別行で表示します。 装飾性の高いデザインですが、コメントの読みやすさを優先した構成です。 ■ 長文表示に対応 長文は、 ・自動 ・折り返し ・横スクロール から表示方法を選択できます。 自動モードでは、長くなった本文を横スクロールへ切り替えます。 横スクロールは右から左へ進み、最後まで表示すると先頭位置へ戻ります。 短いコメントは静止表示です。 ■ 絵文字・画像スタンプ表示 通常のテキストだけでなく、画像形式の絵文字やスタンプを表示する処理も実装しています。 画像の縦横比を維持したまま表示し、最大サイズも設定できます。 ※受信データの形式や画像URLの状態によっては表示できない場合があります。すべての形式での表示を保証するものではありません。 ■ コメントの表示仕様 新しいコメントは下から追加され、古いコメントが上へ移動します。 最大表示数を超えた場合のみ、古いコメントから押し出されます。 時間経過だけでコメントが自動的に消える仕様ではありません。 名前と本文は別行表示です。 ■ 背景透過 配信用テンプレートの吹き出し外は透明です。 ゲーム画面、雑談背景、配信オーバーレイなどへ、そのまま重ねて使用できます。 接続状態やデバッグ情報などの不要なステータス文字は表示しません。 ■ 設定用デモを同梱 商品ZIP内の obs_demo/index.html をブラウザで開くと、実際の配信コメントを使用せずに見た目と演出を確認できます。 デモ画面は、 左側:設定UI 右側:コメントプレビュー に分離しています。 スライダーなどの設定UIと吹き出しプレビューが重ならない構造です。 設定後はconfig.jsを書き出し、わんコメへ導入したテンプレート内の同名ファイルと置き換えてください。 その後、OBSのブラウザソースを再読み込みすると設定が反映されます。 ※obs_demoは見た目・設定確認専用で、実際の配信コメントは受信しません。 ■ こんな配信におすすめ ・和風、幻想的な配信画面 ・宝石やガラス系のデザインが好き ・高級感のあるコメント欄にしたい ・アンティーク、工芸品モチーフが好き ・コメント登場時の演出にこだわりたい ・一般的な角丸コメント枠とは違うものを使いたい ・素材が完成していくアニメーションが好き 雑談・ゲーム・作業配信など、幅広い配信で使用できます。 ■ 内容物 ・わんコメ用コメントテンプレート ・わんコメ追加用ZIP ・見た目・設定確認用デモ ・config.js ・editor_schema.json ・README ・設定ガイド ・トラブルシューティング ・検証内容 ・利用規約 ■ 導入方法 商品ZIPをすべて展開してください。 わんコメへの導入には、 install/cloisonne_enamel_onecomme_v1.0.0.zip を使用します。 商品全体のZIPではなく、installフォルダ内の導入用ZIPをわんコメへ追加してください。 追加したテンプレートをOBSへ読み込みます。 OBSブラウザソースは、 幅:1920 高さ:1080 を基準としています。 詳しい導入手順は、同梱の README_FIRST.txt をご確認ください。 ■ 動作確認について Chromium上で以下を確認しています。 ・金属線を描く初期フェーズ ・色ガラスが区画へ満ちる形成フェーズ ・釉薬の光沢演出 ・完成状態 ・通常コメント表示 ・長文の自動横スクロール ・画像形式の絵文字表示 ・金額表示 ・同一IDコメントの重複防止 ・最大表示数を超えた際の古いコメント押し出し ・チャンネル単位のclear ・時間経過だけではコメントが消えないこと ・名前と本文の別行表示 ・設定UIとプレビュー領域の分離 また、JavaScript・JSON・販売用ZIP・導入用ZIPの構成確認も行っています。 ただし、以下については未確認です。 ・実際のOBS Studio上での表示 ・実際のわんコメへのZIPインポート ・YouTube実配信コメントの受信 ・Windows環境での長時間運用 ご使用環境によって動作が異なる可能性がありますのでご了承ください。 ■ 利用条件 購入者ご自身の配信・動画で使用できます。 収益化した配信・動画にも使用可能です。 ご自身で使用する範囲で、色・サイズ・コードなどを調整できます。 以下は禁止しています。 ・元データの再配布、再販売 ・改変データの再配布、再販売 ・第三者とのファイル共有 ・自作発言 ・本商品の全部または一部を組み込んだテンプレートや素材の配布、販売 ・第三者がファイルを取得できる状態での公開サーバー等へのアップロード 詳しくは同梱の利用規約をご確認ください。 制作:たっくん
