超簡単!Processingの制作物を動画ファイルに書き出す方法

processing

やすのり
どうもこんにちは!Tekito styleを運営しているやすのり(@98nasi_nori)です。Processingをほそぼそと勉強中です。

Processingで制作していると、せっかくの作品を動画に書き出したい!そんな方も多いかなと思います。

Processingでの動画の書き出しは実は簡単にできます!

ということで、今回はその方法をステップごとにご紹介していきます。Processingを勉強中の方はぜひご参考下さいね。

Processingで動画を書き出す方法

Processingで動画を書き出す方法は以下の3ステップです。

1. コードの差し込み

Processingで動画を書き出す方法

まずが出力したい作品のコードのdrawの部分の最後に、

saveFrame(“frames/######.png”);

の文を差し込みます。この一文加えることで、作品を画像ファイル(png)として書き出すことができます。コードを差し込んだら、「再生」をクリックします。

2. framesフォルダの確認

Processingで動画を書き出す方法

再生すると、対象となる作品のファイルと同じフォルダの中に「frames」のフォルダが作成されます。再生している間、その中に作品のpngファイルが作成されます。

3. ムービーメーカーで書き出し

Processingで動画を書き出す方法

pngファイルが作成されていることを確認できたら、いよいよ動画に変換させます。

まずはProcessingのメニューにある「ツール」から、「ムービーメーカー」を選択します。

Processingで動画を書き出す方法

ムービーメーカーの設定画面が表示されます。

「Drag a folder with image files into the field below」の欄には、先ほど作成された「frames」フォルダがあるパスを選択します。

Processingで動画を書き出す方法

幅と高さは出力される動画のサイズです。任意のサイズを設定します。またFramerateも任意のものを設定します。通常は30ほどで問題ないですが、独自の数値をコード中に設定している場合はそちらを入力しましょう。

また音楽ファイルも動画に設定できますので、もし音源などあればファイルのパスを設定しておきましょう。

設定が完了したら、「Create Movie」を選択します。

Processingで動画を書き出す方法

最後に動画を書き出す箇所を指定し、「保存」を選択します。

Processingで動画を書き出す方法

すると書き出しが始まり、進行中の画面が表示されます。

【まとめ】Processingで動画を書き出すのは超簡単!

以上でProcessingで制作したものを動画に書き出すステップは完了です!

動画として書き出してみると、また違った見え方ができますよ。制作した作品があれば、せっかくですのでぜひ動画として書き出してみてはいかがでしょうか。

Processing初心者におすすめな定番参考書籍 ↓↓
これを読んでおけばProcessingの基礎が身につきます。学習を始めたばかりの方はぜひ目を通しておきましょう!

デザインやProcessingについて学ぶなら ↓↓

ABOUT US
やすのり
マーケター/ プロダクトマネージャー(@98nasi_nori )。ときどき旅人な91年生まれ。早稲田大学卒。都内ベンチャー企業にてマーケティングマネージャー、WebプロダクトのUI/UX改善の企画・PMなど担当。フルリモート勤務。もともとWebライター・編集者。開発やデザインも細々と勉強中…。学生時代は1年間の世界一周経験あり(過去約40ヶ国訪問)。お気に入りの国はベトナム、モロッコなど。好物は家系ラーメンとタピオカ。趣味は温泉とコワーキング巡り。
プロフィール詳細