素材作成初級講座  第5回 アイコンを作ろう パート2

前回はアイコンを作成しました。指定した色を透過させるところまではバッチ
りでしょうか?
今回はそのアイコンをより良く見せるために、知っておきたいことをお話しま
しょう。

まずはこの画像をみてくださいね。



では、つぎにこれ。



違いがわかりましたでしょうか?

前者よりも後者のほうがどちらかというと線が滑らかで、きれいに見えますね。

さてどうしてでしょう???
ということで答えはこちら〜

これは2つの画像のアップの図です。左に表示されているのが前者で、右に表
示されているのが後者です。
こうやって並べてアップにすると良〜くわかりますね。
左のほうの画像は、白と黒で色と色の境界線がはっきりしていますが、右のほ
うの画像は、色と色の間にその中間のグレーが使われているのがわかります。
この中間の色が、実寸で見たときの「滑らかさ」を表現しているのです。

これをアンチエイリアシングと呼びます。
詳しい解説はコンピュータ用語の辞書やサイトで勉強していただくとして、と
にかくピクセルより小さい単位の画像の繊細さを表現したい場合は、このアン
チエイリアシングを使うことになると思います。

沢山ある素材集から気に入った素材集を選んで、文字入れしたは良いけれど、
文字がギザついてあまり綺麗に文字を入れることができなかった・・・という
経験はありませんか?
自分で作った素材が垢抜けないような気がする・・・なんて感じた方はいます
でしょうか?

皆さんがこんな問題を抱えていて、今、使っているツールがアンチエイリアシ
ング表現できないものならば、次回、新しいツールを選ぶときにはこの点も気
をつけてみてみましょう。
滑らかな線が描けることで、上で挙げたような問題が解決できるかもしれませ
ん。(そんなことは「百も承知二百も合点(笑)」っていう方は別の問題のよ
うですが^_^;)

さてこの表現にもマイナス面が、もちろんあります。
そのひとつは、サイズです。
滑らかに見せるため、色数などのデータが多くなってしまっています。

ホームページを表示するという観点から見ると、画像サイズは小さいほうが良
いということは、前回までに、すでにお話した通りですね。
「データが多少大きくっても、きれいなほうが良い」とか「ホームページは軽
いのが一番!美しさなんて二の次だ〜」等、皆さんのポリシーならびにセンス
にかかってくるのかもしれません(^_^)

さて、アンチエイリアシングをどう使っていくかを決めるもうひとつの重要な
ポイントを説明しましょう。

では、先ほどのアンチェイリアスのサンプル画像の、文字の周りの白い部分を
透過させ、白いバックと赤いバックでそれぞれ表示させてみましょう。

では、まず白バックで。

次に赤バックで。

皆さん、お気づきですね。
白バックのほうはきれいに表示されていますが、赤バックでは絵の周りに白っ
ぽいギザギザが出来ています。
先ほどまで、滑らかな線を描くのに一役買っていたアンチェイリアスですが、
今度は一転して、仇となってしまっているようです。

バックの色が決まっている場合は、その色を意識して、素材を作成していくこ
とができます。
しかし、バックの色が決まっていない場合、またはいろいろな場面(バック)
で使いたいというような時に、使うページによって上述したような現象が出て
きてします可能性があるのです。

もちろん、ひとつの素材の中で、アンチエイリアシングを用いる部分と用いな
い部分を共存させることも可能です。

これをみてください

この素材は透過する周辺の部分にはギザギザが出ないよう、アンシエイリアシ
ングを使っていませんが、文字を入れた部分は滑らかな綺麗な線を出したいの
で使っています。

アンチエイリアシングを使った素材を透過させる場合、「どんなページで」
「どんなふうに」使用するのか、じっくり考えて作成しなくてはならないので
す。

そうそう、素材集から頂いてきた素材にも白っぽいバック限定とか黒いバック
限定なんてものがありますね。
これらの素材を使用するときにも、気にとめておきたい内容です。

さて、ご理解いただけたでしょうか〜?

次回はあなたのホームページのバナーを作成していきましょう。




■ホームページ作成メモ■
今回、アンチエイリアシングを使用する上でのポイントについてお話してきま
したが、皆さんのツールはこのような表現できますか?

以前、私が使っていたツールも表現できなかったのです。
今から考えると、良くそれで素材集なんか作れていたな〜等と思ったりするの
ですが、その当時はいろいろ工夫しながら作成したものでした。

たとえば、出来上がりの大きさより大きめに画像を作って、サイズを小さくさ
せてアンチエイリアシングに似た効果を得たり、エッジをぼかしてみたり・・・
いろいろなことをしたような記憶があります。

そうそう、『極楽法典』のホームページにはりついている、「What's NEW?」
は、一度描いた文字を「ソフト」機能でぼやかしてから、その上に更にもう一
度同じ文字を描いて作成した画像なんです。
文字のギザギザ、目立たないでしょ?(笑)

「滑らかな感じの画像を作りたい」
「でも新しく高価なツールなんて買えないよー」
そんな方は現在使っているツールでいろいろと実験をしてみてもいいかもしれ
ません。
アンチエイリアシングに似たの効果が表現できるかもしれませんよ!

・・・なんて今回はホームページ作成メモとはかけ離れた内容になっちゃいま
した(笑)







上記の内容はメールマガジンとして1999年4月28日に配信されたものです。

素材作成初級講座 第4回へ戻る
素材作成初級講座 第6回へ進む
素材作成初級講座の目次に戻る
極楽法典ホームページに戻る