【json・php・python・GoogleSlides】画像スライドをテンプレ処理で大量生産する方法

はじめに

Youtubeなどの動画サイトで公開するための講義動画を作成するときに、ひとつひとつ手作業でスライドを作ってもいいのですが、なかなか面倒です。

デザイン(装飾など)を1箇所変えたら、他のスライドでも同じ変更をしてマワラキャならないなんて控えめに言って地獄です。

自分の趣味で作っているのなからまだしも、依頼案件などで作っている場合、やっぱこうして、やっぱああして…と言われるたびに全スライドを編集するなんてしてたら魂が死んでしまいます。

そこで、複数のツールやプログラミング言語を組み合わせて、型(テンプレ)を決めて大量にスライドを生成するための手順を整理してみます。

各項目は順次もっと具体的に膨らましていきます。

1、テキストデータをjsonで構造化

  1. 全体の構造・大きさを把握する
  2. ループ処理を意識する
  3. php側で再現できるデータはjsonには組み込まない

2、phpでjsonを読み込んでhtmlとして再構造化

  1. 全体の構造・大きさを把握する
  2. ループ処理のの入れ子構造を把握する
  3. cssを意識してID・クラスを設定する

3、cssで整形

4、ブラウザキャプチャで画像生成

①html5のcanvasを使う方法

  • レイヤー構造によっては表示がずれる
  • htmlの表現と完全に互換性があるわけではない

②chromeの要素画像化を使う方法

  • 表示されている領域でしか処理してくれない
  • 表示を縮小して実行すると生成画像も縮小される

③chromeアドオンのページスクショを使う方法

  • 全てが繋がって一つの画像として生成される
    → 画像切り分けが必要

5、python3のopencvで画像を切り分ける時のコツ

  • 画像生成の段階でmarginとpaddingを0にしておく
  • ファイル読み込みをinputで
  • 保存の段階でフォルダがなければ作成

6、GASでフォルダ内画像からスライド生成

  • Google driveのフォルダにアップロード
  • フォルダIDを指定してgetfileでファイル一覧を配列で取得
  • 配列をファイル名でソートする
  • ループを組んで新しいスライドに画像を配置

7、スライドに切り替え設定

  • 自動化できない
  • 複数同時設定できない

8、画面録画で音声と画面を合わせる

終わりに

というわけで、4つの技術をちょっとずつ組み合わせて、8つのステップを踏んでいけば、比較的楽に大量スライドを生成できてしまうということですね。

各項目の具体的な説明が完成するまでしばしお待ちください。

コメント

タイトルとURLをコピーしました