covotore’s ブログ

動画クリエイティブをサポートというか一緒に動かしましょ

リハビリ動画 vol.04 の静止画書き出し工程って遠回りじゃない?と自分で思ったので。

 

言うとアニメーションgifからのpng書き出しは、
メディアエンコーダーなどの書き出しソフトアニgifを直接5fpsのPNG書き出せばそれで済みます。

とりあえず画像を沢山書き出してから、必要な分の画像だけにしてそれを元に次の工程で行うオリジナル画像を作るというのが 早いカモ です。

 

リハビリ動画では
・アニメーションgifってPremiere Proに取り込めるんだナ!
・カミソリみたいにパパッとカット出来るツールって有ったな~
・動画じゃなくて画像も書き出せるんだ、へぇー

とかなどの「操作の思い出し」をして欲しいナという事で「それ遠回りじゃない?」という工程だったりするんですネ。(自分でも気づかなかった(笑))

 

図解 よくわかるこれからの工程管理―なるほど!これでわかった (DO BOOKS)

図解 よくわかるこれからの工程管理―なるほど!これでわかった (DO BOOKS)

 

 

デジタルトーンBG PNG/JPEGデータ収録 DVD-ROM BG001

デジタルトーンBG PNG/JPEGデータ収録 DVD-ROM BG001

 
デジタルトーンMIX PNG/Photoshop/CLIP STUDIO用データ収録 DVD-ROM MIX001D

デジタルトーンMIX PNG/Photoshop/CLIP STUDIO用データ収録 DVD-ROM MIX001D

 

 

創作マインドて大事よね。そもそもお前がナという リハビリ動画vol.03 の話。

 

「実際飽きる」


映像編集・動画編集をしていたはじめの頃には不透明度のキーフレームを素材ごとに毎回毎回何十回と手動で設定したりして、フェードイン(OL:オーバーラップ)のタイミングを変えたりしつつ、そのフワァっと出てくる画面が格好良く「映画みたい!!」という「喜びをモチベーション」として作り上げていました。割と今でもそういう節があるかもです。。

※補足しますと1プロジェクトに何十個とある素材に1つづつキーフレームを手動で設定する時代は終わりましてw今は素材を選択してプリセットを充てれば数秒で終了します。もしかすると昔(Premiere Pro 1.5)から出来たカモしれませんが、ひとつづつ設定して「実際ヒドイ。動画編集コロスベシ」となった方いると思いますので。。。

しかし
実際飽きますよね?

夢中になれない事なんて沢山あります。英語の勉強はまぁスグ眠くなるし、電気工事士の勉強はピコ単位で進まないし、とかなど「気乗りしない=向いていない」という事かなと感じます。

でも、では何故自分は「英語を理解したい!」とか「電気工事してみたい!」とおもったのでしょうか?

興味あるんですよね、視床下部では(笑)

 

脳の仕組みを詳しくは知らないのですが、理性と本能の行き違い・ミスマッチが「飽きる」という状態を作り出すハズです。

 

途中で興味を持てなくなった。と言って進まないパターンもあると思いますが、それこそ原因がスグ分かる事で「英語使わないし…」ならば「日常のちょっと思ったことを英語で考えてみたらどうかな?」とか「電気工事士の資格の勉強で公式とか覚えるのムリ…」ならば「どうしてこの公式を覚えるのか?必要性をしっかり認識しよう」

といった

「何故?」の解決をすることでの「一件落着」の連続性が

途中で興味を持てなくなった という事ならば連続性(興味・解決策が)有ると思うのです。

 

Premiere Pro を使いこなせない・・・から動画編集に向いていない。

という考えの構造は「英語ならば単語や発音を覚えきれてないから向いていない」「電気ならばテレビが映る仕組みを知らないから技士に向いていない」といったあたりでしょうか・・

決してそういう事でなく、興味があった時点で向いているんですよ!
他の何かと比べて劣っているから向いていない訳では無いのですよ!

と思うのです。

 

それだー!と思った事に体が直ぐに動かなくても 興味を持つ大事さ が創作に関わらず、人間という生物である限りは持ち続けて行きたいなーと思います。

 

(・・・創作の話だったのかな)

 

決定版 脳の右側で描け

決定版 脳の右側で描け

 

 

世界一やさしい右脳型問題解決の授業

世界一やさしい右脳型問題解決の授業

 

 

 

制作手順や制作環境って大事ですよね。先ずはじめに○○○にするのがお薦めなのです。

 

2つ目のリハビリ動画をアップしました!

Premiere Pro を思い出そう!と言っているのですが、しっかりと説明をしていきますと、なかなかプレミアプロの操作まで至らず…

けれども動画制作で大事な制作手順をお伝えしている第2回。

 

動画で少し話題にした
ネスト機能はどのバージョンからだっけ? なんですが

Premiere Pro 2.0 の時点でシーケンスネスト出来るようです。


えーっ!!
使った覚えが無かったデス。。。
何故、あんな便利機能を使っていなかったのかナ??(というか1.5をひたすら使っていたからカナ)・・・多分当時読んでいた本に書いてなかったのかもー?なんて(笑)

 

Adobe Premiere Pro 2.0 HDV編集実践講座 (玄光社MOOK―HD series (98))

Adobe Premiere Pro 2.0 HDV編集実践講座 (玄光社MOOK―HD series (98))

 
Premiere Pro2.0スーパーリファレンスfor Windows (SUPER REFERENCE)

Premiere Pro2.0スーパーリファレンスfor Windows (SUPER REFERENCE)

 

 

GPU(Graphics Processing Unit グラフィックス プロセッシング ユニット)が使えないと編集作業は厳しい時代でありますので
プレミアプロでしたら CS6 以降 での制作作業がオススメです。

 

EDIUS ならば Pro5 以降ならばGPUが使える?みたいですし
PowerDirector は 6 ULTRA というバージョンでGPUエンコードの時に使えるようです。

 

EDIUS Pro パーフェクトガイド[9/8/7対応版]

EDIUS Pro パーフェクトガイド[9/8/7対応版]

 

 

NicoVisualEffects(NiVE)を使ってみて思ったのですがやはりCPUパワーだけですと作り上げるモノを考えてからでないと、動作が厳しいカモです。

 

はじめの一歩でパソコンのパワーアップを考えるならば ハードディスクからSSD への変更を!
グラボどれが良いんだろう~と悩む前にSSDかなと思いますー(もちろん既にSSDの方はグラボ強化しても良いかもです)

 

Crucial SSD 500GB MX500 内蔵2.5インチ 7mm (9.5mmアダプター付) CT500MX500SSD1/JP
 
Transcend SSD 240GB 2.5インチ SATA3 6Gb/s TLC採用 3年保証 TS240GSSD220S

Transcend SSD 240GB 2.5インチ SATA3 6Gb/s TLC採用 3年保証 TS240GSSD220S

 
Intel SSD545sシリーズ 2.5インチ 3D TLC 256GBモデル SSDSC2KW256G8X1
 
インテル SSD 545シリーズ 512GB 2.5インチ TLC SSDSC2KW512G8X1

インテル SSD 545シリーズ 512GB 2.5インチ TLC SSDSC2KW512G8X1

 

 

リハビリ動画 vol.01 というのが一応仕上がったのであります。

 

クリエイティブのリハビリという何か分かるような分からないような言葉なのですが、そんな方へ向けた動画がこの「リハビリ動画」

※某ビリビリ動画的な言葉のニュアンスは似ていますが、こちらら動画制作者向けの内容になっている…ハズです。

 

何枚も同じ様に線を描いてシーンを完成させるアニメーターさんって本当にスゴイなと万人が思うに至るのは難しいのでしょうか、、、否!皆さんで少しでもアニメーション制作をかじれば、その丁寧な仕事ぶりに関心がむくのかなと思った次第です!

 

アニメーターが教える線画デザインの教科書

アニメーターが教える線画デザインの教科書

 
アニメーターが教える線画デザインの教科書2 キャラクター創造編

アニメーターが教える線画デザインの教科書2 キャラクター創造編

 

 

どうやって操作したっけかな~を思い出すキッカケになれー

 

前に少し制作した時にソフトを触ったけれども忘れたはー
という事が多いかなと思い

ガチ基礎 では無く
制作のアイデアを含めたリハビリ動画シリーズを作ってみようかなーと思い立ったので行動してみたであります。

 

 

レシピ的には

 

【リハビリ動画:Premier Proを思い出そう】

お題>走るアニメを作ってみる。

 

・方法・
人が走っている実写の動画を参考にして、パラパラアニメの元になる画像を作って、
Premierにその素材を読み込んで、背景をつくって、完成させる。

 

1.パラパラアニメーションをつくる

 Gifアニメをトレース元にする

 イラストレーターを使ってみる

 

2.背景をつくる

 フリー素材を利用する

 エフェクト・トランジションの活用

 

そんな制作の流れが分かる動画を作る 予定 なのです。

 

アニメーションの本―動く絵を描く基礎知識と作画の実際

アニメーションの本―動く絵を描く基礎知識と作画の実際

 
ショートアニメーション メイキング講座 ~吉邉尚希works by CLIP STUDIO PAINT PRO/EX

ショートアニメーション メイキング講座 ~吉邉尚希works by CLIP STUDIO PAINT PRO/EX

 
アニメーションの基礎知識大百科

アニメーションの基礎知識大百科

 

イラレを使ってキャラクターを描くまでのアイデア

マウスの手書きはペンタブが無いとちょと厳しいナというか、もう少しシュっとした感じのモノをアップしてみようかなと思い立ったのがきっかけでした。

 

【ニンジャ】「ニンジャー」イラスト/Covotore [pixiv]

 

やはりニンジャを描きたく、しかしそうそうアイデアが有ったわけでも無い場合にはやはり何かを参考にするのが一番ではないでしょうか。

 

以前に MediBang Paint Pro を使って手書きで書いたニンジャも下絵はレゴのニンジャゴー

 

ということで今回もニンジャゴーをベースにプラスアルファをして、オリジナル感あるキャラクターを描いてみよう!という訳です。

 

 

f:id:covotore:20180629210511j:plain

ニンジャゴーと武装神姫 忍者型MMSフブキ を参考に。

 

頭部から体全体のフォルムは ニンジャゴー画像の白い奴 をベースに。
もちろん白い奴に拘った訳でなく身体の向きを基準に選びました。

 

そこからアレンジしたいなーという事で
アクセントとして首にはマフラーかな?と思い、取り敢えずのアイデアを探しに画像検索を使います。

 

 

忍者 マフラー で画像検索。すると忍殺感溢れるキャラクターが目につくのですが目を描く事とマフラーもしているキャラクターに目が止まりまして、そちらを参考としてみました。

 

 

f:id:covotore:20180629220955j:plain

細かすぎないぐらいのトレースが今回の例だと良いかもです

f:id:covotore:20180629210515j:plain

目、マフラーを描きキャラクターに馴染むよう変形

 

基本的にはペンツールで下絵の大体の形をトレースして行き、アクセントとなるマフラーは馴染むように変形させて配置します。

 

目を描くのは何かと難しいのですがこちらも 目の描き方 で 画像検索して他の人の描き方を参考にチョト自己アレンジを入れています。

 

f:id:covotore:20180629210517j:plain

ハイライト部分は自己アレンジ!

 

白い丸のハイライトというのは定番の方法なのかと思いますが、薄い三日月状のモノを試しに入れてみたらそれなりに見えました!

 

さらに、

・グレーのオブジェクトで輪郭が有るっぽい感じに配置
・白目部分のオブジェクトをグラデーションに

 

このアイデアで 透き通った感じの良い目 が描けました。

 

 

この目もマフラーと同様に自由変形ツールを使って顔に馴染むようにアレコレと試しています。

 

最初は左にだけを配置、しっくり来たかな?という所でリフレクトツール辺りを使い右にコピー。正直この「目をしっくり馴染ませる」箇所が一番時間かかりますよね(笑)

 

 

少し太眉にして男子っぽく。それでも女の子っぽい雰囲気が・・・と感じたので

顔にキズを付ける!というアイデアを思いつきました。

 

しかし、結果的に顔のスペースも小さいので頭に巻いているハチマキに傷っぽいマークをいれてみました。鉢巻というよりヘアバンドっぽいですけど。。

 

f:id:covotore:20180629210451j:plain

アルファチャンネルにグラデーションを入れてブラーを入れてみました

 

配色のアイデアも最終的には画像検索で 他の忍者画像を参考 にスポイトツールを使って3色程度だけ使いシンプルにしてみました。

 

驚きあるアイデアではありませんが、パーツパーツの組み合わせ でキャラクターを組み立てて行くのは面白いものですよね!

 

NIKE(ナイキ) スウッシュ ヘッドバンド ホワイト N.NN.07.101.OS

NIKE(ナイキ) スウッシュ ヘッドバンド ホワイト N.NN.07.101.OS

 

 

Kritaでサイズ変更してNive2でプリコンポーズ

ニンジャのPNG画像が 4Kサイズ弱(2507x3541 pixel)あったため
縦横サイズの変更しようと、メディバンではなく今度は Krita4.0 を使ってみた事から話は始まります。。

 

KritaPNGファイルを放り込む(ドラッグ&ドロップ)と
問題なくファイルは開きました(透過ファイルで有ることが分かる背景模様が見えます)。

 

そこから 幅:800 px にするために 画像 メニューから
画像を新しいサイズにスケール を選んで画像の縦横サイズを変更しました。

 

f:id:covotore:20180615130759j:plain

画像を新しいサイズにスケール をスグには見つけられなかった・・・

 

比率を保つ にチェックをして 幅:800 として難なくサイズ変更は出来ました!

 

しかしここで少々 Krita で画像をいじってみようと
レイヤーを 複製 したみたところ・・・・

 

f:id:covotore:20180615131929j:plain

英語では Clone Layers っていうのかな

 

この複製レイヤーですが、選択範囲で顔だけ囲ってデリートしようとしても何も反応せず。。。
Krita 調子悪いのかな?(笑)と思っていたのですが

 

そうではなく複製レイヤー(Clone Layers)は公式のヘルプによると

 

You cannot draw or paint on it directly,~

 

…という事らしく
自分が行いたかった選択範囲で囲ってデリートをするのには、ペイントレイヤーとしてコピーしないといけません。。

 

f:id:covotore:20180615134022j:plain

大概、他のやり方でのレイヤーコピーはこの状態なハズ。

 

レイヤー/マスクを複製(Ctrl + J)という分かりやすいアイコンでレイヤーをコピーすればササっと編集できるレイヤーが出来上がります。(実はココに至るまで凄く時間が経過してしまいました…)

 

 

余談ですが Krita で おぉ! と感じたツールは 画像補完ツール

f:id:covotore:20180615134429j:plain

画像補完ツール。自動で何かを修正!フォトショップはCCから有るのかな?

 

ニンジャの右腕を下げた状態にしてみようかなというのが当初の目的。

パックリ空いた所はブラシツールで~が王道ですが、あえての画像補完ツールを使用。

そもそもが補完しようもない状態でしたがちゃんと身体の外側のラインや色の雰囲気などソレっぽい感じの仕上げが出来ます!(ごちゃごちゃになったので使いませんでしたけども)

 

 

幅を800ピクセルにサイズ変更した画像を Nive2 に読み込ませて動画を仕上げて行きます。

 

 

今回は平面的な動きのみを付けた動画にしました。

 

キーフレームを打っていく際に便利かなと感じたやり方は
Ctrl + PageDown でタイムライン上の赤い線を1フレームづつ動かせます。

そして、画像を数フレーム動かしては数値を入力というのは面倒。
ですので直接画像をマウスで自由に動かすだけでキーフレームが生成される方法です。

 

f:id:covotore:20180615135827j:plain

画像の赤い外枠線内を黒矢印の選択ツールを選ぶことで自由に動かせます

 

1.位置 キーフレームを先ずは1つ作る
2.プレビューウインドウ内にある 黒矢印 を選択
3.Ctrl + PageDown(PageUp)のキー操作でタイムライン上の赤線を動かす
4.動かしたい画像の上にマウスを移動して左マウスボタン押し + 移動
5.画像を自由に動かした後 Ctrl + PageDown(PageUp)で赤線を進ませ、画像を動かすの繰り返し

 

※プレビューウインドウ内の白矢印は作業画面全体が動きます

 

f:id:covotore:20180615140648j:plain

細かなキーフレームもショートカットキーを使うとそれほど大変では無いカモです

 

ここで一つ不便な点は画面内に画像の外枠赤線が見れていないと
黒矢印を使って移動できないことです。

 

f:id:covotore:20180615141101j:plain

この状態ではニンジャ画像を動かす事が出来ませんでした。。

 

その場合には トランスフォーム の 位置 の設定数値を変更します

 

f:id:covotore:20180615141331j:plain

数字の上にマウスを移動して左右にドラッグすると値が変更されます

 

さて、動画の中身を整理すると

・ニンジャ画像に動きを加えた物
・背景
・テキスト

この3つがメイン素材となります。

ここでは画像と背景をプリコンポーズ(フォルダ化、もしくは入れ籠(いれこ)化)しました。この機能は正直とっても便利です!!

 

 

プリコンポーズ?と聞き慣れないと思いますが 素材を1つにまとめる機能 です。

 

Krita4.0 だと グループレイヤーの機能
MediBang Paint Pro だと レイヤーフォルダーの機能
Inkscape0.91 だと・・・似た機能は無かったみたい(笑)

 

f:id:covotore:20180615144047j:plain

マスクを使って縦に画面が割れてレイヤー下の動画が表示されます


なぜプリコンポーズをするのか?というと

 

今回の場合については
ニンジャと一緒にマスクも移動してもらいたくは無い為です

 

プリコンポーズ(フォルダ化)をすることで、それ自体を1つの素材として扱うことができて 画面が縦に割れて見える効果を狙ったから となります。

 

 

感想Nive2 で作る動画は10秒程度が良いカモ。
作り込むならば、というか作り込むほどこのソフトを使えるようになったら、難なく After Effects に移行出来ると思いますしした方が良いかも。
そういう意味でもAEを触る前提ならばかなり練習になる使えるフリーソフトです!

パソコンの挙動も含めて(複雑にしていくとやはり動作が重い)10秒程度動画のプロジェクトファイルを幾つか作ってavi形式で書き出して、AviUtl といった編集ソフトで仕上げていく工程が良さそうです。

 

 

After Effects 空間演出技法

After Effects 空間演出技法

 
After Effects 実践講座 -プロのテクニックが身につく映像制作の解説書

After Effects 実践講座 -プロのテクニックが身につく映像制作の解説書

  • 作者: 電報児タムラ,電報児カトウ
  • 出版社/メーカー: ビー・エヌ・エヌ新社
  • 発売日: 2011/10/20
  • メディア: 単行本(ソフトカバー)
  • 購入: 1人 クリック: 3回
  • この商品を含むブログを見る
 
エクスプレッションがわからん! はじめてのAfter Effects エクスプレッション奮闘記

エクスプレッションがわからん! はじめてのAfter Effects エクスプレッション奮闘記