LoginSignup
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

@kou1tw

Discordからバーチャルキャストのホワイトボード用テキストを作る方法について(低価格バーチャルキャストチャレンジ)

Last updated at Posted at 2021-04-03

概要

バーチャルキャストにはホワイトボードというものがあって、それに登録することで中で便利に画像を表示したり線を書き込んだりしてプレゼンをしたり出来る機能があります。
バーチャルキャスト内では比較的よく使われると思われる機能で以下のような特徴があります。

  • http/httpsで直接アクセス出来る公開された画像が必要

    直接アクセスが必要で、リダイレクトされるものは使うことが出来ません。なのでGoogle Photoの共有リンクではだめでその先の画像のURLが必要です。

  • URLのリストを用意すると複数の画像を登録して切り替えて表示できる
    こんな感じのテキストを用意する必要があります。

    https://hoge.com/hoge01.jpg
https://hoge.com/hoge02.jpg
https://hoge.com/hoge03.jpg

ホワイトボード準備の際に出る問題

ホワイトボードの用意をする際に何点か気にする点があります。

  1. 複数の画像の用意
  2. 画像の配布先の確保
  3. 画像URLの連番CSVの作成

これについて1点づつ記載してきます。

複数の画像の用意

色々な方法がありますがとりあえずLibraOfficeで作成する方法を記載します。

  1. LibraOffce impress というツールを使ってプレゼンを作ります。
  2. スライドを全選択して「ファイル」＞「エクスポート」を選んで、出力形式を「HTML」にして出力します。
    こうするとHTMLの構成ファイルの一部としてプレゼンの連番画像が得られます。

    20190526_niconare_01.png

画像の配布先の確保

http/httpsで公開できれば良いので有名所だと以下のような場所があるとおもいます。

  1. DropBoxにて公開してURLを取得
  2. Google Driveにて公開してURLを取得
  3. discordで公開してURLを取得

Twitterの画像を公開されている場合もありますがGoogle Photoと同様に直接URLが取れないので今回は避けます。

今回は内部の連絡や緊急時の音声チャットなどでもよく使われるDidcordに公開する前提で考えます。

Discordにて公開

Discordで自分用のサーバを設定します。そこに専用のテキストチャンネルを作成して、画像をアップロードしてください。

画像URLの連番CSV作成

バーチャルキャストのホワイトボードに使うため、先にテキストチャンネルにアップロードした画像のURLをテキストの一覧にしたものを作る必要があります。

皆さんCSVの作成に苦労されるようです。自分でWebサーバを持っている方だったら公開URL名も規則性を持たせる事も出来ますがDiscordなどの外部サービスだと難しいと思います。

今回は、なにか外部のアプリを用意することは避けてブラウザとエディタで完結するように考えてみました。

  1. Bookmarkletを作成します。

    1. 空ページのブックマークを作成します。

    2. 作成したブックマークの編集画面に移動してURLの内容を以下のBookmarkletに書き換えます。
      このBookmarkletは1回作ったら後は使いまわします。

      javascript:(function(l,d,i){for(i=0;i<l.length;i++)if (l[i].src.indexOf("attachments") > -1){tmp=l[i].src.split("?");d.write(tmp[0]+'<br>');}})(document.getElementsByTagName('img'),open().document);

    3. 画像を貼り付けたテキストチャンネルを開きます。
      一度スクロールをして画像ファイルを一通り画面に表示しておいてください。

    4. 項番１で作成したブックマークを呼び出します。
      新しくウインドウが開いて以下のような文面が出力されます。

      https://media.discordapp.net/attachments/827862088399585280/827862241989754910/20210403_01.png
https://media.discordapp.net/attachments/827862088399585280/827862265617186836/20210403_02.png
https://media.discordapp.net/attachments/827862088399585280/827862269399400478/20210403_04.png
https://media.discordapp.net/attachments/827862088399585280/827862269747527751/20210403_03.png
https://media.discordapp.net/attachments/827862088399585280/827862272373686302/20210403_05.png
https://media.discordapp.net/attachments/827862088399585280/827862277214568448/20210403_06.png
```

バーチャルキャストに取り込み

上記で出来上がったテキストをコピーして、バーチャルキャストの設定画面に貼り付けます。テキスト文言をそのまま入力欄の一番上に貼り付けることで複数件登録することが出来ます。
20210403_03.PNG

バーチャルキャストを起動して確認してみてください。

最後に

バーチャルキャストは元々、ニコニコのニコナレというサービスと連携していて、用意にホワイトボード画像を作ることが出来ていたのですが、ニコナレ終了移行に難民が出る自体になっていましたｗ

なので同じニコニコのサービスであるブロマガからホワイトボード画像を調達する方向で考えていた所、

ニコナレ終了にてバーチャルキャストのスライドが困る件について:kou1nikoのブロマガ - ブロマガ
https://ch.nicovideo.jp/kou1niko/blomaga/ar1766413

2021年10月にユーザーブロマガの終了が発表されました（汗

「ユーザーブロマガ」サービス終了（2021年10月予定）のお知らせ https://site.nicovideo.jp/ch/userblomaga_thanks/

以前から複数の方から多数の画像URLを用意するのが大変だと言う話を聞いていたので書いてみました。

ご参考になれば幸いです。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?