一緒に勉強系や筋トレ系の動画でよく見るカウントダウンタイマー。
実際に自分の動画でも作ろうとしても、素材がフリーではなく有料のものばかりでした。
自分なりに諸々調査した結果、一番楽にカウントダウンタイマーの素材が作れる方法を見つけました。
動画用のカウントダウンタイマー素材の作り方について、本記事にて解説していきます。
この記事は以下のような方を対象者としています。
- Youtuberの方
- カウントダウンタイマーの素材を欲している方
- 動画でカウントダウンタイマーを組み込みたい方
目次
前置き : カウントダウンタイマーとは?
最近勉強系や筋トレ、ヨガ系の動画でも表示されているタイマーのことです。
実際に自分でもこのような動画を作りたいと思っても、探してみるとなかなかフリーの素材は少ないと思います。
今回の方法であれば、30分くらいで簡単にタイマー素材作りの準備ができます。
また余談ですが、最近一緒に勉強の動画を作成しチャンネルにアップロードいたしました。
Lofi系BGM(リラックスできるHiphop系のBGM)と雨音をかけ合わせて、なるべく勉強に集中できる動画を作りました。
ぜひよろしければ、動画を見ながら一緒に勉強していただけますと幸いです。
動画用のカウントダウンタイマー素材作りで必要なこと
今回の記事で紹介するカウントダウンタイマーの作り方は下記の通りです。
- Pythonでカウントダウンタイマー用のスクリプトを書く
- ターミナルの背景色をライトグリーンに変更(透過用)
- QuickTimerPlayerでタイマーを画面収録する
- Keynoteに撮影したタイマー動画を添付+動画書き出し
一見難しそうに見えますが、なるべくコピペでできるように解説していきます。
今回の記事のやり方なら、30分用タイマーや5分用タイマーなど自分の用途に合わせて自由に素材を生成することができます。
Python3のパッケージのインストール
まずはカウントダウンタイマーを表示するためのスクリプトを準備しましょう。
プログラミングが必要になりますが、基本的に後述しているソースコードのコピペで終わりです。
また、念のため私のPCの情報も載せておきます。
- OS : macOS Big Sur Ver11.1
- PC : MacBook Pro (13-inch, M1,2020)
- chip : Apple M1
- Memory : 8GM
それではまずはHomebrewを使ってpython3のパッケージをインストールします。
Homebrewとはパッケージ管理ツールのことで、こちらを使って開発で必要なパッケージをインストールできます。
もしbrewをまだインストールされていない場合は、こちらの公式にあるコマンドを実行してHomebrewをインストールしてください。
Homebrewのインストールが完了したら、下記コマンドをターミナル上で実行してください。
1 |
|
正常に処理が完了したら、下記コマンドを実行しpython3コマンドがインストールできたことを確認しましょう。
1 |
|
上記コマンドで特にエラー等が表示されていなければ、問題なくインストールができていると思って大丈夫です。
Pythonでカウントダウンタイマー用のスクリプトを書く
では続いてカウントダウンタイマー用のスクリプトを準備しましょう。
エディターを開き、timer.pyというファイルを作成し、下記をコピペして保存してください。
下記コードはhowCodeさんの動画を参考にしました。
1 |
|
保存したら、正常にカウントダウンタイマーが動作するか確認しましょう。
下記コマンドを実行するとユーザ入力が求められると思いますので、自分の設定したい時間(単位:秒)を入力してください。
参考までに1時間の勉強動画用のタイマーなら3600、30分の筋トレ動画用のタイマーなら1800と入力すればOKです。
今回は10秒のタイマーを作る想定で設定します。
1 |
|
こちらの添付gifのように、タイマーが動作すれば成功です。
ターミナルの背景色をライトグリーンに変更(透過用)
タイマースクリプトの動作確認ができたら、次にターミナルの背景色をライトグリーンに変更します。
理由は動画上でタイマーを表示する際に透過処理をするため、背景を緑色(グリーンバック)にします。
この時、同時にタイマーのフォントも変更することができます。
自分の動画スタイルに合わせて、フォントも変更するとより個性があるタイマーにできると思います。
まずはターミナルを開き、Preference(設定)を開きます。
すると、添付画面の通りフォントの設定とターミナルの背景色の設定ができます。
ここで背景色をライトグリーン、フォントを自分の好きなものに設定します。
また、フォントカラーは白色が見やすくて良いかなと思いましたので白色に変更しています。
ターミナル上のテキストを拡大する
デフォルトではターミナルに出力されるテキストは非常に小さいです。
こちらのテキストのサイズでは動画に実際に貼り付ける場合に文字が小さすぎて見えません。
また、撮影した動画を拡大することもできますが、その場合画質が荒くなるのでおすすめはできません。
そのため、ターミナルの出力されているテキスト表示を拡大しましょう。
Macの場合はCommand+プラス(+)ボタンを押すことでテキストを拡大できます。
QuickTimerPlayerでタイマーを画面収録する
ターミナルの設定を変更したら、次にタイマースクリプトを実行しそれをquickTime Playerで画面収録をしましょう。
この時、必ずタイマーの部分のみ選択して画面収録を行うようにしてください。
こちらの添付gifのようにタイマーのフォント部分を写すようにすれば大丈夫です。
失敗例も載せておきます。
こちらのようにタイマー部分以外は不要ですので、うまく映らないようにQuickTimer側で調整してください。
画面収録が完了したら、そのまま保存してください。
Keynoteに撮影したタイマー動画を添付+動画書き出し
続いて先ほど収録した動画をKeynoteを使ってタイマー動画をmp4形式でファイル出力します。
Keynoteを開いて新規作成を選択し、デフォルトのテキストを全て削除してください。
その後、先ほど収録したタイマーの動画をドラッグ&ドロップで貼り付けます。
そして自分が動画でタイマーを表示したい場所にタイマーを配置します。
続いてKeynoteの背景もタイマー動画に合わせてライトグリーンに変更します。
この時、タイマーの背景と同じカラーコードを設定するようにすると透過時の粗がなくなります。
上記設定が完了したら、ファイルのエクスポートをしてタイマー動画を生成します。
iMovieにてタイマー動画を透過処理する
上記でタイマー動画を作成できたら、あとは自分の使っている動画作成ツールで透過処理を行います。
私はいつもiMovieを使っているので、今回はiMovieを使う前提で説明を行います。
他の動画作成ツールでも、グリーンバックによる透過処理ができれば今回の方法でタイマー素材を使えると思います。
iMovieを開いて、タイマーを表示したい動画を開きます。
続いて、タイマー動画をドラッグ&ドロップしてタイマー表示したい動画の上に持ってきます。
そうしたら、添付赤枠のグリーンバックを選択してください。
これにより、タイマーのライトグリーン部分が透明化しタイマーのテキストのみが表示されるようになります。
さいごに
ここまでお読みいただきありがとうございました。
結構色んな動画でよく見るこのカウントダウン式のタイマーですが、なかなかフリーで素材が落ちていないと思います。
今回紹介した方法を使えば、自分の用途に応じてカスタマイズしたタイマー素材を作れるので便利だと思います。
僕のブログサイト「kzy.tech〜日本脱出のための教科書〜」がどのようなサービスで作られているかが気になる方は以下別記事にてご説明していますので、ご覧いただけますと小躍りして喜びます💃
また、海外移住の 英語とプログラミングを習得することを推奨しています。
これは私の経験則から言えることですが、上記二つのスキルがあれば海外移住は絶対に実現できます。
以下に僕が実際に使って効率よくプログラミング学習ができるおすすめサービスを載せます😌
速習!おすすめプログラミング勉強法【Udemy】
いくつかプログラミング学習サービスを利用しましたが、一番効率よく勉強できると感じたのはUdemyでした。
Udemyでは動画での説明や解説等もあり親切で、学習教材も豊富にあることから プログラミング初学者の方が短期間でエンジニアを目指したいのであれば、非常に良い教材だと思います。
ちなみに私は文系卒で社会人になってから独学でudemyを使ってプログラミングの勉強をして、実際にエンジニアとして採用されました
Udemyのコースは1つ1,000円ほどなので、ITの参考本を一冊(3,000円)を買うよりもUdemyのコースを購入する方が安い上により効率的にプログラミングを勉強できると思います。
世界最大級のオンライン学習サイトUdemy
また、別記事にてダナンでの生活やIT関連についても記事を書いていますのでクリックいただけると嬉しくて踊ります💃