.wp-block-jetpack-rating-star span.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal; }

サイトアイコン NegativeMindException

ドラマ『ファーストクラス』のモーショングラフィックス

今週でファーストクラスの続編も最終回を迎えた。

最初のファースト・クラスの頃から映像表現が独特で、それがハマるきっかけだったんだけど、雑誌の紙面レイアウト想起させる作りだったのかな。続編になってから、ビジュアル表現がさらに凝った感じになった印象。

SOLIDEMO / 「Rafflesia」 TV EDIT

オープニングとエンディング、そしてタイポグラフィーチックな登場人物の職業・名前表記がカッコ良かった。もちろん、心の声描写がキャッチーだったのもある。



ちょっと考えたいのが、モーショングラフィックスというジャンル。映画やドラマのオープニング映像的なやつで、短い時間で世界観を表現するイメージ映像。CMやミュージックビデオもそうか。
実写映画のキャシャーンは全編イメージ映像みたいな感じだったけど。

一昔前なら、モーショングラフィックスは実写素材をAdobe After Effectsみたいなツールで加工したものがメインだっけど、今はフルCGでできているものも結構ある。

ネットで見られるかっこいいモーショングラフィックス
見ててキモチイイ…。空間を感じるモーショングラフィック7選

CG技術の高度化で、この手の映像の表現力も用途も随分広がった気がする。一昔前なら大作映画のメインタイトルでしかできなかったような凝った映像が、今はテレビドラマで見ることができる。
この、制作技術の高度化と用途の拡大具合を見ていると、そろそろ次のステージが現実的になってきているような気がする。

何が言いたいかというと、こういうモーショングラフィックス的な「リッチな表現」が、これからWebデザインにもどんどん取り入れられていくのではないか、ってこと。
今までのWebデザインは、どちらかというと2Dの印刷の「紙面レイアウト」のパラダイムを延長だったけど、それは単純に、昔のhtmlには印刷に近い程度の表現力しかなかったからだ。

それが今や、htmlはインタラクティブ、レスポンシブになり、印刷の表現力なんかとっくに超えたメディアとなった。

最近オイラは、データのビジュアライゼーションに興味があるんだけど、データビジュアライゼーションもモーショングラフィックスも、突き詰めていくと、可視化のルールをデザインするってことに落ち着きそう。

たぶん、モーショングラフィックスのクリエイター達が、データビジュアライゼーションを作品に取り込んでいくんじゃないかと思う。PerfumeのWebサイトなんてまさにそんな感じだ。

そんで、ここ最近データビジュアリゼーションの方で色々調べてみて、Data Visualization Japanというコミュニティを見つけたので、先日Data Visualization Japan meetup#2というものに行ってみた。


スポンサーリンク

Data Visualization Japan

データ・ビジュアライゼーションにまつわる実践的なノウハウやツールなどを共有していくコミュニティです。
日本におけるデータ・ビジュアライゼーション領域の発展に貢献できることを目指します。
定期的に勉強会やミートアップを開催していきます。
扱う領域は、データ収集と分析、デザイン(情報デザイン、UI)、エンジニアリング(D3.js, Angular.js, Python, R, NoSQLなど)、統計など広く扱います。



どうやら、データを扱う科学者やエンジニア、メディアの人達の間では色々な可視化ツールが結構出回っているらしい。

Datavisualization.ch



こういう時代を眺めつつ、クリエイターがデータを作品に利用するというコンテンツ制作の新たな潮流を、今後しばらくはUnityというツールが担いそうだなぁ、と何となく予想しているのです。

スポンサーリンク

関連記事

UnityでTweenアニメーションを実装できる3種類の無料Asset

ZBrush用トポロジー転送プラグイン『ZWrap Plugin for ZBrush』

TensorFlowでCGを微分できる『TensorFlow Graphics』

ZBrushでアヴァン・ガメラを作ってみる おでこ(?)のバランス調整

参考書

After Effects全エフェクトの解説(6.5)

Unity ARKitプラグインサンプルのドキュメントを読む

Texturing & Modeling A Procedural ApproachをGoo...

ZBrushでアヴァン・ガメラを作ってみる 脚のポーズ調整

ブログがダウンしてました

Photoshopで作る怪獣特撮チュートリアル

インターフェイスは世界を規定する

Mayaでリアルな布の質感を作るチュートリアル

3Dスキャンに基づくプロシージャルフェイシャルアニメーション

PureRef:リファレンス画像専用ビューア

Blendify:コンピュータービジョン向けBlenderラッパー

GitHub Pagesで静的サイトを作る

ZBrushでアヴァン・ガメラを作ってみる 甲羅の修正・脚の作り込み

無料で使える人体3DCG作成ツール

CEDEC 3日目

Maya 2015から標準搭載されたMILA

CLO:服飾デザインツール

ZBrushで仮面ライダーBLACK SUNを作る 頭部~バストの概形

白組による『シン・ゴジラ』CGメイキング映像が公開された!

Zibra Liquids:Unity向け流体シミュレーションプラグイン

Adobe Photoshop CS4 Extendedの3Dモデル編集機能

ZBrushトレーニング

映画『ゴジラ-1.0』 メイキング情報まとめ

Adobeの手振れ補正機能『ワープスタビライザー』の秘密

MRenderUtil::raytrace

Webスクレイピングの勉強会に行ってきた

Raspberry Piでセンサーの常時稼働を検討する

スター・ウォーズのスピンオフ『マンダロリアン』の舞台裏

Unite 2014の動画

3D復元技術の情報リンク集

サンプルコードにも間違いはある?

ZBrushでアヴァン・ガメラを作ってみる 下アゴと頭部を作り込む

BlenderのGeometry Nodeで遊ぶ

ゴジラ三昧

色んな三面図があるサイト

トランスフォーマーの変形パターンを覚えるのは楽しいと思うんだ

ZBrushでUndo Historyを動画に書き出す

モバイルバージョンを終了