MENU
柚月が色々書くだけブログ
    PIXIV FANBOXを開設しています詳しくはこちら！

    「立ち絵置き換えツール（仮）」の使い方

    プログラミング CSS JavaScript 配信 OBS TRPG ココフォリア 自作ツール 立ち絵置き換えツール（仮）
    1. ホーム
    2. プログラミング
    3. CSS
    4. 「立ち絵置き換えツール（仮）」の使い方

    対象ユーザーは pixivFANBOXの支援者 もしくは テスターを依頼してる方々 です

    ツール名は仮の名称であり、今後変わる事もありますのでご留意下さいませ

    いつも配信で利用しているツールを、一部の方に向けてリリース致しました。

    本ページは、そのツール「立ち絵置き換えツール（仮）」の使い方を載せるページです。

    目次

    ダウンロードURL

    pixivFANBOXの支援者のみ閲覧可能です

    pixivFANBOX
    【DL】立ち絵置き換えツール（仮）｜紅坂柚月（あかさかゆづき）｜pixivFANBOX クリエイターの創作活動を支えるファンコミュニティ「pixivFANBOX」

    インストールする

    ここでは v1.x.x での機能を解説しています
    古いバージョン v0.x.x の解説は次ページをご覧下さい

    ダウンロードURL よりBoothを開いてください。Boothを開くと右側に Windows版 / macOS版 が表示されていますので、お使いのOSに合わせたバージョンをダウンロードしてください。

    ダウンロードするとWindows版-立ち絵置き換えツール仮-v1.0.0-Setup.zipというZIPファイルが取得できます

    解凍をしするとWindows版-立ち絵置き換えツール仮-v1.0.0-Setup.exe が出てきますので、このインストーラーをダブルクリックしてインストールを進めます

    「Windows によて PC が保護されました」と出たら？

    環境によっては下記画面が表示されることがあります

    このときは「詳細情報」をクリックすると「実行」ボタンが表示されますので、この実行をクリックしてください

    インストーラーをクリックすると、インストール先のユーザ選択が出ます（お好きな方を選んでください）

    インストール先のディレクトリ選択が出ますが、そのまま「インストール」をクリックしてください

    以下の画面が出たら完了です

    無事に立ち絵置き換えツール（仮）が起動すると、以下の画面が表示されます。

    v0.x.x の設定は自動的に引き継がれますので、以前の設定が反映されています

    はじめてみる

    それでは、立ち絵置き換えツール（仮）をまずは使ってみましょう。

    Discordの設定

    起動したら「設定」の「Discord連携」を開いてください。ここでは Discord StreamKit Overlay を登録することができます。

    まずは Discord StreamKit Overlay でURLを取得してきてください。

    「Can’t Connect to the Discord Client」と出たら？

    Discord StreamKit Overlay で下記のエラーが出たときは、以下の内容を確認してください

    1. Discord のアプリを起動させる
    2. Discord と ブラウザ を再起動させる
    3. パソコン自体を再起動させる
    4. Chromeであれば chrome://settings/content/siteDetails?site=https%3A%2F%2Fstreamkit.discord.com にアクセスし、最下部にある「デバイス上のアプリ」を「許可する」に設定する

    その他、対処法はあるかも？未検証です

    URLを取得したら、「サーバー名」と「チャンネル名」と「Discord StreamKit Overlay URL」を記入してプラスボタンをクリックします。

    これで Discord StreamKit Overlay のリスト登録が完了しました。

    ココフォリアの設定

    一旦、立ち絵置き換えツール（仮）から離れてココフォリアを開きます。

    そして、立ち絵置き換えツール（仮）でDiscordと連携したいルームを開いてください。

    そして、DiscordのIDをキャラクターメモ内の適当な場所に記載してください。

    これを設定することで、『そのDiscord IDを持ってる人が通話に入る』と『ココフォリアのそのキャラクターとして反映』してくれるようになります。Discord と ココフォリアのキャラ を紐づけする設定ですね。

    キャラクター 以外にDiscord IDを貼り付けても動きません

    DiscordのIDを取得する方法は後ほど別途記事にします

    ココフォリアで設定が完了したら、立ち絵置き換えツール（仮）の「ホーム」をクリックします。

    「CCFOLIA URL」には、連携したいココフォリアのURL（先ほどの設定をしたルームのURL）を記入します。

    つづいて「Discord StreamKit Overlay」のプルダウンをクリックし、登録したサーバー＆チャンネルを見つけて選択してください。

    設定が完了したら、左下の「開始」を押してみましょう！

    ココフォリアとDiscordの読み込みが完了すると、以下の画面になります。

    「確認」ボタンをクリックすると、ココフォリアとDiscordで取得したデータが見られます。

    問題なく連携ができていれば http://localhost:50907/?ws=0 を開くことで、立ち絵が反映されています！

    あとは、このURLをコピーして、OBSのブラウザに反映させることで、設定は全て完了です。

    各種説明

    画面の説明をします。

    ホーム

    ここでは『ココフォリアのURL』と『Discord StreamKit Overlay』を連動させることができます。

    CCFOLIA URL

    Discordと連動させたいココフォリアのルームのURLを記載します。

    Server Port

    立ち絵置き換えツール（仮）で利用するポート番号を指定します。基本的には設定しなくてOKです。

    Discord StreamKit Overlay

    Discordの通話チャンネルを選択できます。プラスボタンで複数チャンネルを設定可能です。

    設定

    Discord連携

    Discord StreamKit Overlayの設定ができます。

    ここで設定した内容は「ホーム」のDiscord StreamKit Overlayにて利用できます。

    カスタムCSS

    カスタムCSSの設定ができます

    横幅を固定値にする / 横幅の固定値（現在：〇〇px）

    この機能をONにすると、立ち絵の横幅を固定化できます。OFFの状態ではウィンドウサイズ（OBSのブラウザサイズ）の縦サイズに合わせて自動可変だったけど、この機能をONにすることで自分が指定したサイズ（つまり不変）にできるようになるよ。ウィンドウに関係なくサイズ指定できるから便利だと思う人は便利だと思うよ。

    使う用途は、差分変更で等身が変わるときにサイズ感があまり変わらないように見えるから、そういうときに使えるんじゃないかな？横幅は100～1000pxで変えれるけど、横幅が大きすぎるとピコピコが重たくなるから基本は100～300pxで使うのがオススメです。

    左が機能OFF、右が機能ON
    喋ってない時の明るさ / 喋ってる時の明るさ

    喋る前の暗さ、喋ってるときの明るさを1～100%で調整できるようしました。初期値は50%と100%にしてますので、好みに合わせて調整してね。小さくすると暗くなるよ。1だとまっくろくろすけなります。犯人役かな？

    変化をスムーズにする

    一瞬で明るさ変わったりするとチカチカするよぉって人向けの設定。

    話中の縁取り

    縁取りして欲しくない！って人向けに設定をOFFにできるようしました。ONにするとチャットログの色で縁取りしてくれます。
    ※メインでなにかしら発言するまでは灰色の縁取りになるので注意

    話し始めで跳ねる / 話し中跳ね続ける

    喋り始めにぴょんって動かす設定や、喋ってる間にずっとぴょんぴょんしてるとかできるようにしました。

    左「話し始めで跳ねる」　右「話し中跳ね続ける」

    データ管理

    設定のインポートやエクスポートができます

    ヘルプ

    関連リンク

    バージョン情報

    ライセンス情報

    プライバシーポリシー

    利用規約

    更新のお知らせ

    バージョンアップがあるとお知らせが表示されます（PIXIV FANBOXへのリンクが表示されます）。

    FAQ

    特定の人だけ表示したい

    OBSにて以下のカスタムCSSを追加することで対応が可能。

    [class="Voice_voiceState__"] {
    display: none;
}
[id="ユーザーID"] {
    display: inline-block;
}
    v1.0.0 の場合はこちらです
    [class^="Voice_avatar__"] {
    display: none;
}
[id="ユーザーID"] [class^="Voice_avatar__"] {
    display: inline-block;
}

    ツールを停止させるには？

    左下の「開始」が「停止」になっているのでクリックするだけ。

    Discord StreamKit Overlay を修正したい

    鉛筆マークから修正が可能。

    Discord StreamKit Overlay を削除したい

    ゴミ箱マークから削除が可能。

    Discord StreamKit Overlay を並び替えしたい

    ドラッグ＆ドロップで並び替えをする事が出来ます。

    「この部屋は既に削除されています。」と出る

    ココフォリアでルーム削除をした場合に表示されます。

    1 2
    プログラミング CSS JavaScript 配信 OBS TRPG ココフォリア 自作ツール 立ち絵置き換えツール（仮）
    よかったらシェアしてね！
    • URLをコピーしました！
    • URLをコピーしました！

    この記事を書いた人

    紅坂 柚月のアバター 紅坂 柚月 自称天才プログラマー

    お酒が大好きなバ美肉VTuber。

    お出掛けの時は和服を着てます。
    プログラムは独学で遊んでます。

    関連記事

    目次