文字を表示させよう

文字を使用する場面とは

イラストの中で、文字を使用する場面は多くあります。
例えば…

などです。
単純に文字といっても、情報として読むためのものから、デザインとして見せるためのものまで、使い方はいろいろあります。
文字の適切な使用方法に関しては、いろいろな考え方があって、本やネット上の記事で参考になるものもたくさんあるので、時間のある時に読んでおくことをオススメします。
いずれにしても、イラストの中で文字を使用する際は、テキストのサイズやカラーリングを入念に調整する必要があります。
そしてなんといっても、そのイラストに最も適した『フォント』を選択することが重要になってきます。

フォントについて

フォントとは、『書体』のことです。
つまり、文字の見た目ですね。
柔らかい感じや硬い感じ、楽しそうな感じや悲しそうな感じなど、それぞれのフォントから受ける印象はさまざまです。
イラストの中で文字を使用する際は、そのフォントが持つ特性をうまく利用します。
例えば、セリフや説明書きなどのように、情報として読むための文字なら、読みやすさを重視したフォントを選択すれば OK! ということです。
キャラクターの服にプリントされたデザイン文字など、イラストの一部として文字を使用する場合は、イメージにぴったり合ったフォントを入手するか、フォントそのものを自分で制作することになります。
ちなみに、日本語のフォントはとても高価だし、そもそも自分のイメージにぴったり合ったフォントがあるとは限らないため、デザイン要素として文字を使用する場合は、自分でフォントを作ったほうが手っ取り早いです。
Flash では、文字をデザインするような場面でも、そのための便利な機能がいろいろと備わっているため、イラスト制作において死角無しです。

文字の具体的な使用例

具体的な文字の使用例として、昭和の雰囲気を感じさせる、ゲーム画面のようなサンプルイラストを描いてみました。
ちなみに背景のビル群は、Flash にもともと入っているパターン素材を、『パターンブラシツール』を使用して描き、秋葉原を表現したものです。
決して神戸市周辺のポートピアではありません。


ダウンロードボタンこのflaファイルをダウンロードする(zip)

このイラストで使用しているフォントは、『DFP綜藝体』というもので、私のパソコンにインストールされているフォントの中から選んでみました。
選択理由としては、なんとなく古さを感じるゲーム画面にマッチしているフォントのように思えたからです。
ちなみに、これは秋葉原でアイドルを目指すアドベンチャーゲームを想定しています。
決して連続殺人事件が起こるようなゲームではありません。

テキスト編集の注意点

flaファイルの中でテキストを扱う場合は、持っているフォントの有無によって、編集作業に影響が出てくることがあるので注意が必要です。
上記の flaファイルでは、『DFP綜藝体』を使用していると書きましたが、『DFP綜藝体』がインストールされていないパソコンで flaファイルを開いた場合は、同じ書体を再現することができません。
これは Flash に限らず、Illustrator や Photoshop でもそうだし、Word や Excel など、他のソフトウェアでも同じことです。
そのような場合は、ファイルを開く際に、代替フォントの選択を要求されるはずです。
もちろん代替フォントを選択して『OKボタン』をクリックしてもいいのですが、そもそもフォント自体が無いわけなので、別のフォントを一生懸命選んでもあまり意味がありません。
アラートが表示された場合は、何も考えずに『OKボタン』をクリックすれば、ひとまずシステムデフォルトフォントに置き換えて開くようになっています。
ファイルが開かれた後に、見やすい編集画面上でいろいろと対策を考えたほうが作業がスムーズです。

たとえ『DFP綜藝体』がインストールされていないパソコンであっても、上記の swfファイル内のフォントは『DFP綜藝体』として表示されています。
なぜなら、swfファイルにパブリッシュする際、フォントのアウトラインデータが図形化されるからです。
swfファイルでもムービーファイルでも、書き出しを行なった後のフォントに関しては、どのパソコンからでも同じ見え方になります。

テキストの入力方法

テキストの入力には、ツールパネルにある『テキストツール』を使用します。
通常の使い方としては、ステージ上でワンクリックすると、まずは入力の基点となるカーソルが配置されます。
あとはテキストを入力していけば、テキストブロックと呼ばれる周りの枠の中に、テキストが表示されていきます。
改行すると、テキストブロックも行数に合わせて自動的に縦に長く伸びていきます。
テキストブロックの右上にある○をドラッグすると、テキストブロックの幅を自由に調整することができます。
その際、テキストブロックの右上のマークが□になり、テキストブロックの幅が固定されたことを示します。

テキストを表示させるエリアに合わせて、あらかじめテキストブロックの横幅を決めておきたい時もあります。
長めの文章を、固定された横幅の中に流し込みたい時などですね。
その場合は、ワンクリックではなく、ドラッグしてテキストブロックをあらかじめ作っておきます。
あとはテキストを入力していけば、テキストブロックの幅に収まるように、自動的に改行されていきます。
テキストブロックの右上にある□をドラッグすると、テキストブロックの幅をリサイズすることもできます。
また、□の部分をダブルクリックすると、テキストブロックの固定幅が解除され、テキストに合わせて自動的に伸びるタイプのテキストブロックに変更できます。

入力したテキストを部分的に書き換えたい時などは、同じく『テキストツール』で修正したい文字列をドラッグで選択し(色が反転する状態)、新たにテキストを入力し直せば OK! です。

テキストを細かく設定する

テキストに対して、さまざまな設定を行なうには、『プロパティインスペクタ』を使用します。
目的のテキストブロック、またはテキストを部分的に選択状態にしている時、『プロパティインスペクタ』には、その状態で設定可能な項目が表示されているはずです。

プロパティインスペクタの内容を簡単に見てみます。
まずはテキストの種類というものがあり、Flash で扱うテキストには、『静止テキスト』『ダイナミックテキスト』『テキスト入力』の3種類があります。
それぞれに用途が異なるのですが、簡単に言えば、『静止テキスト』はグラフィック用、『ダイナミックテキスト』は外部テキストファイルの読み込み用、『テキスト入力』は入力フォーム用となっています。
『ダイナミックテキスト』と『テキスト入力』は、インタラクティブコンテンツでの使用が前提なので、今は省略しておきます。
ここでは、アニメーションやイラストで使用する文字を前提としているので、テキストの種類は常に『静止テキスト』になっていれば大丈夫です。

その他にも、テキストに対する細かい設定として、フォントの種類、テキストのサイズ、カラー、太字、斜体、縦書きと横書きの切り替え、どの位置で行を揃えるかの指定、文字間隔…
などいろいろあり、全ての設定項目が『プロパティインスペクタ』に集約されています。

テキストを分解する

特にデザイン的な要素として文字を使用する際は、テキストを『分解』することで、自由な表現がしやすくなります。
テキストを分解するには、『選択ツール』で目的のテキストブロックを選択状態の時に、メニューバーの『修正』から『分解』を選択します。
ちなみに『分解』は、テキストブロックに対して2回行なうことができます。
1回分解を行なうと、テキストブロック内の文字が、1文字ずつに分割された状態になります。
これにより、例えば1文字ずつが別々に移動するようなアニメーションが表現できるようになります。

さらに2回目の分解を行なうと、フォントのアウトラインデータが図形化されて、オブジェクトとして扱えるようになります。
これにより、形を自由に変形させたり、他のオブジェクトと融合させたりもできます。
ベースとなるフォントを利用して、新しいデザインのフォントを作ることも容易にできるようになるということです。

注意点としては、1回目の分解まではテキストとしての属性は維持されているので、まだ文字の書き換えは可能です。
誤字脱字があっても、後から修正ができるというわけです。
2回目の分解を行なうと、テキストとしての属性が放棄され、単なる図形としての扱いとなるため、文字の書き換えは不可能となります。
テキストデータとしてのメリットを失う代わりに、図形としてのメリットを手に入れることができるというわけです。
大きな代償を支払う代わりに、巨大な魔力を手に入れる…いかにも、何かのアニメの設定にありそうですね。

上記のゲーム画面の swfファイルでは、1行目の「あきはばら　に　きてしまった…」という部分が通常のテキストブロックとなっています。
2行目の「メイドきっさ　に　いく」という選択肢の部分が、1回目の分解を行なった状態になっています。
3行目の「アイドル　に　なる」という選択肢の部分が、2回目の分解を行なって、テキストデータが図形化された状態になっています。
見た目ではわかりませんが、flaファイルを編集する際には、それぞれの行が異なる状態になっていることがわかると思います。

というわけで、イラストの中に意味もなく文字を入れて遊んでみましょう。
文字が入ることで、イラスト全体の密度を簡単に高めることができるし、背景画などと同様に、雰囲気をガラリと変えることもできるので、使わない手はないはずです！