スポンサーサイト

seguimi

-
Posted byseguimi

いくつかのパーツに分かれたテキストの演出例

seguimi

今回はテキストを使った演出を紹介します。

使用したフォントはHomesteadです。
http://www.losttype.com/font/?name=homestead

Personal Use Licenseをよく読みます。
個人利用はお好きな額をとのことなので、$0と入力し、感謝しつつDLしました。
その中からHomestead One、Two、Threeを使用します。


出来上がり。

作業はシーン内で、一文字ずつ行います。

 
構造はこのようになっています。
一番上がHomestead One、真ん中がTwo、一番下がThreeを使用しています。

3つのパーツに分けられたテキストを、Z軸をずらして配置します。
一番上が-50、真ん中が0、一番下が50になっています。

このとき、テキストの大きさに見た目上のずれが生じるので、
サイズをいじって大きさを合わせます。


全体はこのようになっています。

カメラ制御では、パラメータを動かさずに、カメラ効果の目標中心回転をかけました。
水平回転、垂直回転ともに0→-30の加減速移動です。


透明度、点滅、クリッピングなど、それぞれのパーツごとにかけます。
斜めブラインドもいいですね。


着色をして一文字完成です。
同様に他の文字も作って、Rootで合わせれば出来上がりです。
*Rootで合わせるときは、シーン内の背景は消して、アルファチャンネルありにチェックを忘れずに。

Homesteadはこの演出にうってつけのフォントでしたが、
やり方を覚えればどのフォントでも応用がきくと思います。

まとめ
■一文字を3つくらいのパーツに分解する。
■Z軸をずらして配置する。
■アニメーション効果等で出現を工夫する。



いかがだったでしょうか。
カメラ制御を使わなければZ軸の配置は不要です。
いくつかのパーツに分けられたテキストの演出、是非試してみてください。
デザインノート No.82: 最新デザインの表現と思考のプロセスを追う
CGWORLD (シージーワールド) 2018年 12月号
+DESIGNING VOLUME 46
ブレーン2019年1月号 読者が選ぶブレーン広告グランプリ2018

Comments - 5

There are no comments yet.
-  
管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

2018/10/24 (Wed)  | EDIT | REPLY |   
-  

カメラ制御を用いると、文字のパーツの一部のz軸を変えて正面から見た時、サイズだけでなくx軸y軸方向のずれもできてしまうのですが、それも修正しているのでしょうか。

2018/10/24 (Wed)  | EDIT | REPLY |   
seguimi  
To -さん

コメントありがとうございます。

Z軸の移動にあわせて拡大率だけ調節しています。

シーン内、テキストは中央揃え[中]でカメラの動きもあわせて一文字ずつ単独で作ります。
すべての文字ができたら、Rootに呼び出してレイアウトするという流れです。

ひとつのテキストにSAMPLEの文字を打って作ろうとすると見た目の位置がずれると思います。

ひとつのカメラ制御ですべての文字を並べてもやはりずれると思います。

もし、ひとつのカメラで済ましたいのであれば、座標のずれは調節しなければなりません。
その時はX座標を調節することになると思います。

2018/10/25 (Thu)  | EDIT | REPLY |   
すん  
No title

文字一つにつきカメラを一つ用意していたのですね。ありがとうございます!!

2018/10/25 (Thu)  | EDIT | REPLY |   
seguimi  
To すんさん

お役に立てたなら幸いです。

不定期ですが、これからもよろしくお願いします。

2018/10/27 (Sat)  | EDIT | REPLY |   

Leave a reply

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。