チャンネルポイントや、チャット内の特定の単語をきっかけに抽選をし、ガチャのような演出を実現します。実際は抽選結果にもとづいてOBSのソースを表示/非表示するということで、動画・音声・テキストのOBSソースを準備することで、柔軟な演出構成が可能です！WEBアプリなのでインストール作業は不要で簡単！

要件

  • HASSHY TOOLSの導入（未導入・初期設定が済んでいない方はこちらを参照してください。）
  • HASSHY TOOLSとOBS WebSocketの接続（接続設定が済んでいない方はこちらを参照してください。）

考え方

全体

流れ

設定したTwitchのチャンネルポイントが使用され、機能が動き出した際の全体的な流れは下記の通りです。

開始

Twitchのチャンネルポイントが使用され、機能が動き始めた際の処理です。

項目説明
抽選番号の決定1～100の数値の中からランダムで値を決定します。どの範囲を当選扱いにするかは、機能の設定の中で指定します。（例：20以下の場合は当選など。この場合、当選確率は20%。）
抽選開始アナウンス抽選が開始された際にTwitchチャットでアナウンス（/announce）されます。機能の設定の中で入力がなければアナウンスしません。
Step1～5

Stepは最大で5つ有効化することができ、有効化されたStepの数だけ同じような演出処理を実行します。Step5は無効化できませんので、Step5で当選/落選の演出を設定するようにします。

項目説明
演出（OBSソース表示/非表示）Step内の演出設定でOBSソースが指定されている場合、OBSソースを表示/非表示します。
演出説明アナウンス演出が開始された際にTwitchチャットでアナウンス（/announce）されます。機能の設定の中で入力がなければアナウンスしません。
終了

Step5の演出が終了（OBSソースが非表示）した後に終了処理されます。

項目説明
当選/落選アナウンスStep5の演出が終了（OBSソースが非表示）した後にアナウンス（/announce）されます。機能の設定の中で入力がなければアナウンスしません。

Stepと演出

Stepと演出の構成

１つのStepは、最大5つの演出で構成されます。

演出発生までの流れ

Stepが発生した後は、構成されている演出のうちいずれか１つの演出が「選出」されて「発生」します。
「選出」されたあとに「発生」するということがポイントです。「選出」されても「発生」しない状況もあるので、このポイントは押さえておいてください。

①Stepの発生判断

Stepが発生するかどうかは、抽選開始時に決定された「抽選番号」と、Stepの設定「発生数値」の値によって決定されます。

Stepが発生しない場合、演出選出以降の処理はスキップされ、次のStep処理に移ります。

②演出の選出

Stepの発生が決まったら、次は演出の選出です。演出の選出パターンは下記の5パターンがあります。

  • ランダム
  • ランダム（優先）
  • ランダム（保証）
  • ランダム（優先・保証）
  • 低信頼度優先

それぞれの選出イメージは以下のとおりです。下記使用のため、良い感じに動くようにするためには、演出1には低発生率・高信頼度のものを設定し、演出5にかけて高発生率・低信頼度のものが設定されるようにしてください。

ランダム

ランダムは、シンプルにランダムです。演出の設定の「発生数値」は選出に関係しません。

ランダム（優先）

ランダム（優先）は、演出1が発生される場合は演出1を選出（＝演出1が発生）、そうでない場合はランダムに選出します。

ランダム（保証）

ランダム（保証）は、ランダムで選出された演出が発生しない場合に、演出5を選出します。演出5の「発生数値」を100以下にしておけば、必ず演出が発生するようになります。

ランダム（優先・保証）

「ランダム（優先）」と「ランダム（保証）」の組み合わせです。演出1が発生するなら演出1を選出。演出1が選出されなければランダムで演出を選出。ランダムで選出した演出が発生しないようなら演出5を選出します。（もう図式化疲れたので、手を抜かせてもらいます笑）

低信頼度優先

その名の通り、発生する演出の中で一番信頼度の低い演出を選出します。（疲れた。。）

③選出された演出の発生判断

「②演出の選出」で選出された演出が発生するかどうかは、抽選開始時に決定された「抽選番号」と、演出の設定「発生数値」の値によって決定されます。

演出の発生

演出が発生すると、Step設定の「表示開始」時間から「表示時間」の間だけ、指定したOBSソースが表示されます。「表示時間」を過ぎると、指定したOBSソースが非表示になります。

使い方

OBS

動作確認

「HASSHY TOOLS」ドッグから「ツールの起動」をクリックします。

ツールのサイドメニューから「EasyLottery」をクリックします。

「テスト」をクリックします。

「抽選番号」と「抽選結果」の表示が変わり、演出のいずれかが白枠で選択されているような表示となっていたら、ツール単体の動作確認は完了です。

EasyLotteryの設定

設定（歯車）アイコンをクリックします。

機能

項目説明
抽選用チャンネルポイント [Twitch]Twitchの特定のチャンネルポイントをトリガーとして動作させたい場合に、対象のチャンネルポイント名を設定します。空欄の場合は、どのチャンネルポイントにも反応しません。
当選数値（1 ～ 100）抽選結果の数値が、ここで設定した数値以下の場合に当選扱いとなります。抽選は1～100の間で行われるので、その範囲の中で指定します。整数で指定する必要があります。
当選時アナウンス [Twitch]当選時にアナウンス（/announce）される文章を設定します。文章の中に「{user.display_name}」という文字列があった場合は、抽選をトリガーした人の表示名に置換されます。
落選時アナウンス [Twitch]落選時にアナウンス（/announce）される文章を設定します。文章の中に「{user.display_name}」という文字列があった場合は、抽選をトリガーした人の表示名に置換されます。
アナウンス遅延当選/落選時のアナウンスや、各演出が発生した際のアナウンスを、何ミリ秒遅らせてアナウンスするかを設定します。配信される映像は遅延があるので、必要に応じて適切な値を設定してください。（単位がミリ秒なので、例えば抽選演出が終了してから3秒遅延させてアナウンスしたい場合は3000ミリ秒と指定します。）
OBSシーンEasyLotteryで操作するOBSシーンを指定します。EasyLotteryは、ここで指定したシーン内のソースを表示/非表示します。アプリ設定で「OBS WebSocket」の接続設定が「接続する」になっていて、「OBS接続中」ステータスになっていない場合は、適切な選択肢となりません。

各Step（1～5）

項目説明
有効化Stepの有効/無効を設定します。Step1とStep5は無効にできません。
Step名コンテンツエリアに表示される名称を設定します。わかりやすい任意の名称を設定してください。
発生数値抽選結果の数値が、ここで設定した数値以下の場合にStepが発生します。抽選は1～100の間で行われるので、その範囲の中で指定します。整数で指定する必要があります。
選出パターンStep内の演出が選出される際のパターンを選択します。
表示開始（ms）Stepが発生する場合の開始時間を指定します。（単位がミリ秒なので、例えば抽選開始から5秒後に発生させたい場合は5000ミリ秒と指定します。）
表示時間（ms）Stepが発生して表示されている時間を指定します。（単位がミリ秒なので、例えばStep発生から演出を3秒間表示させたい場合は3000ミリ秒と指定します。）

各演出（1～5）

項目説明
有効化演出の有効/無効を設定します。
演出名コンテンツエリアに表示される名称を設定します。わかりやすい任意の名称を設定してください。
発生数値抽選結果の数値が、ここで設定した数値以下の場合に演出が発生します。抽選は1～100の間で行われるので、その範囲の中で指定します。整数で指定する必要があります。
発生時アナウンス演出が発生した場合にアナウンス（/announce）される文章を設定します。
OBSソース演出が発生した場合に表示/非表示するOBSソースを指定します。機能設定で指定したOBSシーンの中にあるソースの中から選択可能です。アプリ設定で「OBS WebSocket」の接続設定が「接続する」になっていて、「OBS接続中」ステータスになっていない場合は、適切な選択肢となりません。

チュートリアル

イメージが湧きにくい、とりあえずすぐ使えるようにしたいという方のためにチュートリアルを用意しました。こちらに沿って実際に手を動かしてみることで、基本的な考え方を学ぶことができ、応用がしやすくなると思いますので、是非とも参考にしてください。

このチュートリアルでは事前の動画作成は不要で、無料素材を使用して群予告あり・確定（プレミア）演出ありの下記のガチャを構成していきます。

①チャンネルポイントの用意

EasyLotteryを動かすためのチャンネルポイントを用意する必要があります。EasyLotteryは短い時間に連続で使用された場合の制御をしていないので、Twitch側の設定で連続で使用できないように設定する必要があります。（すでにこの機能のためにチャンネルポイントを用意・設定している人は、この手順をスキップしてください。）

Twitchのダッシュボードから[パワーアップ＆チャンネルポイント] - [パワーアップ＆チャンネルポイントの管理]をクリックします。

[新たなカスタム報酬を追加]をクリックします。

報酬の名前、価格などの任意の項目を設定します。

[クールダウン＆上限]を有効にし、[引き換えのクールダウン時間]を「1分」以上に設定して「作成」をクリックします。

素材の準備

チュートリアルで使用する素材を準備します。機能を理解出来たら自分の好みの動画や画像を作成して設定し直してみてください。

商用利用可能なフリー素材を利用していきます。ただ、二次配布（他のサイトの素材をこのサイトで直接配布）するのは禁止されているので、各サイトにアクセスして各自で素材をダウンロードしてください。（素敵な素材に感謝！！）

OBSの準備

OBSシーンの準備

EasyLottery専用のOBSシーンを作成します。（名称は任意です。）

OBSソースの準備

EasyLotteryで使用するOBSソースを準備します。作業終了後のイメージは下記のとおりです。

Step1用ソース

ソースウィンドウで「＋」をクリックし、「テキスト（GDI＋）」をクリックします。

名前の欄に「1-1 Text 開始」と入力し、「OK」をクリックします。（チュートリアルですし、よくわからなければこのまま進めてみてください。）

テキスト欄に任意の文字列を入力し、「OK」をクリックします。（その他修飾設定はご自由にどうぞ。）

Step2用ソース

ソースウィンドウで「＋」をクリックし、「画像」をクリックします。

名前の欄に「2-1 Image 魚群」と入力し、「OK」をクリックします。

先にダウンロードしていた、「魚の群れのイラスト」の画像を指定して「OK」をクリックします。

魚群には動いてほしいので、OBSソースの設定で動きを加えていきます。追加したソースの「2-1 Image 魚群」を右クリックし、「フィルタ」をクリックします。

エフェクトフィルタの「＋」をクリックし、「スクロール」をクリックします。

任意のフィルタ名を入力し、「OK」をクリックします。

「水平速度」の値を「150」に設定して「閉じる」をクリックします。

いきなり表示されるのも味気ないので、ふわっと表示されるようにします。追加したソースの「2-1 Image 魚群」を右クリックし、[表示トランジション] - [フェード]をクリックします。

Step3用ソース

ソースウィンドウで「＋」をクリックし、「メディアソース」をクリックします。

名前の欄に「3-1 Video ガチャ虹」と入力し、「OK」をクリックします。

先にダウンロードしていた、「ガチャ虹」の動画を指定して「OK」をクリックします。

ここまでのStep3用ソースの手順を、残りの4演出分繰り返し設定します。

ソースの名前指定する動画
3-1 Video ガチャ虹　※作成済みガチャ虹
3-2 Video ガチャ金ガチャ金
3-3 Video ガチャノーマル☆☆☆ガチャノーマル☆☆☆
3-4 Video ガチャノーマル☆☆ガチャノーマル☆☆
3-5 Video ガチャノーマル☆ガチャノーマル☆
Step5用のソース

ソースウィンドウで「＋」をクリックし、「グループ化」をクリックします。

名前の欄に「5-1 あたり」と入力し、「OK」をクリックします。

ソースウィンドウで「＋」をクリックし、「メディアソース」をクリックします。

名前の欄に「5-1 Sound あたり」と入力し、「OK」をクリックします。

先にダウンロードしていた、「シャキーン2」の効果音を指定して「OK」をクリックします。

同じように「5-1 Video あたり」という名前のメディアソースを追加し、「虹色キラキラ背景の動画」の動画を指定して「OK」をクリックします。

「5-1 Sound あたり」と「5-1 Video あたり」のソースを、「5-1 あたり」のグループの中に移動させます。

ここまでの手順を繰り返し、「5-2 はずれ」に関するソースを用意します。

ソース指定するファイル
▼ 5-2 はずれ－
　▶ 5-2 Sound はずれチーン1
　▶ 5-2 Video はずれゲームオーバーの動画
ソースの非表示

EasyLotteryが機能して、演出が発生した際にソースが表示状態となるので、初期状態として非表示状態にしておきます。

ソース表示状態
1-1 Text 開始非表示
2-1 Image 魚群非表示
3-1 Videoガチャ虹非表示
3-2 Videoガチャ金非表示
3-3 Videoガチャノーマル☆☆☆非表示
3-4 Videoガチャノーマル☆☆非表示
3-5 Videoガチャノーマル☆非表示
▼ 5-1 あたり非表示
　▶ 5-1 Sound あたり表示
　▶ 5-1 Video あたり表示
▼ 5-2 はずれ非表示
　▶ 5-2 Sound はずれ表示
　▶ 5-2 Video はずれ表示
メイン配信画面への表示設定

これまではEasyLottery専用のシーンを用意して、その中でいろいろ準備を進めてきました。ただし、このEasyLottery専用のシーン単体で使用することは基本的にないと思います。なので、メインで使用する配信画面で表示されるようにしましょう。

メインで使用する配信画面のシーンを選択し、ソースウィンドウの「＋」をクリックして「シーン」をクリックします。

これまでに作成した、EasyLottery専用のシーンを選択して「OK」をクリックします。

配信画面の任意の位置に表示・調整します。（前の手順で初期非表示としているので、配置直後は何も表示されません。）

EasyLotteryの設定

さて、いよいよEasyLotteryの設定に移りたいと思います。ここで説明していない設定値は、必要に応じて変更してください。設定変更完了後のコンテンツエリアのイメージは下記のとおりです。

機能

まずは機能の設定を行っていきましょう。

項目設定値
抽選用チャンネルポイント [Twitch]EasyLottery用で作成したチャンネルポイントの名前を入力します。（例：レッツガチャ！）
OBSシーンEasyLottery用で作成した専用のシーンを選択します。（例：EasyLottery Sample）
※選択肢の表示には、OBSとHASSY TOOLの連係設定が必要です。未設定の方はこちらを参照して設定してください。

Step1（開始）

Step1（開始）の設定です。

項目説明
有効化使用するStepなので、「有効」のままにします。
Step名わかりやすく、「開始」に変更します。
発生数値Stepは必ず発生してほしいので、「100以下」のままにします。
演出パターン演出は1つしか用意せず、「ランダム」でも必ず選出されるため「ランダム」のままにします。
表示開始（ms）チャンネルポイントが使用されたらすぐ表示したいので「0」のままにします。
表示時間（ms）表示してから2秒間表示させたいので、「2000」のままにします。
Step1（開始） - 演出1（開始）

Step1（開始）の演出1（開始）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「開始」に変更します。
発生数値演出1は必ず発生してほしいので、「100以下」のままにします。
発生時アナウンス必ず発生する演出で、アナウンス不要なので空欄のままにします。
OBSソース「1-1 Text 開始」を選択します。
Step1（開始） - 演出2～演出5

Step1（開始）の演出2から演出5の設定です。不要なので、有効化の設定を「無効」にします。演出2から演出5の4つ分同様の設定を行います。

Step2（魚群予告）

Step2（魚群予告）の設定です。

項目説明
有効化使用するStepなので、「有効」のままにします。
Step名わかりやすく、「魚群予告」に変更します。
発生数値Stepは必ず発生してほしいので、「100以下」のままにします。
演出パターンランダムに演出発生してほしいため「ランダム」のままにします。
※「ランダム（優先）」にしてしまうと、当選するときには必ず魚群が発生するようになってしまうため、魚群が発生しなくても当選することもあるよう「ランダム」を選択します。
表示開始（ms）Step1は開始から2秒間演出されるので、そのあとに表示されるよう「2000」を指定します。
表示時間（ms）表示してから4秒間表示させたいので、「4000」を指定します。
Step2（魚群予告） - 演出1（魚群あり）

Step2（魚群予告）の演出1（魚群あり）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「魚群あり」に変更します。
発生数値信頼度50%の演出にしたいので、「60以下」に設定します。
発生時アナウンス同じ表示時間帯にStep3側の演出を発生させてそちらでアナウンスし、Step2側の演出ではアナウンス不要なので空欄のままにします。
OBSソース「2-1 Image 魚群」を選択します。
Step2（魚群予告） - 演出2（魚群なし）

Step2（魚群予告）の演出2（魚群なし）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「魚群なし」に変更します。
発生数値魚群なしは最低信頼度にしたいので、「100以下」のままにします。
発生時アナウンス演出なしでアナウンス不要なので空欄のままにします。
OBSソース演出なしなので「選択してください」のままにします。
Step2（魚群予告） - 演出3～演出5

Step2（魚群予告）の演出3から演出5の設定です。不要なので、有効化の設定を「無効」にします。演出3から演出5の3つ分同様の設定を行います。

Step3（卵予告）

Step3（卵予告）の設定です。

項目説明
有効化使用するStepなので、「有効」のままにします。
Step名わかりやすく、「卵予告」に変更します。
発生数値Stepは必ず発生してほしいので、「100以下」のままにします。
演出パターン当選確定演出（プレミア）が出るようにし、何かしらの演出は必ず発生するようにしたいため「ランダム（優先・保証）」を選択します。
表示開始（ms）Step2と同じタイミングで表示されるよう「2000」を指定します。
表示時間（ms）Step2と同じく、表示してから4秒間表示させたいので、「4000」を指定します。
Step3（卵予告） - 演出1（虹卵）

Step3（卵予告）の演出1（虹卵）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「虹卵（確定）」に変更します。
発生数値信頼度100%で、当選時の3回に1回発生するようにしたいので、「10以下」に設定します。（当選数値は「30以下」なので、この設定で当選時の3回に1回発生することになります。）
発生時アナウンス演出の種類と信頼度をアナウンスしたいため、「虹卵（信頼度100％）」と入力します。
OBSソース「3-1 Video ガチャ虹」を選択します。
Step3（卵予告） - 演出2（金卵）

Step3（卵予告）の演出2（金卵）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「金卵」に変更します。
発生数値信頼度80%くらいにしたいので、「37以下」に設定します。
発生時アナウンス演出の種類と信頼度をアナウンスしたいため、「金卵（信頼度81％）」と入力します。
OBSソース「3-2 Video ガチャ金」を選択します。
Step3（卵予告） - 演出3（赤卵）

Step3（卵予告）の演出3（赤卵）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「赤卵」に変更します。
発生数値信頼度50%くらいにしたいので、「60以下」に設定します。
発生時アナウンス演出の種類と信頼度をアナウンスしたいため、「赤卵（信頼度50％）」と入力します。
OBSソース「3-3 Video ガチャノーマル☆☆☆」を選択します。
Step3（卵予告） - 演出4（黄卵）

Step3（卵予告）の演出4（黄卵）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「黄卵」に変更します。
発生数値信頼度40%にしたいので、「75以下」に設定します。
発生時アナウンス演出の種類と信頼度をアナウンスしたいため、「黄卵（信頼度40％）」と入力します。
OBSソース「3-4 Video ガチャノーマル☆☆」を選択します。
Step3（卵予告） - 演出5（青卵）

Step3（卵予告）の演出5（青卵）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「青卵」に変更します。
発生数値信頼度最低にして、選出時には必ず発生させるようにしたいので、「100以下」のままにします。
発生時アナウンス演出の種類と信頼度をアナウンスしたいため、「青卵（信頼度30％）」と入力します。
OBSソース「3-4 Video ガチャノーマル☆☆」を選択します。

Step4

Step4の設定です。不要なので、有効化の設定を「無効」にします。

Step5（当落演出）

Step5（当落演出）の設定です。Step5は無効化できず、当選・落選の演出を設定するためのStepということで覚えておいてください。

項目説明
有効化「有効」から変更できません。
Step名わかりやすく、「当落演出」に変更します。
発生数値Stepは必ず発生する必要があるので、「100以下」から変更できません。
演出パターン「低信頼度優先」から変更できません。
表示開始（ms）Step1の演出2秒間、Step2・Step3の演出4秒間が表示されたあとに表示されるよう「6000」を指定します。
表示時間（ms）表示してから3秒間表示させたいので、「3000」を指定します。
Step5（当落演出） - 演出1（あたり）

Step5（当落演出）の演出1（あたり）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「あたり」に変更します。
発生数値機能の設定の中で「当選数値」を「30以下」で設定しているため、同様の値「30以下」のままにします。
発生時アナウンス当選時は、機能の設定の中の「当選時アナウンス」の方でアナウンスするため、空欄のままにします。
OBSソース「5-1 あたり」を選択します。
Step5（当落演出） - 演出2（はずれ）

Step5（当落演出）の演出2（はずれ）の設定です。

項目説明
有効化使用する演出なので、「有効」のままにします。
演出名わかりやすく、「はずれ」に変更します。
発生数値当選時以外は必ず発生させるため「100以下」のままにします。
発生時アナウンス落選時は、機能の設定の中の「落選時アナウンス」の方でアナウンスするため、空欄のままにします。
OBSソース「5-2 はずれ」を選択します。
Step5（当落演出） - 演出3～演出5

Step5（当落演出）の演出3から演出5の設定です。不要なので、有効化の設定を「無効」にします。演出3から演出5の3つ分同様の設定を行います。

設定値の保存

設定値を変更したら、設定ウィンドウ右上部の保存ボタンをクリックして保存します。

動作確認

EasyLotteryを実際に動かしてみて、OBSの配信画面が想定通りの動作となるか確認します。

HASSHY TOOLSからのテスト

「テスト」をクリックします。EasyLotteryが動き出します。

HASSHY TOOLSからのテストでは選出された演出に白枠がついて、どんな流れで動いたのかがわかります。

例えばStep2（魚群予告）の部分を見てみると、演出1（魚群あり）が「選出」されていますが、抽選番号が「80」だったので演出が「発生」しなかったことがわかります。「選出」されても「発生」しないことがあることは覚えておいてください。

Twitchからのテスト

機能の設定で指定したチャンネルポイントを使用します。EasyLotteryが動き出します。

よくあるお問い合わせ

ライセンス

MITライセンスです。使用報告不要ですが、いただけると嬉しいです。

また、使用された場合は、こちらのツールやブログをご紹介いただけますと、同じように使ってみたい方に広がっていって、配信がより盛り上がっていくと思うので、気が向いたらプロフィール欄等でご紹介ください。

さいごに

ガチャって盛り上がるよね。私の配信で人気のガチャ「配信継続チャンス」は、実はSAMMIというアプリを使用して実現していました。（下記はSAMMIの設定画面。めちゃわかりにくいよね。。）

OBSと一緒に起動するというのも面倒くさくて。。あと、ガチャってみんな好きなはずだけど、ツールでもプログラムでも用意したくてもすごくハードルが高いので、簡単に作れたらみんなもっと楽しめるのではと思い、作成してみようと行動に起こしたのでした。使用報告も、バグ報告もお気軽にどうぞ（笑）いろんな人が作るガチャ楽しみだね。
（よければフォローもして、コメントもいただければ嬉しいです^^）