2013年6月9日日曜日

アンチエイリアス

PC画面は四角いピクセルで構成されています。
厳密に言えばPC画面上には曲線は存在しない事になります。
曲線が存在しないのに、なぜ円が表示できるのでしょう?
ピクセルは、通常意識しないほどの小さな四角い点です。
円を拡大してみましょう。
曲線部に薄いボカシがあるのが分かります。
この四角いピクセルが曲線に見えるようにボカシを入れる処理をアンチエイリアスといいます。

Photoshopでアンチエイリアスあり、アンチエイリアスなしで描いた円を並べてみると、違いが良く分かります。

文字を使用する場合、アンチエイリアスの扱いが非常に重要になります。
ある程度の大きさがある場合は、アンチエイリアスがかかっている方が綺麗に表示されますが、小さいサイズの文字、特に漢字はアンチエイリアスをかけると潰れて読みづらくなります。

小さいサイズで漢字を使う場合には、メニュー等の表示の為に作られた旧世代のシステムフォント(WinはMS Pゴシック、MacはOsaka)をアンチエイリアス無しで使用すると視認性が高まります。
※現在のシステムフォント(メイリオ、ヒラギノ角ゴシック)はアンチエイリアス処理を前提に作られているため、旧世代を使用します。

2013年4月26日金曜日

ラスターとベクター


PCで画像を扱うには、主にラスター系かベクター系どちらかの仕組みが使われています。
それぞれをザックリ解説すると

ラスター系(ペイント系ともいう)
画像をピクセル単位で管理。ピクセルの位置に色・透明度等を割り当てる。
画像のサイズにファイルサイズが比例する。
拡大縮小によって画質が劣化する。
代表的なソフト:Photoshop、Gimp等


ベクター系(ベクトル系、ドロー系ともいう)
アンカーポイントと呼ばれる座標を結び、曲線のR等を計算してパスと呼ばれる線を描画する。
画像サイズとファイルサイズは比例せず、アンカーポイント等の量に比例する。
拡大縮小しても再計算して描画するため、画質は劣化しない。
代表的なソフト:Illustrator、Inkscape等


Fireworks等、両方の要素を兼ね備えたソフトもあります。


解像度


解像度、聞き慣れない言葉ですね。
でも、PCで画像を扱うにはとても大切な概念です。

解像度とは、ディスプレイの表示能力やプリンタの印刷能力、スキャナの分解能力等のきめ細かさや画質の滑らかさを表す尺度の事。
画像を表現する画素(ピクセル)の数や、画素が1インチに何個あるかで細かさを表します。
解像度が低いと画像や文字に「ジャギ」と呼ばれるギザギザが現れたり、ボケた感じになってしまいます。


解像度の単位

ppi:1インチ(=2.54cm)に何ピクセル使用しているかを指す。主にディスプレイ画面に表示する場合に用いられる。ピクセル・パー・インチの略。

dpi:1インチ(=2.54cm)に何ドット使用しているかを指す。主に印刷物に用いられる。ドット・パー・インチの略。

※PC作業上は同じと考えて良い。


ディスプレイの解像度

一般に画面に表示するピクセル数で表します。
画質の良さは総画素数で決まるわけではなく、画素の密度によって決まります。
同じ画素数で画面サイズが異なる場合、小さい画面の方が画素の密度が高くなり高画質という事になります。

プリンタの解像度

1インチに何個のドットを使用し印刷するかで表します。単位にはdpiを使用。
一般的なプリンタはCMYKのインクそれぞれのドットを並べ擬似的に中間色を表現する点描方式のため、カラー印刷の場合にはカタログスペックよりずっと低くなります。

画像データの解像度

PC等の画面表示用
画面用の画像はピクセル数そのままのサイズで表示されるため、基本的に解像度には依存しません。しかし、一般的に解像度72ppiで作成します。これは初期のMacが画面と印刷結果のサイズを同じにするために、文字の単位であるpt(ポイント)が72分の1インチである事から画面解像度に採用し「1ポイント=1ドット=1ピクセル」という原則を打ち立てたためです。
現在でも72ppiになるよう画面サイズを設定すれば、理論上画面表示サイズと印刷結果サイズを同じにできますが、作業領域が狭くなり激しくアンチエイリアスがかかり表示がボヤけてしまうため現実的ではありません。

印刷用の解像度
解像度が高いほど綺麗に印刷できますが、プリンタの解像度を超えてしまっては意味がなく、ただ重いだけになってしまいます。
業務用印刷の場合、350dpiが一般的で解像度が低いと受け付けてもらえない場合もあります。

※Photoshopで変更する解像度は印刷用の解像度(ドキュメントサイズ)であり、画面上では解像度に関係なくピクセル数で表示されます。