デレステのMVでTwitterに投稿できるGIFアニメを作る方法を君たちに教える

 

f:id:barzam154:20170621230548g:plain

どう?僕の三好紗南と池袋晶葉と輿水幸子と望月聖ちゃんとライラさんのユニット。めちゃめちゃバランス良くないですか?

 

で、最近gifアニメに凝ってるんですけどgifアニメTwitterに投稿できるんですよね。

容量制限厳しいけど動画上げるのより再生する方の心のハードルが低いし(動画を視聴するのに比べてギガが減らないので)心に直接ブチ込めるのでなんかいいんじゃないかと思う。

 

で、僕だけが俺の考えたユニット最高~~~ってgifアニメ投稿して気持ちよくなるやつやってたら作り方教えろやって言われたので僕もいろいろ調べつついろんなところの情報を合体させた結果ここまで来たのでまあなんかその辺を噛み砕きながら説明します。

 

ダンドリとしては

iphoneの画面をキャプチャーする

②キャプチャーした画面を録画する(やり直しが効きやすいため)

③gifアニメを作る

です。

Androidは知らねえ。持ってないから。

 

iphoneの画面をキャプチャーする

これについては特別キャプチャーボードなどがいらないのがスマホのいいところです。

AirPlayミラーリングという機能を使うことで、パソコンにiphoneの画面を転送することができます。

 

f:id:barzam154:20170621231405p:plain

 iphoneを画面下端から上に向かってスワイプすると出て来るこの画面にあるやつ。これがAirPlayミラーリングである。

 

で、どう使うかいうと同じWi-Fiネットワーク上にあるPCに「LonelyScreen」というフリーソフトをインストールしておきましょう。

 

forest.watch.impress.co.jp

LonelyScreenを起動しておけばAirPlayミラーリングをタップすると

 

 

f:id:barzam154:20170621231722j:plain

こんなふうにLonelyScreenが表示されます。のでタップするとPCにiphoneの画面が転送される。

 

f:id:barzam154:20170621232048j:plain

こんなふうになるわけ。

LonelyScreen下の赤いボタンを押せば録画して動画保存できるし、このままデスクトップキャプチャーしてくれる系のソフト使えばガチャ配信なんかもできるわけです。かんたんでしょう。

 

②キャプチャーした画面を録画する

ぶっちゃけこのままgifアニ作ってもいいんだけど、失敗したりするとめんどっちいので巻き戻しとか出来るように一回録画しちゃいます。

f:id:barzam154:20170621232626p:plain

これ順追って説明する必要ある??? って感じなんですが曲が始まったら録画開始します。

 

f:id:barzam154:20170621232732p:plain

かわいいですね。

 

f:id:barzam154:20170621232811p:plain

曲が終了したらもっかい赤いボタンおして録画停止です。向かって右にあるフォルダのボタンをクリックすれば保存フォルダが開きます。

LonelyScreenで録画したデータは.mp4ファイルなので、俺は別にgifアニメとか作りたくねーし音が入ってるほうがいいぜって人はそのままTwitterとかYouTubeとかにブン投げましょう。

 

③gifアニメを作る

gifアニメの作り方はいろいろありますが、キャプチャーした動画をgifアニメにしたいときは「gifcam」というフリーソフトが便利です。

blog.bahraniapps.com

デスクトップ上の指定した領域を、キャプチャーしつつgifアニメにしてくれるという便利なソフトです。

f:id:barzam154:20170621233359p:plain

このように再生中の動画の上からかぶせるようにしてサイズを調整します。

Twitterのgifアニメは15MBまでと結構容量制限が厳しく、あまりサイズが大きいと②秒と録れないのでほどほどにしておきましょう。

 

f:id:barzam154:20170621233532p:plain

「Rec」の右のタブからフレームレートを選択できます。33FPSだと結構ヌルヌルにできるのですが、サイズがデカくなりTwitterに投稿することを考えると2秒くらいしか録れません。16FPSか10FPSにしましょう。

任意のgifアニメにしたいシーンを待ち構え、録りたい箇所にたどり着いたら「Rec」のボタンを押します。すると録画が開始されるので録りたいシーンが終わったらもう一度「Rec」のボタンを押しましょう。これで録画のデータ録りは完了です。

 

注意しなければいけないのは、録画を停止しただけではデータが作られていないということ。

f:id:barzam154:20170621233857p:plain

忘れずに下の「Save」ボタンを推して、gifアニメのデータを出力しておきましょう。また、逆に言えば「Save」のボタンを押すまではまた録画ができる、ということにもなりまして、他のシーンまで動画を再生してから再び「Rec」のボタンを押す、追加で録りたいシーンが終わったらもう一度「Rec」のボタンを押し「Save」する……という手順を踏むと異なるふたつのシーンを連結してgifアニメにできます。そうして作ったのが実は冒頭のgifアニメでござる。ただ当然その分容量はデカくなりますが。

 

f:id:barzam154:20170621234109g:plain

そうして作ったgifアニメがこれです。

「なんで解説に最初に使ってた曲"M@GIC!!"だったのに”Nocturne”になってんの?」とか聞くな。なんかうまく録画できてなかったんだよ! そういうこともある。

 

作り方は以上。

以下Twitterに貼った作例です。

 


 

 

 

 

 

 

 

こんな感じである。渋谷凛と池袋晶葉についてはメロンで同人誌委託してるので買ってください(宣伝)。

www.melonbooks.co.jp

 

f:id:barzam154:20170621235211g:plain

当然デレステに限らず色んなスマホゲーのgifアニメが作れますね。どんどんやりましょう。

 

 

 以上です。これからも池袋晶葉ちゃんをよろしくお願いします。