■ KTX Spin Image 好きな画像10枚を入れ替えるだけで、自分だけのスロットルーレットが作れる。 ボタンひとつで画像がスロットのように回転し、ガコンッと止まる。 3〜8コマの画像を抽選できる、OBS用のブラウザ型ウィジェットです。 画像は「0.png〜9.png」の10枚を差し替えるだけ。推しの写真、料理、アイテム、キャラクターなど、配信のテーマに合わせたオリジナルのスロットが簡単に作れます。 当たりを固定できるロック機能も搭載しているので、「最後の1コマだけ抽選」といった盛り上がる演出も可能です。 ■ このウィジェットの特徴 画像を差し替えるだけでオリジナルに 「assets/img」フォルダの「0.png〜9.png」を好きな画像に入れ替えるだけで、スロットの中身が変わります。最大10枚、縦長（3:4）の画像がきれいに収まります。サンプルとして料理の写真を10枚同梱しています。これがKTX Spin Image最大の特徴です。 コマごとのロック機能 画像をクリックするとそのコマがロックされ、赤枠で表示されます。ロックしたコマは固定したまま、残りのコマだけを抽選できます。当たりを1コマずつ確定させていく演出や、「右の2コマだけ抽選」といった使い方ができます。 スロットのような回転演出 回る前に少し上へ引く予備動作から、縦方向にブレながら高速回転し、減速して画像が止まります。演出に緩急があるので、配信で見ていて気持ちのいい動きになっています。 左から順番に確定する「確定間隔」 全コマを同時に止めるか、左から1コマずつ順番に止めるかを選べます。間隔は 0.1秒〜2秒の5段階。コマ数が多いときに、ドキドキ感を引き延ばす演出ができます。 音声ファイル不要の効果音 回転中のカチカチ音、停止音、全コマ確定時のジングルを内蔵。停止音は「メタル / メカ / デジタル / ガコン / コイン」の5種類から選べます。効果音はブラウザ内で生成しているため、音声ファイルの同梱や設定は不要です。もちろんOFFにもできます。 3〜8コマ・6段階の表示サイズ コマ数は3〜8、表示サイズは1〜6倍に対応。設定はすべてブラウザ（ソース）内に保存されるので、次回起動時も同じ設定で使えます。 ■ ツールの使い方（導入〜使用まで） 1. ダウンロードしたzipを解凍し、「ktx_spin_image.html」と「assets」フォルダを同じ場所に置いたまま用意します。 2. 「assets/img」内の「0.png〜9.png」を、お好みの画像に差し替えます（そのままでも動きます）。 3. OBSのソースに「ブラウザソース」を追加し、ローカルファイルとしてHTMLを指定します。 4. サイズを設定して配信に表示します（下記「表示サイズについて」をご確認ください）。 5. スピンや設定の操作は、OBSの「対話」機能から行います（下記「操作方法」参照）。 詳しい手順は同梱の「ReadMe.txt」をご覧ください。 ■ 画像の差し替えについて 「assets/img」フォルダ内の「0.png」〜「9.png」が、スロットに表示される画像です。 同じファイル名で上書きするだけで、画像を変更できます。 ・枚数：最大10枚（0〜9）。ファイル名は必ず「0.png」〜「9.png」にしてください。 ・比率：縦長の 3:4（例：750×1000px）を推奨。比率が違っても収まりますが、余白が出ます。 ・容量：1枚あたり数百KB程度に軽量化しておくと、読み込みがスムーズです。 ■ 表示サイズについて ブラウザソースのサイズは【 横1920 × 縦1080 】を推奨しています。 画面の左側に画像、右側に設定パネル（横560px）が表示される構成です。 1コマは 72×96px と大きめなので、コマ数と表示サイズの組み合わせによっては、画像が1920の幅に収まらなくなります。 FHD（1920×1080）で画像が隠れずに表示できる上限は以下の通りです。 3コマ … 5倍まで 4コマ … 3倍まで 5〜7コマ … 2倍まで 8コマ … 1倍まで 最大構成（8コマ × 6倍）で使う場合は、ブラウザソースの幅を【 4550 】に設定してください。 コマ数ごとの詳しい必要サイズは、同梱の「ReadMe.txt」に一覧を掲載しています。 配信画面には画像の部分だけを映し、右側の設定パネルはOBSのクロップ（Altキーを押しながらソースの端をドラッグ）で隠す使い方を想定しています。 ■ 操作方法（OBSの「対話」） スピン、コマのロック、コマ数・サイズ・確定間隔・サウンドの設定は、すべてOBSの「対話」機能から行います。 OBSのソース一覧で本ソースを右クリックし、「対話」を選択するとウィンドウが開きます。 そのウィンドウ内で「スピン」ボタンを押すと画像が回転し、画像をクリックするとそのコマがロック／解除されます。 ■ カスタムCSSについて OBSのブラウザソースの「カスタムCSS」欄から、背景色や画像の下地色、ロック時の枠色などを変更できます。 例：背景を透過させる :root { --ktx-background: transparent; } 変更できる項目の一覧と設定例は、同梱の「ReadMe.txt」に記載しています。 ■ ご利用上の注意 本ウィジェットは、OBSのブラウザソース（Chromiumベース）での動作を前提に設計されています。 「ktx_spin_image.html」と「assets」フォルダは必ず同じ場所に置いてください。HTMLだけを移動すると画像が表示されません。 コマ数・表示サイズ・ロック状態などの設定はご利用のブラウザ（ソース）内に保存されるため、OBSのキャッシュ削除やソースの再作成を行うと、設定がリセットされる場合があります。 効果音を配信に乗せる場合は、ブラウザソースのプロパティで「OBSを介して音声を制御する」を有効にし、音声ミキサーで音量を調整してください。 同梱のサンプル画像は動作確認用です。ご自身の配信に合わせた画像に差し替えてご利用ください。 kentax design 全製品共通利用規約 ■ ご利用について • 本製品は、個人・法人を問わずご利用いただけます。 • OBS配信・動画制作・ウェブサイト・商用コンテンツなどへの使用も可能です。 ■ クレジット表記について • 製品名・制作者名・リンクなどの明記は不要です。 • 任意でクレジットを記載していただく場合の例は、以下の通りです。 • 例：素材提供：kentax design ■ 禁止事項 以下の行為を禁止いたします。 • 素材やデータの再配布・転売・譲渡 • 自作発言・加工品としての再販売 • 公序良俗に反する、または誹謗中傷・差別的な表現を伴う利用 • 政治的・宗教的な主張・啓発・勧誘などを目的とした利用 • AI学習や自動生成素材への組み込み利用 • 当方が不適切と判断した内容・コンテンツへの使用 ■ 改変・カスタマイズについて • 色やサイズなど、個人の配信・動画演出の範囲での加工・改変は自由です。 • ただし、加工後のデータを第三者へ配布・販売する行為は禁止となります。 ■ 免責事項 • 本製品の使用により発生したトラブル・損害について、制作者は一切の責任を負いません。 • 仕様変更・販売停止などは予告なく行う場合があります。 ■ その他 ガイドラインに関するご質問や、商用・法人案件での特別利用については、BOOTHメッセージまたは公式サイト、XのDMやリプライよりお問い合わせください。 ■ 最新情報のチェックはこちら SNSでは、クリエイターの配信を彩るウィジェットやオーバーレイ素材を発信しています。 ぜひkentaxのアカウントをフォローして、最新情報をチェックしてください！ X: https://x.com/kentax