Ψ(`∀´)Ψケケケ と (´・ω・`)ショボーン

AviUtl用のスクリプト配布やBlender、自作PCのパーツやガジェットの情報を配信中

 

【AviUtl】Inkscapeで作った素材を使ってオリジナルのオープニング用動画を作る【初心者用】

Edit Category Aviutl > 応用、Tipsなど

前回、【まとめ】簡単に高画質動画の作成・編集・加工・変換 2011年版【初心者用】という無駄に長ったらしい文章ばかりの記事を書いたので、今回はその記事の内容に沿って動画のオープニング映像を作ってみようかと思う。

ちなみに前回の記事で説明の少なかった紙芝居系のオープニング動画を作ってみようかと思う。


手順

  1. まずイメージ作り。どんなオープニングにするか考える。
  2. イメージができあがったらオープニングに使用する素材を用意する。
    (使用予定の動画の加工編集ソフトに適した形式や状態にする)
  3. 用意した素材を動画加工編集ソフトに適した状態にする。
  4. 素材を動画加工編集ソフトで加工編集する。
  5. 加工編集が終わったらプロジェクトとして保存しておくか、動画ファイルとして出力したら終了。

イメージ作り

まずはどんなオープニングにするか考える。

  • 明るいイメージか暗いイメージか。
  • 温かいイメージか冷たいイメージか。
  • テンポは速いのか遅いのか。
  • オープニングは長いのか短いのか。
  • 写真や動画を使うのか使わないのか。
  • 新たにイメージに合った画像を作るのか作らないのか。
  • 音楽を使うのか使わないのか。

といったことを考えて、オープニングのイメージを固める。

イメージが固まったらイメージに沿った素材を作ったり集めたりするので、大まかな色の使い方、素材の選び方、場面の切り替えの仕方、オープニングの雰囲気を色々と頭の中で思い描いてみたり、紙に書いてみたり(絵コンテみたいに)してもいいかもしれない。

 

今回はソフトのテクニックではなく、大まかな作成方法の記事として扱うので、

  • できるだけ単純で簡単に
  • ブログのイメージにあった軽い感じで
  • 暗いよりも明るいイメージで
  • 動画加工編集ソフト以外のソフトも使って

といった感じで以後の作業を行うことにした。というか、大したスキルがないだけww

素材作り

で、デジカメの写真や動画を使うのもいいけど、少し手の込んだ(?)、でもそれほど負担にならないような形での素材作りをしてみるためにソフトはInkscapeを使う。

このソフトはペイントとは違って、絵を個々の図形データとして描くソフト。データをGimpなどと連携できるので、使い勝手がいい。

で、今回Inkscapeを使ってやったことは、

  1. ブログのタイトルを入力し、球体をひとつ作ってその外周に沿ってブログ名(文字)を配置する。
  2. 三つの球体と楕円をひとつ作る。組み合わせたときに立体感が出るようにそれぞれのフィルやストロークに色をつけたりぼかしを入れる。
  3. フィルやストロークにぼかしを入れたことで球体からはみ出てしまった部分を、Inkscapeのクリップ機能(オブジェクト機能)を使って消す。
  4. 各部の配置などの全体像を整える。
  5. エクスポート機能を使って、作成した部品ごと(文字、球体、影)にPNG画像として保存する。

といった単純な作業のみ。

 

最初は操作や機能がわからないと思うので以下のリンク先の記事を参考にしながら、素材を作成しつつ操作法等を覚えるといいかも。

 

で、下のキャプチャがInkscapeを使って素材を作成した様子。

20110507174950 20110507190237

左の画像がInkscapeで図形を作っている場面、右の画像が左の画像に色をつけたりぼかしたり、拡大縮小したりした後の最終的な場面。ちなみに右の画像は一枚の絵のように見えるけど、左で表示されている構成部品が折り重なっている状態。

特に難しい作業はしてない。上記に挙げたリンク先の解説を読めばわかるけど、本当に基礎の基礎みたいな作業。ただキー操作が慣れるまでは時間が掛かるかも。まあ、どのソフトにも言えることだけど……。

しかし、Inkscapeを久々に使ったので、しばらく細かい使い方が思い出せなかった……。orz

 

で、球体や影、文字の三つの構成部品に分けてエクスポートして、PNG画像にしたのが下の画像。この後、AviUtlを使って加工編集するので、『PNG画像』で画像を書き出した。

20110507194713

20110508052404

個々の部品のエクスポートの方法はエクスポートしたい部品を選択して、『ビットマップにエクスポート』を選択し、その中にある『選択』を選び、ファイル名をつけて書き出すだけ。

一応、部品を組み合わせたものもエクスポートしてある。まあ、この後のAviUtlの加工編集で使わなかったけど。……素材ってそんなもの。折角、用意しても使わないなんてザラにあるので気にしてはいけない。...(´З`)チェッ

ちなみにエクスポートしたPNG画像の色調補正やその他の処理等が必要であればGimpなどを使って行う。また、AviUtlの加工編集には大きすぎた場合、おてがる画像変換で縮小する。

今回は補正するほどのものでもないし、縮小するほど大きな画像ではなかったので、Gimpやおてがる画像変換は使わなかった。

作成した素材を使った加工編集作業

素材の作成が終わったら、いよいよAviUtlによる加工編集作業。

Inkscapeを使って作成したPNG画像を、AviUtlで読み込み、拡張編集プラグインの各機能を使って加工編集したのが下記の画像。簡単なアニメーション作りで、前回の記事に沿って言えば、InkscapeでエクスポートしたPNG画像を使って、簡単な紙芝居系の動画を作成をしたということになる。

20110507234326

AviUtlでしたことは、

  1. 背景を入れて、色を真っ白に。
  2. 背景の上下をクリッピングして白の部分を16:9に。(敢えて4:3で設定して16:9となるようにした)
  3. 素材として作った文字、球体、影の画像をそれぞれインポート。
  4. その後、インポートした各パーツをグループ制御下に。
  5. 拡張編集の中間点機能を使ながら、それぞれのパーツに移動や拡大縮小、回転を指定したり、アニメーション効果『弾む』を付加。
  6. タイトルになる文字を入れ、フェード効果を追加。
  7. 編集加工したものをプラグインのx264出力(GUI)Exを使って、MP4(H.264+AAC)で書き出し。

といった感じ。これまた基礎の基礎みたいなことだけ。

 

で、下の画像が作成したオープニング用の動画を時系列に沿って切り出してみたもの。

1 6
0010000 0010500
2 7
0010100 0010600
3 8
0010200 0010700
4 9
0010300 0010800
5 10
0010400 0010900

 

画面の右上から球体(ブログタイトルが周囲を回転している)が跳ねながら近づいてきて、画面の左にぶつかり、それから右へ移動。その後、球体は画面の下に転がり落ちて消え、オープニング作りの文字が浮かび上がってくる。といった感じの二十秒程度の動画。

ちなみに一度、球体が上に跳ねるときに影が小さくなるようにしてみたが、いまいちだったので止めた。

拡張編集プラグインの基本的な使い方については、さつき - ニコニコ大百科(超おすすめ★)や【AviUtl】部分フィルタ + モザイクの補足【拡張編集】を参照に。







関連記事
スポンサーサイト

Newer Entry【AviUtl】Inkscapeを使ってオープニング動画作成2【初心者用】

Older Entry【まとめ】簡単に高画質動画の作成・編集・加工・変換 2011年版【初心者用】

Comments


Trackbacks

 
06 2017
SUN MON TUE WED THU FRI SAT
- - - - 1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30 -

05 07


 
 
PLAY ARTS改 BATMAN™: ARKHAM KNIGHT バットマン™
PLAY ARTS改 BATMAN™: ARKHAM KNIGHT バットマン™ PVC製 塗装済み可動フィギュア
 
注意事項

紹介されているフリーソフト、スクリプトをインストールするときは、フリーソフトの説明および注意事項を熟読し、自己責任においてご利用下さい。



記事:Amazonギフト券の期限など
特価情報:各ジャンル・タイムセール

 
ワンパンマン 戦慄のタツマキ 1/8スケール PVC製 塗装済み完成品フィギュア
 
配布中のAviUtl用のZIPがDLできない件
どうもzipを置いていたサイトを単なるファイル置き場にしてしまったのが悪かったようで、直接ブログからダウンロードできなくなってしまったようです。 ファイルを保存していた『ultramarinepig.web.fc2.com』の

トップページ(リンク)

に各DLLへのリンクを貼ったリストを作りましたので、ブログのDLの項目からダウンロードできない場合はそちらからダウンロードしてください。

ファイル名はブログのDLリンクに表示されるものと同じですので、それを選択してもらえれば……お手数ですが、よろしくお願いします。m(_ _)m
 
オススメ
















 
 
人気記事
 
 
ブログ内検索
記事を探すときは、キーワードで検索をかけると速くて便利です。
 
 
 
ブログ内検索
記事を探すときは、キーワードで検索をかけると速くて便利です。
 
 
動画編集・3DCG向け自作PC構成2017夏(Ryzen R7 第一世代)
8コア16スレッドのAMD Ryzen R7 1700で組むコスパの良い自作PC。

注意点としては現在発売されているRyzenはAPUではなくCPUなので、GPUが必須であること。また、CPUクーラーはAM4(Ryzenの規格)に未対応のものがある(下記のH60はOK)ため、メーカーの公式サイトで対応状況を要確認。

現在、未対応でもオプションのプラケットが発売されることもあるようなので、今使っているCPUクーラーが使えないとは限らないことも留意。

(AM4 Ryzen対応)



記事:CPUの『殻割り』に使うグリスの候補【OC 殻割り】



 
オススメのフリーソフト
ブラウザ(お好みで。複数可)
Firefox
Opera
Sleipnir
ファイアウォール(必須)
Comodo Internet Security
ZoneAlarm
Outpost Security Suite FREE
アンチウィルスソフト(必須)
avast! 4 Home Edition
avira 無料版
AVG Anti-Virus Free Edition
レジストリ保護&クリーナー(必須)
Spybot-S&D
CCleaner
圧縮・解凍ソフト(必須)
Lhaplus
7-Zip
オフィスソフト
OpenOffice.org
LibreOffice
TeraPad
メーラー
Thunderbird
オンライン・コミュニケーション・ツール
Open Live Writer
Skype
Windows Live メッセンジャー / MSN メッセンジャー
Backup & PartitionEditor
EaseUS Todo Backup Free
EaseUS Partition Master
コーデックパック(どちらか)
K-Lite Codec Pack
 
Combined Community Codec Pack
各エンコーダ&デコーダ、スプリッタ(競合注意)
ffdshow
Xvid Codec
qaac Codec
x264vfw
Haali Media Splitter
LAV Splitter
webm
Google VP8 Video For Windows codec
動画音楽再生プレーヤー(複数可)
MPC Home Cinema
GOM PLAYER
SMPlayer
VLC media player
動画加工編集ソフト
Windows ムービー メーカー
Windows Media エンコーダ
MP4Cam2AVI
Any Video Converter フリー版
CamStudio
SEffect
x264vfw
AviUtl
AviUtlのプラグイン
MediaCoder
Nero AAC Codec
Avidemux.org
真空波動研 Lite
えこでこツール
XMedia Recode
グラフィックソフト
Blender
Inkscape
GIMP
PlayMemories Home
FireAlpaca
HTML&ブログ制作
ez-HTML
Windows Live Writer
FFFTP
WinShot
Aptana | Studio
AviUtl
AviUtlの基礎構成ファイルDL
その他、色々と……
DataRecovery
CPU-Z
CrystalDiskMark
CrystalDiskInfo
 
 
QRコード
QRコード
 
プロフィール

Ψ(`∀´)Ψケケケ

Author:Ψ(`∀´)Ψケケケ
現在はAviUtl用の駄スクリプトを書いて配布中。使用は自己責任でお願いします。

 
 


ARCHIVE RSS