• MainMenu Menu
  • CategoeyMenu Download
  • cart Cart
  • MyPage MyPage
  • pc ViewPC
  • HOME HOME
完成画面レイアウト

コマ撮り風ムービーを作る

テレビで取り上げられたり結婚式の余興ムービーで上映されたりなどで、コマ撮りムービーを見る機会が割りと身近になりましたね。物やキャラクターを少し動かしては撮影して、少し動かしては撮影して・・・を何度も何度も繰り返していき、最後に写真を全てつなげてムービーにする、というアレです。
皆さんも一度は目にされたことがあるかもしれません。

今回こちらのページでは、そんなコマ撮り(ストップモーション)”風な”動画を「ペイントとLiveムービーメーカーだけで自作する」アイデアをご紹介させて頂きます。

このページのアイデアでは以下のようなムービーを作ります

あくまでもコマ撮り”風”、ストップモーション”風”の表現となります。

よくYoutubeなどで見かける本物のコマ撮り(ストップモーション)映像は、実際の現実世界の中で物やキャラクターを動かして撮影したものをつなげて行きますが、今回こちらのページでは、現実世界での撮影は一切行わず、手元に既にあるデジカメの写真を使って、ペイントとムービーメーカーの中だけで編集を行っていきます。
カクカクとしたコマドリ風の動きを取り入れて行きたいと思います。

クレイアニメなどに代表されるストップモーションやコマ撮りの正式な定義は、恐らく1コマずつカメラで撮影することとなっているかと思いますので、あくまでもこちらのページのカメラを使わない作成方法では、コマドリ”風”、ストップモーション”風”という事でご紹介させて頂ければと思います。

用意する物

  • 切り取り済みの画像データ(ペイント内で切り取る方法はこちらのページ
  • ペイント(Windowsの方は標準で入っています)
  • Liveムービーメーカー(Windowsの方は無料でダウンロードが出来ます)
  • 作るために技術力はほとんど必要ありませんが、根性と時間が欠かせません

写真の切り取りはペイントでもざっくりであれば比較的簡単に可能です。こちらのページではすでにペイントを使って切り取ってある、背景が白で塗りつぶされている状態のPNG画像を利用します。
ペイントを使った画像のトリミング方法についてはこちらのページで詳しく紹介されています。

ペイントで切り取った背景が透明ではないONG画像

ペイントで切り取った背景が透明ではないPNG画像

編集のおおまかな流れ

  1. ペイント内に切り取り画像を配置します
  2. 少し動かして画像の保存、を繰り返します
  3. 保存した画像をムービーメーカーに読み込み、1つのムービーとしてつなげて完成させます。

ペイントの中では、画像を自由な位置に動かしてレイアウトを作ることが出来ます。少し動かして保存、少し動かして保存、という繰り返しなので、操作もとても簡単で単純です。

では早速編集を開始していきます。

1.ペイント内に切り取り画像を配置します

1.画像を読み込みます

まずはペイントを起動し、ペイント内で利用する切り取り画像を読み込みます。
「貼り付け」「ファイルから貼り付け」と進みます。

画像の読み込み

画像の読み込み

表示されるダイアログボックス内で、お好みの写真を選択して読み込みます。

画像を選択します

画像を選択して読み込みます

すると選択した画像ファイルが、ペイント内に読み込まれます。

画像が読み込めました

画像が読み込めました

2.背景を透明にします

同じ要領で他の画像も読み込む事が出来ますが、以下の画像をご覧頂くと分かるとおり、ペイントで切り抜いた画像ファイルは背景が透明の画像ファイルとして保存されていないため、白い背景が表示されてしまい、背景の画像が隠れてしまっています。複数画像を配置する場合には、この白い背景を消します。

他の画像も読み込みを行います

複数画像を読み込んだ場合は、背景を透明にします。

「選択」メニューから「透明の選択」を選択します。

「透明の選択」オプションをONにします

「透明の選択」オプションをONにします

これだけで、背景の白い部分を消すことができます。

背景を透明にすることが出来ました

背景を透明にすることが出来ました

3.画像を”重ねずに”配置します

ペイントでは、一度重ねてしまった画像を再度分離することが出来ません。
そのため複数の画像を読み込む場合には、画像同士が重ならないように配置する必要があります。

画像同士が重ならないように配置します(重要)

画像同士が重ならないように配置します(とても重要)

2.配置した写真の動かし方

1.「自由選択」でお好みの画像を囲みます

ではここから読み込んだ画像を実際に動かして、コマ撮り風(ストップモーション風)の動画のようにしていきます。
ペイント内で「選択」メニューから「自由選択」のツールを利用すると、マウスで囲んだ範囲だけを選択することが出来ます。

「自由選択」ツールで自由に範囲を指定します

「自由選択」ツールで自由に範囲を指定します

選択した画像の範囲をさらに横方向にドラッグしてみると、その部分だけを移動させることが出来ます。
このテクニックを使って「少し動かしては保存、少し動かしては保存」の手順を繰り返していきます。

囲んだ範囲を移動させることが出来ます

囲んだ範囲を移動させることが出来ます

※画像を囲むときの注意点1

自由選択の機能では、選択した範囲だけが選択されます。画像の全体を確実に覆う形で選択を行わないと、画像の一部が切れてしまいます。

画像の全体を囲んでいない悪い例

画像の全体を囲んでいない悪い例

画像全体をしっかり覆う形で選択しないと、移動させたときに以下の画像のように一部が切れてしまいます。

画像の一部分が切れてしまいます

画像の一部分が切れてしまいます

※画像を囲むときの注意点2

画像同士を重ねてはいけません。
ペイント内では、各画像同士を重ねてしまうと、再度分離することができません。画像同士は必ず重ならない位置に配置する必要があります。
例えば以下の画像のように画像同士を一度重ねてしまうと・・・

画像を重ねてしまうと分離できない

画像を重ねてしまうと分離できない

下に重ねてある他の画像も一緒に切り取られてしまいます。

一度重ねると分離して処理は出来ません

一度重ねると分離して再処理は出来ません

3.編集を開始していきます

1.1コマ目の画面レイアウトを作ります

ここからはどのようなストップモーションアニメーション、画面構成を作っていくのかによって、皆さん異なる部分です。画面配置は必ずしも同じである必要はありませんので、自由な位置に写真を配置して、オリジナルのコマ撮り風動画を作成されてください。
このページでは1コマ目として以下のような画面レイアウトを作ります。

1コマ目の画面レイアウト

1コマ目の画面レイアウト

2.1コマ目の画像を保存します

1コマ目で作成した画面レイアウトを、画像ファイルとして保存します。ペイント内の保存メニューからお好みの形式で、お好みの場所に保存を行ってください。

1コマ目の画面を保存します

1コマ目の画面を保存します

3.画像を少し動かして、2コマ目、3コマ目と続けて保存していきます

画像を少し動かして、2コマ目の画面レイアウトを作ります。
遠くに移動させればさせるほど、ムービーで見たときに早い動きになります。
反対に少ししか移動させなければ、ムービー内ではゆっくり動いているように見えます。
あまり近くても手順と回数が増えて大変なので、作りたい表現に合わせて適当な距離で移動させます。

画像を少し動かして再度保存します

画像を少し動かして再度保存します

ペイントの画面内からはみ出した状態で一度保存を行うと、はみ出した部分が一度消去されてしまいます。[Ctrl+Z]やペイント内の「元に戻す」ボタンから、画像を画面からはみ出して保存したレイアウトの1つ前に戻すと、次のコマをサクサクと作っていくことが出来ます。

また画像を動かして、保存を行います

また画像を動かして、保存を行います

4.ひたすら移動と保存を繰り返します

この「ひたすら繰り返す」という根性と忍耐力が要求される部分も、実際のコマ撮り(ストップモーション)動画と、同じですね。非常に面倒です・・・笑

30枚程度でもタイトルぐらいは作成できますので、希望を持って根気よく移動&保存を行ってください。

少し動かして保存、を繰り返します

少し動かして保存、を繰り返します

4.タイトルテキストも追加します

ペイントの本来の使い方である、絵を描く機能を駆使して、実際にタイトルを描いてみても良いかと思います。今回こちらのページではタイトル用のテキストもペイントの文字入力の機能を使って入力します。

タイトルを入力します

タイトルを入力します

画面上部から降りてくるアニメーションにしたいと思いますので、写真の時と同じ要領で、画面上部から少しずつ降りてくる動きを加え、保存を繰り返します。

画面の上部から少しずつ降りてくる動きを加えました

画面の上部から少しずつ降りてくる動きを加えました

5.ムービーの最後でループ表示する2枚を作ります

最後に、完成レイアウトから微妙に位置をずらした2枚の画像を作成します。
微妙に位置をずらした画像を2枚交互に表示させると、簡単に動画の尺をオシャレに引き伸ばすことが出来ます。

微妙に位置をずらして保存を行います

最終位置から微妙に位置をずらして保存を行います

合わせてタイトルの文字も文字単位で選択して微妙に位置をずらしておくと、後でムービーとしてみたときにポップな印象を与えることが出来ます。

文字単位で選択して位置を微妙にずらします

文字単位で選択して文字の位置も微妙にずらします

ここまでで出来ている画像ファイルを確認

このページで作成しているムービーでは、ここまでで52枚の画像を保存しました。
「1」から順に、番号をふって画像を保存していくと、この後のムービーメーカーでの作業が非常にスムーズに行きます。間違って上書き保存等を行ってしまっていないかも確認しておきましょう。

ここまでで出来ている画像ファイル

ここまでで出来ている画像ファイル

6.ムービーメーカーで全ての画像をつなげます

画像の読み込み

ムービーメーカーを起動し、ここまでで作成してきた1コマ1コマの画像ファイルを全て読み込みます。
ムービーメーカー内の操作については他のページでも詳しく説明させていただいているので、こちらのページでは省略させていただきます。

ムービーメーカーにまとめて読み込みます

ムービーメーカーにまとめて読み込みます

再生時間を調整します

全ての写真を選択した状態で、再生時間の調整を行います。
動きに合わせて微妙に調整していかれるのが良いかとも思いますが、今回は一律でまとめて「0.3」と入力してみました。

1コマ1コマの再生時間を調整します

1コマ1コマの再生時間を調整します

最後に作成した繰り返す2枚を、交互になるように複製して配置します

完成したレイアウトから、ほんの少しだけ動かしたレイアウトの組み合わせを2枚作成しました。
この2枚を複製して、交互に配置します。
2枚をコピーして、ムービーの最後に貼り付けを行っていきます。

ループする2枚を交互に配置します

ループする2枚を交互に配置します

最後は2枚をひたすら繰り返します

最後に2枚を繰り返します

2枚を複製して配置することが出来ました

完成動画

冒頭に配置されているムービーと同じものになりますが、これらをつなげて再生すると、以下のような動画になります。ひとコマずつ作ってきた画像が1つのムービーになる瞬間はとても楽しいですね。

 

AfterEffectsテンプレート内ではコマ撮り風のアニメーションも加えられます

今回こちらのページではペイントとムービーメーカーだけを使って、1コマ1コマ画面のレイアウトを作っていってコマ撮り風のアニメーションを地道に作り上げていく方法をご紹介させていただきました。一コマずつ作っていくことで、比較的自由なレイアウトを作ることは出来ましたが、同時に編集時間も長く要求されました。

AfterEffectsテンプレート内でも画像を切り取って、同じようなコマドリ風の映像表現を作ることももちろん可能です。
NONNOFILMの製品版AfterEffectsテンプレートでは、テンプレート内で写真を切り取って、簡単にアニメーションを加えることも出来ます。NONNOFILMのオリジナルプリセットファイルをうまく活用すると、こちらのページで作成したのと似たようなコマ撮り風の表現を作るのも、数分程度しかかからないかもしれません。

画像を切り取ったり、アニメーション処理もテンプレート内で簡単に行えます

画像を切り取ったり、アニメーション処理もテンプレート内で自由に行えます

お試し用の無料テンプレートも公開されていますので、まだお試しでない方はそちらもどうぞご利用ください。
※お試し版では自由なアレンジを行うことは出来ません。

コルク風プロフィールムービー

作り方のまとめと復習

必要なもの

  • 切り取り画像
  • ペイント(Windows標準ソフト)
  • Liveムービーメーカー(Windowsユーザーは無料ダウンロードが可能)
  • 作るために技術力はほとんど必要ありませんが、根性と時間が欠かせません

作り方・手順

  1. 画像の切り取りを行います
  2. ペイント内で1コマ1コマレイアウトを作り、画像の保存を行います
  3. ムービーメーカーに全ての画像を取り込み、1つのムービーにまとめます

ペイント内での注意点

  • 画像の選択は、画像全体を確実に覆う必要があります
  • 画像同士が重ならないように注意する必要があります
  • 画像は番号をふって保存をしておくと、ムービーメーカーで楽が出来ます

ムービーメーカー内での操作

  • 一括して画像を読み込んだら、後は再生時間の調整だけで、基本的には完了です
  • 最後に似たレイアウトの画像を2枚交互に表示させると、ポップでオシャレなタイトル画面を作ることが出来ます

ペイントとムービーメーカーを組み合わせて使うことで、コマ撮り風(ストップモーション風)の動画を作ることが出来ました。GIMPやPhotoShopさらには、AfterEffectsテンプレート内で出来ることのほうが圧倒的に多いのは確かなのですが、完全に無料で操作もとても簡単な編集方法ですので、これからオリジナルウェディング余興ムービーの自作を考えておられる方は、ひとつのアイデアとして参考にされてはいかがでしょうか?

 

人気の無料お試しテンプレートもダウンロード

関連するページ

1.素材の読み込み 2.素材の全画面表示 3.ズームをつける 4.動画の書き出し ⑧BGMの挿入はムービーメーカーで行います。 1.BGMはムービーメーカーでタイトルやコメントの…

1.素材の読み込み 2.素材の並び替え 3.トランジション設定 4.タイトルの作成 5.コメントの挿入 6.BGMの挿入 7.動画の書き出し 8.出力した動画の確認 旧ムービーメ…

1.素材の読み込み 2.素材の全画面表示 3.ズームをつける 4.動画の書き出し ① まずはダウンロード。 1.フォトストーリーをダウンロードしてきましょう。 2.インストールし…

結婚式ムービープロフィールビデオに使い易そうなフォントを時々ご紹介しています。 今回は映画の字幕風フォント「cinecaption」のご紹介です。 映画の字幕で時々見かけるデザイン…

Comments are closed.

Post Navigation