今日はDSM-Setのデザインに関するTipsを取り上げます。
DirectSmileでは以下の3種類のフォントが使用出来ます。
- システム・フォント
- クリップ・フォント
- ピクチャー・フォント
いずれのフォントを使用した場合でも、
- テキストフレーム(赤線で表示されるフレーム)、
- ピクセル変形グリッド(青線で表示されるグリッド)
が適用出来ます。
また、クリップ・フォントを使用した場合のみ、
- クリップ変形グリッド(黄線で表示されるグリッド)
が使用可能になります。
今回のTipsはこれらのフレーム、グリッドの機能・違いについてです。
それでは実際のDSM-Setを使って説明しましょう。先ずは、DSM-Setを作成します。
- 背景画像を読み込む
- テキストフレームを描写する(初期設定でシステムフォントが選択されます)
始めにテキストフレームと、ピクセル変形グリッドの機能・役割についてご説明します。
テキストフレーム
テキストフレームの機能はとてもシンプルです。
フレームの大きさと表示されるテキストの大きさは連動しています。フレームを拡張すればそれだけ表示されるテキストのサイズが大きくなり、逆に縮小するとフレームの大きさに応じて表示されるテキストも小さくなります。
ピクセル変形グリッド
次にピクセル変形グリッドについて説明します。
*ピクセル変形グリッドを表示させるには、ウィンドウ左上のフレーム、グリッドボタンをクリックすることで表示出来ます。
ピクセル変形グリッドを使うと、表示するテキストを変形出来ます。フレームの四つ角、交差するポイントをドラッグしながら動かす事で、背景に合わせて画像を変形(歪める)する事が可能になります。
このフレームを使用すると、テキストのベクトルではなく、画像(フレームにて表示される部分)そのものを歪めるといった効果が得られます。
クリップ変形グリッド
最後にクリップフォント変形グリッドについて説明します。
先ほどと同様、背景を読み込み後テキストフレームを描写しました。フォント・タイプを「クリップ・フォント」に変更しました。
今回は用意したギャンブル用のチップコインをクリップとして使用します。
すると、以下の様に初期設定のグリッドが表示されます。
ピクセル変形グリッドと同様に、グリッドの四つ角や交差ポイントをドラッグしながら動かす事で描写フレームを変形し、奥行きを出したり立体的にするなど描写が可能になります。
ここで、ピクセル変形グリッドと、クリップ変形グリッドの最大の違いをご紹介します。
- ピクセル変形グリッドはフレーム画像自体に対しての歪みを表現します。
また、レンダリングにより時間が掛かります。 - クリップ変形グリッドはクリップフォントのベクトル(クリップを表示するためのパス)自体に対しての変形を行います。ですので、表示されるクリップ自体が変形の影響を受けて歪むわけではありません。つまり、クリップ画像自体は基本的に登録状態と同じ画像が配置されるという事になります。
また、レンダリング時間はより短いです。
この違いは以下のサンプル画像がご理解頂きやすいかと思います。以下の2つのDSM-Setデザインは、それぞれのグリッドを使用して同様の変形を加えています。
では、より拡大して見てみましょう。
クリップフォントを使用したデザインの場合は、基本的なフレームに対する変形はクリップ変形グリッドで行い、奥行きや立体具合を追加したい場合に更にピクセル変形グリッドを使用して効果を追加するという方法が最適です。
これで出来上がりです!
これらの違いをご理解して頂いた上でデザインを行なって頂くと、よりリアルで処理に適したSetを作成して頂けるかと思います。
以上、今回のTipsでした:-)