• 201907 スライド用画像

    2019-07-06 03:13
  • 広告
  • 次回バーチャルキャストスライド用画像_2019/06/01

    2019-07-04 01:56
  • ニコナレ終了にてバーチャルキャストのスライドが困る件について

    2019-05-30 00:583

    経緯

    2019年08月にニコナレが終了する旨のアナウンスが行われました。
    https://blog.nicovideo.jp/niconews/104611.html
    バーチャルキャストのホワイトボード、カンペはWebに公開された任意の画像と、ニコナレのidが表示できますがニコナレの終了に伴い簡単にバーチャルキャスト内にスライドを表示する方法が無くなるわけです。

    これは大変困りますw
    これからホワイトボードをどうするべきか…

    なので方策を考えてみました。
    なにか新しい方法が提供されるまで、ホワイトボードにてプレゼンをするには以下の方法が必要があります。

    1. 表示用の複数の画像ファイルを用意する
    2. 何からの方法を使ってURLで公開可能な所に画像ファイルを配置して公開する

    今までは1はニコナレにスライドを上げた時点で作成されていて、niconare(ニコナレ)→バーチャルキャスト用config.json変換くん(非公式) 等で取得することができました。
    2についてもニコナレにスライドを上げて公開設定にした時点で成立していました。
    この2点を解決する必要があるわけです。

    なので上記の2つに対応して方法を考えてみようと思います。

    表示用の複数の画像ファイルを用意する

    登録する連番の画像ファイルを作る方法は色々ありますが、スライドから作成する流れで考えてみます。

    スライドを作る

    • 何かフリーのプレゼンテーション作成ツールを使う
      今回はLibra Officeを使ってみます。
    • Google スライドを使う

    LibraOfficeで作る

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

    Google スライドで作る

    1. スライド作ります。
    2. スライドをPDFにして出力します。(直接連番の画像で取得する方法がないので一度PDFに出します)
      niconare_01
    3. HiPDFというサイトがあります。これを使用してPDFを連番JPGの圧縮ファイルを作成することが出来ます。
      他にもPDFを連番JPGにするフリーソフトもありますので自分の使いやすいものがあったらそれを使っても問題ありません。

    画像ファイルをHTTP参照可能な所に公開する

    バーチャルキャストで公開するには以下のような形式でconfig.jsonに登録する必要があります。

    "whiteboard": { "urls": [ "https://example.com/hogesample.jpg" , (省略) , "https://example.com/hogesample.jpg", ] }

    なので上記で作成したJPG画像を何とか外部から参照可能な状態にして公開する必要があります。

    画像公開先の検討

    上記の通り画像をHTTPで公開するURLがあれば良いので幾つか考えられるものがあります。

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

    これらは一般的な方法ですが、多数のページがあったときに一度に取得する方法がよくわかってないです。
    何より今回はニコナレの代替えを考えているので、当然ニコニコのサービスにて代替えするべきと考えます。

    ブロマガを使った公開

    ブロマガはブログサービスです。なので添付した画像を公開する事ができます。
    ブロマガを使った公開は以下のメリットがあります

    1. ニコニコのサービスなのでニコニコのサービスから参照しても文句を言われづらいと思われる。
      (ブログサービスは基本全体を公開する前提で画像への直リンクは嫌がられますが、恐らく許してもらえそうです。)
    2. 5枚までではあるがまとめて画像投稿ができる
    3. Webページとして公開されるので、画像一覧を取得しやすい

    ブロマガに公開してconfig.jsonを作るまでの作業の流れ

    1. Bookmarkletを作る。
      表示中のブロマガページから該当の画像の一覧を取得するためのBookmarkletを用意します。
      1. なんのページでも良いので一つBookmarkを作ります。
      2. ブックマークマネージャなどから作ったブックマークの編集モードに移ります
      3. 名称はわかりやすいものを付けます(今回は「ブロマガ画像一覧」とします)
      4. URLに以下の内容に書き換えます。
        javascript:(function(l,d,i){for(i=0;i<l.length;i++)if (l[i].getAttribute("data-ubi")){d.write(', "'+l[i].src+'"');}})(document.getElementsByTagName('img'),open().document);
    2. 対象の画像を一通りアップロードして、その画像を必要分だけ貼ったブロマガのページを1つ作ります。
      こんな感じになります。 https://ch.nicovideo.jp/kou1niko/blomaga/ar1601119
    3. 作ったページを表示します。一度最後まで表示してください。全画像を一度表示した状態にする必要があります。
    4. 先に作ったBookmarkletを起動してくだい。
      新しくウインドウがでて以下のような文字が出てくると思います。これがconfig.json記載用の文字列になります。
      , "https://bmimg.nicovideo.jp/image/ch2636926/229208/9f5bc26a8ff68a7a7964f07ce9f707b27193a22f.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229203/b2a16bc7a388a69cca90c82fe69dc7d505f07430.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229204/395634df34490f410ad32e7b5df6fd18b2dc7a4f.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229206/fa16dbbd6d06910e1fc5561aa67bf361e4928730.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229202/50b62543dc3a03799bf315f16a314630cc6a6203.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229207/b459d0661f0106d431e103871b9c95bc9fd6c181.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229208/9f5bc26a8ff68a7a7964f07ce9f707b27193a22f.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229208/9f5bc26a8ff68a7a7964f07ce9f707b27193a22f.jpg"

      以下のような赤丸で囲ったアイコンが出てウインドウが開かない場合があります。その時はアイコンをクリックしてポップアップブロックを解除した上でもう一度やってみてください。
      PopUP_Block_example
    5. 1行目の行頭にある「,」を削除して、config.jsonの該当箇所に転記してください。これでバーチャルキャストのスライドに表示できるはずです。
      "https://bmimg.nicovideo.jp/image/ch2636926/229208/9f5bc26a8ff68a7a7964f07ce9f707b27193a22f.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229203/b2a16bc7a388a69cca90c82fe69dc7d505f07430.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229204/395634df34490f410ad32e7b5df6fd18b2dc7a4f.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229206/fa16dbbd6d06910e1fc5561aa67bf361e4928730.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229202/50b62543dc3a03799bf315f16a314630cc6a6203.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229207/b459d0661f0106d431e103871b9c95bc9fd6c181.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229208/9f5bc26a8ff68a7a7964f07ce9f707b27193a22f.jpg" , "https://bmimg.nicovideo.jp/image/ch2636926/229208/9f5bc26a8ff68a7a7964f07ce9f707b27193a22f.jpg"

    最後に

    以上、ニコナレ終了後に何とかするために、ブロマガを使ってバーチャルキャスト向けのスライドを作る方法を考えたと言う話でした。
    これが助けになれば幸いです。