151105_blog_ggxrd_atssf_3_thumb

ドット絵で そしてさらば。を作った際に気をつけたこと3

概要

【GGXrd】ドット絵で そしてさらば。というFlashアニメを作った時に気をつけた事、反省点などあれこれ。

ドット絵で そしてさらば。を作った際に気をつけたこと2 の続き

制作フローとまで細かくはいかないが、完成するまでの全体的ないろいろ。この動画は(も)安易な発想から作り始めたので行き当たりバッタリ。仕事ではこんな作り方は絶対にしない><

きっかけ

ギルティギアGGXrdの一撃必殺などの演出に非常に感動!触発される。

【GGXrd】そしてさらば。 集(3種)
【GGXrd】ライディーン 集(3種)
【GGXrd】マグナムウェディング 集(3種)
などなど。

最初期

適当にキャラ、アニメを作って遊ぶ。当初は簡単なGIFを作ってみようくらいの勢い。

最初に作ったアニメ
151105_blog_ggxrd_atssf_3_010_start_1

ラスタスクロールっぽく表現した、船の背景を描いてみたり
151105_blog_ggxrd_atssf_3_020_bg

素材を作るというよりか、久しぶりにドットを描いて動かして楽しんでいた。
モノをいじるにつれて「また動画でもつくるかなー」と企画し、ぼんやりと全体を妄想し始める。

でも、細かい好きなところばかりいじっていた。

髪とか帽子とかアクセサリーがうごくとこんな感じかなーとか
151105_blog_ggxrd_atssf_3_030_standup

ポニテの髪の動きとかコネコネしたり
151105_blog_ggxrd_atssf_3_040_back

唐突に爆発のエフェクトを描いてみたり
151105_blog_ggxrd_atssf_3_050_explode

画面を再現してみたり
151105_blog_ggxrd_atssf_3_060_map

色々作りながら、ある程度妄想と動画にしたい気持ちが固まっていった。

音声+サンプル動画作成

録画

アテレコ前提なので音声を先に作成。音声の為に、まずPS4のシェア機能を使ってゲームを録画した。

PS4はボタン一つで録画が可能。演出を一個一個録画し、出来たmp4をUSBメモリを介してPCへ保存。

動画編集

151105_blog_ggxrd_atssf_3_070_aviutl

録画した各演出を、動画編集ソフト”aviutl”の拡張編集を使い、切り取り、繋ぎ、尺調整を経て一本の動画にまとめた。
151105_blog_ggxrd_atssf_3_075_aviutl_ss

aviutlを使っている理由は使い慣れている為。

レンダリング

151105_blog_ggxrd_atssf_3_080_wav

編集して出力したファイルは以下の二つ

  • 動画+音声のavi → サンプル動画として使う
  • 音声のみのwav → 本番出力用の音声として使う

Flashはパブリッシュ時に固定ビットレートのmp3に変換される為、この時点ではwavのまま。

アニメ+画像作成

全体の構成はなんとなく妄想できており音声も出来てきたので、必須で使いそうな素材を描いてアニメさせていく。

これが仕事なら最初からガッツリ描かず全体の流れをモックとして作ったりするが、何も考えず最初からガッツリ本番用としてかきこんでた。
(あまりいい作り方ではない…)

画像作成にはPhotoshopCS6を使用
151105_blog_ggxrd_atssf_3_090_pscs6

キャラアニメ

描いてて楽しいキャラクターから手を付けていった。
151105_blog_ggxrd_atssf_3_100_actor

Photoshopで画像を作成 → Flashに取り組み → Flashでアニメ調整 → Photoshopで修正 → … を繰り返していった。
関節アニメをするキャラクターや、画像を移動させる背景等は、Flash上に作った画像取り込んで→動かして→修正の繰り返し。
修正時にソフトを跨ぐのは面倒くさいが、トゥイーン移動やレイヤの順序が変わるもの(画像を前後に移動させるモノ)は、Photoshop上でアニメーションさせるより、Flash上で作った方が楽だった。

エフェクトアニメ

連番画像のアニメーションが主体の爆発や光のエフェクトなどは、Photoshop上で一旦完結させた。
151105_blog_ggxrd_atssf_3_100_effect

連番のアニメだけは、画像の作成もアニメーションの作成もチェックもPhotoshopのタイムライン上で。
ある程度Photoshopだけで作成していた。

全体のアニメつなぎ合わせ

Flashでアニメーションを作る時は、サンプル動画をよこに置いてタイミングをみながら作成。
151105_blog_ggxrd_atssf_3_110_flash

枠外にサンプル動画を配置して、タイミングを動画に合わせながら作成していった。
FlashはFPSが合えば、1フレ1フレ動画にあわせて編集ができるので便利。

そこそこ画像が出来た後の、アニメーション全体のつなぎ合わせの作業は3週間程。

  • 最初の1キャラ目(ソル)のシーンを作るのに約1週間
  • それ以降の全キャラを同じように作るのに約1週間
  • ブラッシュアップ等、細かいところ修正で約1週間

 

アニメ完成後、編集ファイルから参考用のサンプル動画を消し、最終的に音声とアニメを合成してパブリッシュ!
ニコニコ動画用のswfファイルが出来上がる。

151105_blog_ggxrd_atssf_3_120_swf

しかしこれで終わりではなく、ニコニコムービーメーカーを使いアップロードして再生をテスト。
ニコニコのFlash Playerと、ニコニコにアップロードできるFlashのバージョンが違う為か、ビットマップが表示されない事があったりも。

そのあたり調整後、本投稿 → 公開を行った。

 

衝撃のニコニコニュース

最初にドットを1月末に描いてから4月末まで、のんべたらりと描いていた。

その時点ではFlashにすらまったく触っていなかったが…ニコニコニュースでswfが使えなくなる事を知り、急がねばとエンジンかけて作業していく。

【悲報】 ニコニコ動画のニコる、廃止
【一部機能の提供終了に関するお知らせ】swfファイルでの動画投稿/ニコる/スピードチェッカー

 

 

続きます… → ドット絵で そしてさらば。を作った際に気をつけたこと4

Sponsored Link