秘密のネタ帳

別に秘密でも何でもない

アイマス人力ボカロメドレー合作振り返り 後編

後編です。

前編にも増して、誰向け?みたいな内容になってきました。

一番は自分の備忘録です。

タイムライン制御

前編で、アセット + シーン作りを開設しました。ここから、MV にしていきます。

Unity の Timeline を配置して Animation Window でカーブを編集していきます。

Unity のリファレンスや

Using Visual Effects with Timeline | Visual Effect Graph | 12.1.12

こちらの記事を参考に。

【Unity】VFX GraphのイベントをTimelineで制御する

撮影用ペイン構成

タイムラインツールが機能するようになりました。

ちなみに、カーブエディタで描けるカーブは AE のようにウェイト付きではなく、ウェイト無しのベジェ曲線のようです。細かい制御は AE の方が得意。

カメラ

MV 用カメラ制御をやりやすくするために Cinemachine のプラグインを導入します。

ほとんどこちらの記事の通りにやりました。

【画像で解説】Unityを使った3DダンスMV制作かんたん入門講座|コニーログ

こちらの動画も参考になりました。

【Unity】Cinemachineを使ったカメラワークの作り方! #vrアカデミア - YouTube

Cinemachine + タイムライン制御

カメラ移動は基本的に定点の補間で行っています。各アイドル毎に「良い感じに映すカメラ」を設置して、カーブ補間していく感じです。元の動きが大きいので、手振れも大きめに入れました。

手持ち、あるいはドローン撮影のように連続的に移動するカメラを表現するのに、2点 + カーブ補間が良いアイデアだと思いました。

3D 空間のカメラ制御は、AE よりやりやすいです。

Recorder

動画の出力には、先ほどのブログ記事にも紹介があった Unity Recorder を使用しました。出力の設定はこんな感じです。

動画として出力すると画質が相当下がったので連番画像として1フレームずつ出力しています。

AE

連番画像をインポートして多少の加工をして完成!

今回は AE での加工は控えめなので任意の編集ソフトでできます。

振り返り

達成点

  • VFX Graph (GPU Particle) の利点を活かせた
    • まさに VFX Gprah が売りとする所のパーティクル大量生成、mesh との連携を活用できた
    • 同時に「なんで Unity?」の答えになる
      • MMD はこんなエフェクト (+ ライティング/ポストプロセス) は出せない
      • AE はメッシュと連携したエフェクトは作りにくい
      • UE じゃないのは趣味
  • ライティングの知見・視点を得た
    • AE で LDR/Unlit の世界に生きていると気付けない
  • モデルのモーションが無いながら、退屈の無い 3D 映像に仕上げた (と思う)
    • モーションが無いのは最初からわかっていたので、カメラとエフェクトで勝負できた (と思う)
  • 武器が増えた
    • 本記事にまとめたように、毎日目を回しながらも Unity の機能を使い倒した

技術的反省点・伸びしろ

  • Vfx が一種類しか制作できなかった
    • これまでの AE の経験からもアイデアはまだあった
    • 「キャラ・背景物の登場」に絞って作ったが、それでも時間が回らなかった
  • 雑ライティング
    • HDRI は Unity が用意しているプラグインから使えそうなものを使ってきた
      • 今回目指した、アニメとリアルの調和に合う背景は…?の答えになっているかは怪しい
    • 「とにかくそのカットを良く見せるようライトを炊く」「GI・ポストプロセスを改良・改善・チューニングする」どちらの観点からもまだクオリティアップは図れる
    • (正直、雑ライティングでも良い感じにやってほしいというのはゲームエンジンに望む所)
      • (UE5 はそうなっていってるんだろうなあ)
  • 雑半透明
    • アクリルとエフェクト、二つの半透明が無理なんてことは最初に気づくべき

まとめ

  • 現代の 3DCG をひとりでやるのは荷が重い
  • が、挑戦して得られる視点・技術・知見も多い

合作お誘いいただいたなぎなぎさんはじめとして主催の皆さま、動機をくれてありがとうございました。

ステージモデル貸していただいた mobiusP、ダンスだけでなくいつもお世話になっています。ステージ無しで完成はありませんでした。あと 3D の大変さを垣間見ました。

以上、ここまで見ていただきありがとうございます。

アイマス人力ボカロメドレー合作振り返り 前編

ニコニコ動画での、所謂ニコマスPの合作にお誘いいただきました。

www.nicovideo.jp https://www.nicovideo.jp/watch/sm42613933

こちらの動画にて、M@STERPIECE の間奏パートの映像で参加させてもらってます。

前置き

今回は、いつもの AfterEffects での制作に加え、Unity での 3D 表現に挑戦しました。

備忘録のため、制作過程をメモします。

ざっくりワークフローと使った/習得した技術

  • blender
  • Unity
    • Visual Effect Graph
    • マテリアル/ライティング
    • ポストプロセス
    • Timeline
    • カメラ制御
    • Recorder による連番テクスチャ出力
  • AfterEffects
    • 連番テクスチャからの動画化
    • 簡単な後付けエフェクト

3D や動画制作経験者の人へ

良いやり方や、ウチはこうやってるよ!があれば教えてください。お手柔らかに。

3D・動画制作の初学者や挑戦してみたい人へ

3D の動画を作るための要素を、駆け足ながら分解して一つ一つ解説しているつもりです。参考になれば幸いです。

3D や動画制作はよくわからんが見に来てくれた人へ

制作過程のスクショ多めに載せてるので、適当に楽しんでいってください。

3D アセット制作

Visual Effect Graph

合作以前から、Unity でのエフェクト表現に興味を持っていました。

AfterEffects で言うところの有料プラグイン TrapCode に匹敵するようなエフェクトを無料で作れる!と思ったのがきっかけでした。

Unityで寿司エフェクトでも作りながらVFXの新機能について語っていきたい - Unityステーション - YouTube

Unity 公式が上げている Sushi Vfx

Visual Effect Graphの新機能で広がる表現 – Unity for Pro

Unity for Pro で紹介されているエフェクト

今回は、後者で紹介されているものを少し改造してベースのエフェクトを作成しました。

Cube のエッジに沿ってパーティクル球を生成

色変えたり

こちらは Vfx Graph という Unity のノードグラフでエフェクトを組む機能に則って作っています。

ノードグラフでの制作も楽しいですが、詳細は割愛。興味がある人はリンクから見てみてください。

これで、メッシュの表面に集まったり離れたりするエフェクトができました。

3D モデル制作

今まで AE で取り組んできた 2D 映像の延長として、立体感を持ったイラストで 2.5次元的表現をしたいと思っていました。

コストや技術的に、3D キャラモデルを踊らせるダンスムービーに手が出せなかった、ということもあります。

そこで、3D 空間でのアクリルスタンド的表現に挑戦しました。

blender でのモデリング

まずは blender でのモデル制作。次の記事を参考に制作しました。

【3D】バーチャルアクリルフィギュアを作ってみよう!|DW164

↑の記事が丁寧に書かれているので、ほとんどその通りでできました。

blender の基礎的な操作は調べつつ慣れました。

ハマりポイント

ドラッグアンドドロップで全選択をしたつもりが、領域内の頂点・面の選択漏れがありました。

D&D だと漏れが発生。密度が高いとそうなるのかも

気付かず作業を進め、テクスチャを貼ったつもりが、スカスカに。

UV埋め込みの抜けによりスカスカに。真美ごめんね

最初はUVが壊れているのかと思い、かなりハマりましたが選択漏れだと気づきました。

Ctrl+L で対象面をすべて選択して解決しました。

背景モデル

自分では作れなかったので mobiusP にお借りしました。本当にありがとうございます。

Unity シェーダー&マテリアル

Unity 空間に生成。先ほど作った Vfx にもメッシュをアサイ

Unity 内にアクリルパネルっぽいものと Vfx を生み出すのに成功しました。

Vfx Graph でメッシュを参照するときは、インポートしたメッシュの Read/Write にチェックを入れる必要がある

ここから、アクリル状の屈折マテリアルと半透明マテリアルについて触れますが、最終的に採用したのは不透明マテリアルです。↑のスクショも不透明マテリアルです。

Vfx と半透明の相性があまりに悪かったためです。

供養と知見のために、検証した半透明マテリアルについても紹介します。

屈折シェーダー

ツインテの根本の背景の星を見れば、屈折の様子がわかる…?

わかりますか、この質感。理想はこれでした。

シェーダー設定

Unity Shader Graph の Surface Type を Transparent, Refraction Model を任意のモデルに設定し IOR に値を入れて屈折を実現しています。

ちなみに屈折無し不透明シェーダーとの比較。

背景が歪まない

言うほどアクリルか?そして半透明問題

半透明マテリアルを少し遠景から。言うほどアクリルか?

遠目で質感がよくわかりません。そして、半透明どうしの前後関係が保たれない大問題が発覚しました。

アクリルの奥・手前に関係なく描画される

後半のシーンで大問題になる

不透明シェーダーの採用

当初目指した質感とは異なりますが、アウトラインが太めな表現も悪くない&エフェクトとの相性が良いということで、不透明を採用しました。

半透明なんて要らんかったんや!

背景制作

MMD 用モデルを Unity に

先述の通り、ステージのモデルを mobiusP にお借りしました。

.pmx と、各種テクスチャファイルをお借りしたため、次のフローで Unity にインポートしました。

  • blender で pmx をインポート
  • blender で fbx としてエクスポート
  • Unity で fbx をインポート

メッシュ形状は問題なくインポートされましたが、マテリアル情報が落ちているようでした。

blender 側のマテリアルを確認すると、

MMDShaderDev

MMDShaderDev という MMD 用のシェーダーが刺さっています。

標準シェーダーなら、FBX 経由で blender のマテリアル情報を Unity に持ってこれるかとは思うのですが、今回はそれができませんでした。

UV 情報は正しくエクスポート・インポートされてあるであろうことと、幸いテクスチャファイルも頂けていたため、Unity で必要分だけマテリアルを作り直してアサインしました。

HDRP/Lit シェーダーでマテリアルを作成

床は Metallic と Smoothness により質感を調整。ライトはエミッシブを設定しました。

ライティング

基本的に以下のシンプルなライティングしかやっていません。

  • サンライト一灯
  • Volume の HDRI Sky (星空、ライティングの寄与は小)
  • 一部のキャラクター毎にスポットライト

カットシーンのライティング、やりだすと考えることが多すぎる。今回は初挑戦なこともあり、キャラとエフェクトを見せるにあたりの最低限を目標にしました。

ポストプロセス + α

Motion Blur

お手軽躍動感

Unity の Motion Blur の設定から、Camera Motion Blur を有効にして、カメラの動きに対しても反応するようにしました。

Screen Space Reflection

キャラの映り込みだけじゃなくライトもちゃんと反映される

床面の映り込みはすべて SSR で表現しています。

たぶん重いだろうなと思いながら、HDRP のグラフィックス設定から SSR を有効化してそれなりの高品質に設定しました。

Reflection Probe を用いたやり方も試しましたが、今回は不採用としました。

【Unity】鏡面反射する床を作成する方法【Reflection Probe】 | テクリエイト

床面の高さが異なるとき(今回で言うとシアター組7名が立っている檀上)に Probe の高さが破綻したからです。

Depth Of Field

被写界深度。重いやつ

その他のポストプロセス

  • Bloom
    • 初期設定に毛が生えた程度のパラメータ調整
  • Exposure
    • Vfx を多発して画面の明るさが頻繁に変わる都合上、自動露出補正をオフ

ソフトパーティクル

ポストではないですがこちらでまとめて説明します。

今回のパーティクル球はスプライトで表現していますが、床やメッシュとの境目で、板ポリがぶっささります。

これを良い感じにフェードするのがソフトパーティクルです。

ソフトパーティクルなし/あり比較

実装にはこちらが非常に参考になりました。理屈を知りたい方もこちらをどうぞ。

🍇 ParticleSystemとの連携(カメラ距離)|Unity ShaderGraph CookBook vol.1【ShaderGraph 入門】

グラフィックスフィーチャーの紹介は以上です。

残りの地味な話 (タイムライン、エンコード、反省&振り返り) を後編に回します。

【Stock素材制作記#2】AfterEffects 用無償プラグイン Saber を使った動画素材はストックサイトに投稿してよいのか?

Saber ってなに?

Video Copilot 社

VIDEO COPILOT | After Effects Tutorials, Plug-ins and Stock Footage for Post Production Professionals

の提供する AfterEffects 用無償プラグイン

Saber - フラッシュバックジャパン

です。

Video Copilot 社は、Saber だけでなく、数多くの AfterEffects 用のプラグインや、動画素材、チュートリアル動画を提供しています。

その中で、非常に高品質ながら無償で利用できるのが Saber というプラグインです。

ちなみに Video Copilot 社は、映画スターウォーズのCG作成にも携わっているらしく、

世界でも有数のCG/VFXの会社であることは間違いなさそうです。

利用規約奮闘記

結論

えらい人が結論から書けって言ってたので先に書くと、

Saber を使って作った動画をストックサイトで販売 (ならびに他のやり方で商用利用) することは可能です。

以下、この結論に辿りつくまでにがぉすが辿った軌跡 (ほぼ蛇足) です。

利用規約の確認1

フラッシュバックジャパンの Saber 配布サイト (リンクは上述) には、利用規約として次のようにあります。

無償プラグインを含むVideo Copilot製品を活用して作成した制作物の商用利用、販売、配布は可能です。
使用される媒体について特に制限はありません。またクレジットの表記は必須ではありません。


ただし、製品の効果を加工せずそのままの使用はできません。
例えば元から収録したり、販売されているプリセットなどのデータをそのまま出力した映像や、素材等を商用利用、販売、配布することはできません。

なるほど。使えそうやん。

しかし、次のように続きます。

またロイヤリティーフリーの素材集として商用利用、販売、配布することはできません。
ならびに同社製品自体を販売、貸与、譲渡、リース、ライセンス販売、複製配布、ストックライブラリーでの活用などすることは禁じられています。

「ロイヤリティーフリーの素材集」。

それはつまりストックサイトでの販売なのでは?

僕の中でそこに引っかかってしまったので、利用規約 (原文) に当たりました。

利用規約の確認2

Video Copilot 社によるライセンス同意書原文 → http://www.videocopilot.net/assets/public/misc/License_Agreement.pdf

フラッシュバックジャパンによる日本語訳 →
https://flashbackj.com/video-copilot-license-agreement

問題は上記の第4条です。

合わせて10回ぐらい読み直した結果、

「Video Copilot 社のソフトウェア (ここでは Saber) を使った作品は、ストックサイトでの販売はできない」

と解釈しました。

ストックサイトに溢れる Saber を使った作品たち

しかし、改めて Adobe Stock で素材の検索をすると、

間違いなく Saber で作ったであろう作品たちがヒットします。

これは、僕の理解が間違っているのか?

日本語力も英語力も、規約を読み解く力も無いので、直接凸りました。

Video Copilot 社のサポートへ

経緯を添えて、「Saber を使った作品はストックサイトで販売できますか?」の旨のメールを

日本語と英文で Video Copilot 社のサポートへ。

わずか数時間足らずで返信があり、要約すると、

「できまっせ!できへんのは再販と再配布です」

とのこと。

改めて、結論

というわけで、Saber を使った動画素材をストックサイトに投稿することは、

ライセンス的に「可能」とのことでした。

蛇足

ちなみに結論を知った上でもう一度ライセンスを読みましたが、やはり解釈できませんでした。

販売者となる上で、特にこういった著作権絡みで規約を正しく解釈しないといけないので、訓練していきたいです。

今回は、Video Copilot 社が神対応だったこと、結果的に答えを知られたこと、

そして一度は諦めた Saber を使った動画たちを販売できること、と、

色々と実り多き経験になりました。

Saber を使った動画素材は絶賛制作中なので、もうすぐストックサイトの僕のポータルに並ぶことになります。

【Stock素材制作記#1】動画ストックサイトに登録し、動画の販売を始めました

ストックサイトって何?

ストック写真 - Wikipedia

在宅でイラスト仕事ができるストックイラストってなに? – BLANK COIN

簡単に言うと

・ユーザー → 利用規約に沿った範囲で素材を購入・利用できる。定額制のサービスも多い

・クリエイター → 素材を作成・投稿し、審査に通ることで素材を販売できる

といったものです。

なんで?

Adobe CC プランを契約し、AE, Premiere Pro, Photoshop などを使い始めて約1年半、趣味の映像制作に取り組んできました。

さらなるレベルアップを図ることを考えると、高品質なプラグインの導入は必至です。

以下一例

しかし、これらのプラグインは高価です。

プロの現場で一線級で活躍するプラグインなので当たり前です。

趣味で動画制作とする身として、ある程度の成果を上げてから、

ステップアップとして有償プラグインを導入したい、という個人的な気持ちがあります。

そこで、動画制作の成果の可視化 (とお小遣い稼ぎ) のために、ストックサイトでの一定量の販売額・DL数を目標に掲げたいと思います。

ストックサイト比較

動画編集者目線でのストックサイトの紹介と比較です。

これからストックサイトへの投稿を考える人や、素材探しのためにストックサイトを利用したい人の役に立つかもしれません。

Adobe Stock

https://stock.adobe.com/jp/

  • Adobe ユーザーは導入が楽
  • 年間5000DL (動画の場合は 5000/8=625DL) をクリアすることで Adobe CC 1年間のライセンスが取得できる
  • Premiere Pro には Stock との連携機能があり、WEBフォームを介さずに投稿ができる
  • 初期登録はすぐ、アップロードした素材の審査は2~3営業日
  • 他サイトと比べると審査が厳しく、投稿される素材もクオリティの高いものが多い

Motion Elements

https://www.motionelements.com/ja/

PIXTA

https://pixta.jp/

  • 国内に強い、日本語情報が豊富
  • 動画素材に関してFTPアップロードができない
  • 初期登録に Youtube など他サイトで投稿した作品が必要
    • Youtube に限定公開で投稿した動画を送ることで初期登録は問題なく済みました
  • 動画のアップロードと審査に他サイトと比べて時間がかかる

shutterstock

https://submit.shutterstock.com

  • 海外に強い
  • 初期登録はすぐ

まとめ

というわけで、上記4サイトに登録し、動画素材の投稿を進めています。

実際の作品集やポータルページについては、準備でき次第案内予定です。

【AfterEffects】パス上にオブジェクトを配置する +α

今回作りたいのはコレです。

星型パス上にオブジェクトを配置する

事前に

gg ってみます。

惜しいのですが、やりたいことが出ません。

……ので、少し工夫して、

「パスに沿ってオブジェクトを動かす」+エクスプレッションを使って

パスに沿ったオブジェクトの配置をやってみました。

パスに沿ってヌルオブジェクトを動かす

ヌルオブジェクトを作成して、下記の要領でパスに沿って移動するようにトランスフォームを設定します。

オブジェクトをパスに沿ってアニメーション化する |

パスに沿って素材を動かすモーショングラフィックス汎用テクニック/Adobe After Effects CCでできること | カズノコブログ

f:id:ghaos_p:20210418014628g:plain

ぴったり1秒(今回は30f)で終わるように調整しておきます。

f:id:ghaos_p:20210418021441p:plain

ヌルオブジェクトの名前は parent にしました。

オブジェクトを並べるエクスプレッション

事前に、parent にスライダー制御を追加します。

f:id:ghaos_p:20210418015943p:plain

名前は オフセット とし、値は 0.05 としました。

20分割 = 1/20 の値となります。

f:id:ghaos_p:20210418021226p:plain

並べたいものを作ります。今回は小さめの赤丸にてきとうな陰影を付けてプリコンポーズしました。

f:id:ghaos_p:20210418023757p:plain

プリコンポーズしたコンポジションの位置プロパティに、以下のエクスプレッションを追加します。

f:id:ghaos_p:20210418020548p:plain

var parent = thisComp.layer("parent");
var offset = parent.effect("オフセット")("スライダー") * (index - 2);
parent.transform.position.valueAtTime(offset);

Ctrl+D で20個複製

f:id:ghaos_p:20210418021326p:plain

すると星型(=パス上)に20個配置となります。

f:id:ghaos_p:20210418021331p:plain

おまけ 振動させたい

基本波形を作る

parent に BPMVector Length を追加します。

f:id:ghaos_p:20210418022202p:plain

var BPM = effect("BPM")("スライダー");
var curve = 1 - Math.abs(Math.cos(time * Math.PI * BPM / 60));
curve * curve * 80;

キーフレーム変換するとこんな波形に(今回はキーフレーム変換やる必要はありません)。

BPM周期でピークが来る波形になっているはず……。

f:id:ghaos_p:20210418022320p:plain

角度のランダマイザーを作る

parent に 角度を追加します。

f:id:ghaos_p:20210418022658p:plain

並べたオブジェクトのエクスプレッションの更新

f:id:ghaos_p:20210418022929p:plain

var parent = thisComp.layer("parent");
var offset = parent.effect("オフセット")("スライダー") * (index - 2);
var pos = parent.transform.position.valueAtTime(offset);

var theta = parent.effect("角度制御")("角度").valueAtTime(time);
var cos = Math.cos(theta);
var sin = Math.sin(theta);
var len = parent.effect("Vector Length")("スライダー");
var x = len * cos;
var y = len * sin;
pos + [x, y];

以上でこんな感じに。

f:id:ghaos_p:20210418023137g:plain

最後に角度に適当なランダム要素を追加します

f:id:ghaos_p:20210418023433p:plain

var random = (index - 2) * parent.effect("BPM")("スライダー");
var theta = parent.effect("角度制御")("角度").valueAtTime(random + time);

index - 2 の部分がレイヤー毎に異なる値になります。

f:id:ghaos_p:20210418023659g:plain

できました。やったー

初めての自作キーボード mint60 を作る

自作キーボード初心者です。

購入

アキバの 遊舎工房 | 自作キーボード&レーザーカット&UVプリント さまにて購入
いつ行っても(と言ってもまだ二回目ですが)5人以上~ぐらいのお客さんで賑わっていて、
中には(自分含め)「初めての自作で……」と店員さんと話をしている客もおり、
自作キーボードのブームを感じます

基盤

自分の中で重視したポイントが以下二つ
・左右分割型
・60%サイズぐらい、けどアローキーは要る

アローキーは、ホームポジション崩さず打てるのはカッコいいし魅力やけど……
多用する都合、いきなり無しで効率めっちゃ落ちるのが怖かったので。

そしてこれに当てはまるもので、気になったのは
・ErgoDash → ErgoDash | 遊舎工房
・mint60 → Mint60のご紹介 - ゆかりメモ

よりシンプルなmint60に決めました。

ちなみにどちらも「初めての左右分割型キーボード」として人気だとか。

キーキャップ

これにしました(即決)なんかミントっぽかったので
MAXKEY SA DOUBLE SHOT ABS KEYCAPS | 遊舎工房

けど買ってから値段見て結構ええ値段するなと思いました
まぁせっかくなんで奮発ということで(後付け)

スイッチ

会社用で茶軸使ってたんですけどもっとカチカチ感を求めて青軸にしました f:id:ghaos_p:20200803223430j:plain

製作

作り方などは、販売者さまのサイト・ブログにあるので今更書くまでもないですね。
躓いた点と、オプショナルな部分だけピックアップ…

アクリル板の組み立て

どれをどれに重ねるのか、戸惑いました。
たぶん、奥側が高くなるように傾斜づける
f:id:ghaos_p:20200803225026j:plain のが正しい形かと。

こちらでも同様にされていました。→
Mint60キーボードを作成したらしくった話 - Qiita

LEDの光り方が変

写真だと非常にわかりにくいのですが、
片側の数個だけ別の色で光ったり、ON/OFFを押しているつもりが色が一つずつずれていったり……
f:id:ghaos_p:20200803223622j:plain 何か不思議な操作が起こる状態。
ソフトウェア側の問題を疑うも、解決せず。(ここまで半日ぐらい費やした)

ハンダ付けが甘いというハードウェアの問題をつぶそうと思って塗りなおしたところ、 f:id:ghaos_p:20200803224113j:plain ちゃんと光った。
ハンダ初心者、ちゃんと塗ろう。

ラインストーン貼り付け

f:id:ghaos_p:20200803225234j:plain こんなやつ。
FキーとJキーにひっかかりが欲しかったので。
もともとひっかかりが付いてるキャップ買えよと言われればその通りなんすけどね……

完成!

f:id:ghaos_p:20200803225349j:plain

使用感

キー配列

CAPSLOCKは半角/全角
左下の桜はCtrl
中央下の+がスペース、SHIFTがENTER
右の方の草がFn、
てな感じ。
親指エンターが神。

使っていて気付いたのは、自分は今までファンクションキーの依存度が高かったこと。
使わないように矯正するorFn+数字キーをすぐ押せるようにするの対処が要りそう。。

ひとまずそんな感じで使っているものの、細かいカスタマイズは随時していきたい

左右分割

「Bキーって左手で押してますか?」
購入時に店員さんに聞かれて、即答できませんでしたが
確かに僕は右手で押してました。

ただ、これに関してはすぐに矯正でき、バ行は左手でB打つようになりました。

青軸

めっちゃカチカチ鳴るやつです。
自分の打鍵音は別に気にならないのですが、もうちょっと「スコスコ系」にしてても良かったかも。

右手をマウス、左手キーボードで動画編集するときなどは、
左手で「しっかりボタンを押す感」があっていい感じ。

今後

と、初めて作ってみて、結構ハマっています。

今後の展望として
・LEDパターンいじって遊んでみる
・左手用ミニキーボード
トラックボール付きキーボード
・自作キーキャップ
あたりに興味がわいています。

また何か作ったら書くかも。

以上!

第2回シャニマス投稿祭に向けて動画を作る 動画編集編

無事動画ができました。

 

Adobe(AfterEffects & Premiere Pro)に切り替えて早数か月、

今回はちょっと背伸びしていろいろ作ってみたので紹介します。

※ネタバレアリなので先に動画を見てください。

 AfterEffects

キャラの動き

完成品

f:id:ghaos_p:20200507213625g:plain

 

位置、回転をwiggle

スケールをsinカーブ

f:id:ghaos_p:20200507213338p:plain

+小ジャンプなどをキーフレーム制御

 

タイプライター風テロップ

完成品

f:id:ghaos_p:20200507213951g:plain

 

スクリプト

tStart = inPoint; //開始時間
rate = 25; //1秒間で表示する文字数
t = time-tStart;
linear(t,0,text.sourceText.length/rate,0,100)

 

【Adobe After Effects CC】テキストを1文字ずつ表示させる|タイピング風効果にする方法 | エグウェブ.JP@福岡/WEBセミナー・分析・WEBサイト制作

たしかにこのやりかたでできる。

けど、このやり方だと文字数に関わらず始点終点を指定するため、

文字量の多いテキストと少ないテキストで表示速度に差が生じる。

 

【AfterEffects】シナリオスクリプト風に文字を一定速度で表示する方法 | CGメソッド

調べたら速度を一定にする方法もあった。

エクスプレッションで色々できる。覚えよう

 

映像制作 | 動画に字幕テロップを入れるのはAfter Effectsを! Part 2 - 3RD EYE STUDiOS

AfterEffects CC自動化作戦

こちらで紹介されているテキストインポートスクリプトを導入。

.txtファイルから一行ごとで分解してAEにインポート。

 

エフェクト類

パーティクル

完成品

f:id:ghaos_p:20200507215009g:plain

CC Particle World の使い方をググるも、苦戦。

最終的に、↓の動画にたどり着いた。低コスト・高パフォーマンス。

エコーはめちゃくちゃ重たくなるので、他の作業中はOFFにしておくのが吉

After Effects実践講座43 パーティクルアニメーション(Particle animation)

 

ベガス

完成品

 

f:id:ghaos_p:20200507215323g:plain

電流。結構簡単に色々楽しめる。

↓この動画だけとほぼ同じことをしただけ。かなり良かった

【アフターエフェクト】標準エフェクトで素材に電流を流す表現の作り方

AfterEffectsのベガスを使ってパスに沿って電流を流す二つの手順【講座】 - モミジズム(MOMIZizm)|音楽と映像とそしてドラクエへ…

 

テキストアニメーション

直接使用したわけではないけど面白いので備忘録として

テキストレイヤー特論​【Adobe Day in InterBEE2019】After Effectsユーザー会 | Vook(ヴック)

 

レイヤー操作

このへんはTIPS

【After Effects】レイヤーを階段状に配置する方法 | 制作プラス

AfterEffectsで大量のレイヤーの重なり順を入れ替える方法 | 映像知識のメモ帳

テキストレイヤーの文字数を取得 - Qiita

【After Effects】選択したレイヤーの長さに合わせてコンポジションの尺を変更するスクリプト | CGメソッド

[エクスプレッション]inPoint,outPoint | EVERYDAYSKILLSHARE

 

Premiere Pro

自作トランジション

完成品

 

f:id:ghaos_p:20200507215631g:plain

 

横にブン!ってなるトランジション -Whip Pan Transition / Premiere Pro CC 2019

このやり方でやると、複製&ミラー→再度拡大で画質がガビガビになってしまった。

画面外にも余裕あるようにソースの解像度を動画より上げることで対応。

 

Premiere、デフォルトトランジションが物足りないのは

自作の敷居が低いんやから自分で作ってプリセットにしろor買えってことなんやろうか