CG講習一日目~コンピュータグラフィックの基礎(前編)

ガブリエルでーす。
←これはガブスレイです。(This is Gabslay.)
ここでは私たちの対話形式でCG講習の内容を適当にやっていきます!  どうしても参加できないよー><っていうみなさんはもちろん、参加したみなさまの復習なんかにも役に立てばいいなーって思っています。
それじゃあ早速一日目の講習の復習に入りますね!


RGBとは

光の3原色のRed・Green・Blueの頭文字ですね。この世の全ての色は原理上(人の目に対しては)、この三つの色の光の強度バランスによって表現することができます。
「(人の目に対しては)」(笑)
計算機上では、RGBそれぞれにある程度のビット数が割り当てられていて、その範囲で色を変化させることができます。
じゃあ色を作るときもぉ、Rがいくつで~Gが~みたいなことするんですかぁ~?(棒)
それなりのペイントソフトなら、色相・彩度・明度で色作りできるので、そんなめんどくさいことにはなりませんのでご安心を。
じゃあなんでこんな話をするのかというと、印刷時に表現できる色との幅の違いのせいで、問題が生じるからです。
詳細は最終日を見よ。(See the Last-Day.)


画像形式の話その1 ラスタ形式とベクタ形式

通常、画像は1ピクセルという単位長さの正方形の画素によってモザイクのように構成されています。 一つ一つの小さな正方形ドットごとに色の情報を保持することで、一つの大きな画像を表現しているわけです。
このようにドットごとに色を保持させて画像を扱う形式をラスタ形式といいます。
うちらも虫眼鏡で見たらドットの集まりやんな
ラスタ形式は様々なソフトで普遍的に閲覧することができるので、最終的にはこの形式の画像ファイルで出力します。
ただラスタ形式にも弱点があります。それが最も顕著に現れるのが拡大と縮小です。
なにこれ
左が元画像で、右が一度25%に縮小したあと400%に拡大して元の大きさに戻したものです。
一度縮小されると、その分画像データは失われてしまうので、再び拡大しても元に戻らず、ぼやけたり画素のマスが見えてたりしてしまうこともあります。 なのでラスタ形式で画像を取り扱っているソフト(所謂「ペイントソフト」)では、極端な拡大縮小はあまり多用すべきではありません。
てかワシ見切れとるやんけ、てめぇの頭も見切れさせてやろうか
もうひとつの画像の取り扱い形式がベクタ形式です。文字通りベクトルの集合で画像を保持し取り扱います。
日本語でしゃべろう?
線1本1本が曲がる場所の曲がり方(傾き)、色や筆圧などが変化する“座標”でそれらの情報をまとめて“制御点”として保持します。 ここでいう“座標”はピクセルとは無関係な数学的な意味での座標であり、拡大縮小はこの座標や太さに対する数値の書き換えによって行われます。 新しい制御点データに基づいて画像が再生成されるため、拡大縮小による画像の劣化は極めて小さいです。また、制御点を後から編集しマウスだけで綺麗な線を書く事も。
やりだすと時間溶かすし絵を描いてる気分じゃなくなるがな。あと画力上がらん(偏見)
原理上パソコンに負荷がかかりやすいのですが、最近はパソコンの高性能化などに伴ってペイントソフトの感覚でベクタ形式でデータを保持するソフトも出てきています。 イラスタやクリスタなんかが最近は有名ですね。
Illustratorのような純粋なドローソフト(ベクタ形式で画像を取り扱うソフト)は扱いが難しく、絵を描くのとは全く別の話になってしまいます。
ただ今後立て看みたいなでっかい絵をデジタルでやるんなら、イラスタやらクリスタで描いて拡大印刷がいいんじゃねって話やな。
(※諸事情によりアナログでの立て看板制作が困難になりつつある)


画像形式の話その2 jpgとかそのへん

一般的な画像ファイルはラスタ形式ですが、そのまま馬鹿正直に扱っていると総画素数に比例したファイルサイズになってしまいとんでもなく重たくなってしまいます。
もしかしてbmp(ビットマップ)ファイルの悪口か?
ですので様々な圧縮技術を用いてファイルサイズを小さくそれでいて画像の綺麗さを維持というのが重要になります。 また、編集途中の画像を他のソフトに渡してさらに加工したり、あるいは単純に編集途中の画像の一時保存したりする場合のように、 逆にファイルサイズは大きくてもいいから劣化無し・レイヤ構造(後述)が維持できるファイル形式がいいなんてこともあります。
要はjpg、png、gif、psdの大雑把な説明すると。
まずは最もメジャーな画像形式の一つ。JPEGです。この形式は大雑把に言えば、色がなめらかに変化するとこはグラデでいいじゃん?って感じで圧縮する方法です。
まぁRGB→YIQ変換とかDCTとかランレングス符号化とか言ってもしゃーないわな。
肝心なのは、この形式が「非可逆圧縮」である点と、圧縮の度合いを指定できる点。つまり何も考えずにやってるとむちゃくちゃに劣化することがあります。
右の不味そう(汚いの意)
左が最高品質。右が圧縮品質を落とせるだけ落としたものです。ファイルサイズ(圧縮率)も天と地の差で、左が83.01KB(1/2.71)、右が4.94KB(1/45.54)です。 非可逆圧縮なので画像表示時に綺麗な元の画像に戻すこともできないですし、印刷もきったないまま印刷されます。(例は自主規制)
ファイルサイズに制限がない限り最高品質が基本ですが、用途に応じて品質はきちんと指定しましょう。
アニメ塗りは特に色の変化(の傾きが)激しいせいで、JPEG劣化で汚くなりやすいからな。
次はpng形式。こちらは可逆圧縮なので劣化の心配はなく、透明度なんかも維持できるので半透明の画像なんかも作れます。
その分重い。
後述のGIFの後継として生み出されたこともあるのでアニメーションも対応しています。
だが肝心のブラウザがほとんど対応してなくてアニメーション見れないというオチな。
一時期特許云々で問題になってすっかり廃れたgifは、それでもGIFアニメでほそぼそ生きてます。
256色しか使えない上、売りであるファイルの軽さも最近じゃ回線の高速化でそこまで気にすることないしな。アニメーションに関してはFlashに取って代わられたし。
psd形式は画像ファイルというよりもAdobeの製品の一つである画像編集ソフトPhotoShopの独自形式です。 他の画像編集ソフトも対応していることが多く、レイヤー構造を維持できるため、複数のソフトをいったりきたりして絵を描く人はお世話になります。
印刷所なんかも統合済みpsdファイルで入稿できるとこ多いな。


CG講座トップ 後編