【OBS対応】ブラウザで動くマラカス
- Digital150 JPY

ブラウザで動くマラカスです。PC/Chromeでの動作を想定しています。 OBS対応です。
はじめに
GitHub Pagesにてデモ版を公開しています。(PC/Chromeでの動作を想定しています) ↓↓↓ https://black-sesame-ice-cream.github.io/maracas/ ↑↑↑ # 使い方 ◆ マラカスを振る: マウスで灰色の箱をドラッグして動かします。中の赤いボールが物理演算に従って動きます。 ◆ 音を鳴らす: 箱を振ってボールを壁に当てると、衝突音が鳴ります。衝突の速さに応じて音量も変化します。 ◆ カスタマイズ: 画面右側のコントロールパネルで様々な設定を変更できます。 ・当たり判定の設定: 箱の幅と高さ、玉の直径を調整します。 ・画像設定: 任意のPNG画像をアップロードして箱に表示させることができます。画像のスケールや回転も調整可能です。 ・表示設定: 当たり判定の箱や玉、画像の表示/非表示を切り替えられます。 ・壁のサウンド設定: 上下左右の壁ごとに、個別のサウンドファイルをアップロードできます。壁ごとの音量調整も可能です。四方にまとめて音を設定することもできます。この場合、個別に設定した音が優先されます。 ・位置をリセット: 箱とボールを初期位置に戻すことができます。
商品内容
◆商品ファイル名 [maracas.zip] default-image.png index.html ←これが本体 README.txt THIRD-PARTY-LICENSES.txt ※音声ファイルは付属しておりません。各自で用意してご利用ください。
利用規約
◆ OKなこと ・個人利用、法人利用 ・商用利用(収益化を含む) ・データの加工、改変 ◆ NGなこと ・公序良俗に反する目的での利用 ・データそのもの、またはそれに準ずるものの二次配布 ◆ その他 ・クレジット表記不要(任意です。表記していただけると喜びます) ▼クレジット表記例 黒ゴマアイス<伊周> https://korechika.booth.pm/ ・本データの使用により発生したいかなる損害やトラブルについて、当方は一切の責任を負いません。 ・本規約は予告なく変更する場合があります。予めご了承ください。
OBSでの使い方
1.「ソース」パネルの左下にある「+」ボタンをクリックします。 2. メニューから「ブラウザ」を選択します。 3. ソースに適当な名前を付けて「OK」をクリックします。 4.「ローカルファイル」のチェックボックスにチェックを入れます。 5.「参照」ボタンを押し、maracasフォルダ内のindex.htmlファイルを選択します。 6. 追加したブラウザソースを右クリックし、「対話」を選択します。 7. 別のウィンドウが開きます。その中でwebツールを操作できます。ここで行った変更はリアルタイムで配信画面に反映されます。 8. AltキーまたはOptionキーを押しながら赤い枠線をドラッグして、適宜トリミングをしてお使いください。