コメントがふわっと浮かぶ「Comment Lover V1」わんコメカスタムテンプレ

Comment Lovers v1.0.2 (VCT Edition)

泡のようにゆらゆらと上昇するコメント演出テンプレートです。

本バージョン (v1.0.2) では **V-Creator Tools SDK (VCT)** を統合し、絵文字とテキストの連動性を強化しました。

## 🌟 主な特徴

- **VCT SDK 統合:** メンギフやマイルストーンなど、複雑なコメントもSDKにより自動で最適化して演出。

- **2つの表示モード:** `bubble`（一塊で飛ばす）と `separate`（バラバラに飛ばす）を切り替え可能。

- **高度な折り返し:** `bubble` モードでも絵文字を含めた正確な改行・整列（左揃え/中央揃え）に対応。

- **ふわふわ上昇:** コメントが泡のようにゆらゆら揺れながら上昇します。

- **ハート演出:** ギフト受信時にハートが出現して回転します。（設定で常時表示も可能）

## 🛠 設定方法（config.js）

`config.js` をメモ帳などのテキストエディタで開いて編集してください。

### 基本設定

- `FONT_SIZE`: 文字の大きさ（基準値）

- `MAX_ACTIVE`: 画面内に同時に表示する最大数

### ハートの設定（Heart Embrace）

- `HEART_MODE`: ハートを表示する条件

- `"gift"`: ギフト・スパチャの時のみ（推奨）

- `"always"`: 全てのコメント

- `"off"`: 表示しない

- `HEART_COLOR`: ハートの色（例: `"#ff0000"` 赤, `"#ffffff"` 白）

- `HEART_USE_USER_COLOR`: `true` にすると、送り主のユーザーカラーに合わせてハートの色が変わります。

- `HEART_SIZE_RATIO`: 文字に対するハートの大きさ（1.0 で文字と同じくらい）

- `HEART_ALPHA`: ハートの透明度（0.0 〜 1.0）

- `HEART_COUNT_MIN / MAX`: 出現するハートの個数の範囲

- `HEART_RADIUS_MIN / MAX`: ハートが広がる距離（半径）

### 出現位置の設定

- `SPAWN_Y_MIN / MAX`: 出現する高さの範囲（0=画面上端, 100=画面下端）

```text

【出現位置（SPAWN_Y）の目安】

0 ---------------- 画面上端

10 (上部に10%の余白)

:

50 ---------------- 中央

:

90 (下部に10%の余白)

100 ---------------- 画面下端（ここから上へ昇る）

110 (画面の下側から出現)

```

- デフォルト（100 〜 110）は画面外から昇ってきます。

- 画面中央から出したい場合は `50` などの数値に調整してください。

- 例：`SPAWN_Y_MIN` と `SPAWN_Y_MAX` を同じ値にすることで、画面中央から出るようになります。

- 例：`SPAWN_Y_MIN` を `90`、`SPAWN_Y_MAX` を `10` にすることで、画面上下10％には出現せず、その内側に出るようになります。

## ⚙️ 設定用ツール（config_editor.html）

設定を直感的に変更できるツールを用意しています。

1. テンプレートフォルダ内の `config_editor.html` をブラウザ（Chrome等）で開きます。

2. スライダーやカラーピッカーを動かして好みの設定を作ります。

3. 「config.jsをダウンロード」ボタンを押し、ダウンロードしたファイルを元のフォルダにある `config.js` と入れ替えてください。

## 📝 使い方

1. わんコメの「テンプレート」フォルダ内にあるこのフォルダを読み込みます。

2. OBSなどでブラウザソースとして追加してください。

3. プレビューを確認しながら `config.js` を調整してください。

---

## 📜 ライセンス

本テンプレートはMIT LICENSEで公開・配布されています

ご自由に改変、再配布可能ですが、

ご利用の際はわんコメ規約に準拠してください。

---

## 🗂 更新履歴

- 2026/03/15: v1.0.3 - VCT SDKの微修正に合わせて表示方法を微修正

- 2026/03/02: v1.0.2 - V-Creator Tools SDK 統合

- 2026/03/01: v1.0.1 - 表示の調整

- 2026/02/28: v1.0.0 - 初版

---

🛠 制作

V-Creator Tools

Virtual V-Tuber Umetana

#📝 クレジット

**Author**: Umetana (https://umetana.booth.pm/)

**Powered by**: 配信者のためのコメントアプリ「わんコメ」https://onecomme.com

-----

使用素材等

背景・ミニキャラ画像：DALL-E3

上記を素材にi2iやAdobe expressで編集

-----