そもそもデジタル画像って何?
アナログ画像(視覚的に得られる全ての対象)をデジタル化(ピクセルに分割・数値化)したものです。
このデジタル化がポイントになります。「パソコンで扱うためには数値化しないといけない」ということを念頭において読んでみてください。
分割!分割!数値化!
アナログ画像をデジタル化するときに、難しく言うと「標本化(Sampling):空間的離散化」と「量子化(Quantization):画素値離散化」ということが行われています。 言葉は難しいですが、難しいのは言葉だけで、わかってしまえば簡単なことです。
標本化:ピクセル化する
まず、2次元的に分割します。要は「数値化しないといけないので、大量の四角で分割する」するということです。 ちょっと難しい言い方をすると、アナログ情報というのは空間的に連続しているので、これを離散的な点(画素)の集合に分割する処理をします。
大量に分割すれば、よりアナログの情報に近づきますが、その分データ量が大きくなります。つまり、画素が多ければ多いほど(解像度が高いほど)高精細な画像になります。
ここで色を入れるための□ができあがります。
量子化:濃度レベルを決める
色深度、Color Depth、濃度値、濃度レベル、Gray Level、色々と呼び方はありますが、要は「色の階調の分割をどのくらいにするか」ということです。
現実的な光というのは真っ暗からものすごい明るさまで、目に入ってくる光の幅がすごいありますよね。でも、モニタで表示できる色の幅というものは決まっているので、これも分割して数値化しないといけません。
例えると、絵の具を入れておくパレットのようなものです。色数を増やすこともできますが、その分識別しなきゃいけない数が増えるので、データ量が大きくなります。
基本的にはフルカラー(モニタで表示できる最大の色数:RGB各8bit)で作業します。
これが量子化です。標本化してできた色を入れるための□に、パレットから色を塗っていく感じです。
データ量
画像の基本構造はこれだけなので、データ量は
画素数(横×縦)×濃度レベル(ビット)
になります。
例えば、この300×300ピクセルのグレースケール画像だと、
300x300x8bit=90000x8bit=90000x1byte=90000byte
という風に計算できます。(8bitのことを1byteと言います)
ですが、よくよく調べると、このビットマップ画像は91080バイトです。「残りの1080バイト分って何?」となりますね。
デジタル画像の中には何が入ってるの?
画像ファイルには、上記のようなピクセルのデータとともに画像データ以外のデータ(上記の画像データだと残りの1080バイト分)、ヘッダーとかメタデータとか呼ばれるものが入っています。
- ファイルの名前
- 作成日時・更新日時・アクセス日時
- 画像の解像度
- 色数
- 圧縮の種類
- その他、ファイルの構造を示すために必要なデータ等
といった類のものです。Windowsのエクスプローラのプロパティとかでも見れますし、より高度なソフトを使えば詳細にデータ構造を見ることができます。
Webの方であれば、ファイルを小さくするために、このメタデータの内、いらないものを取り除くSmush.it™というシステムなどを使っている方もいるかと思います。
もちろんこのファイル構造は画像ファイルの圧縮フォーマット(jpgとかpngとかtgaとかgifとか)によって変わります。
画像の最小単位「ピクセル」をより詳しく見ていくと?
では、より詳しく画像を見ていこうと思います。ここで話すのは量子化の詳しい話になります。
この記事の上の方で出てきた画像はグレースケールでしたが、これがカラーになったときの話です。画像を構成している一個一個の点(ピクセル)を詳しくみていきましょう。
ピクセルと呼ばれるこの点には、R(Red:赤)G(Green:緑)B(Blue:青)という3つのチャンネルがあります。
なんで赤と緑と青かというと、これはモニタの色の作り方が光の3原色を使っているからです。
中学くらい(小学校でしたっけ?)に習ったかと思いますが、赤と緑と青の光を組み合わせると、加法混色で様々な色を作ることができるっていうあれです。
もう予想は付くかと思いますが、「モニタの一個一個のドット(モニタを構成する点)」と「画像のRGBチャンネル」は対応しています。
顕微鏡とかで見るとわかるのですが、モニタは1個1個のドットが3つのライトを持っています。このライトが赤と緑と青のライトになっています。ちょっと昔のでっかいテレビとかだと、ものすごい寄ってみると赤と緑と青の光が見えたりします。
つまり、この3つのライトと3つのチャンネルが対応しています。コンピューターはモニタに「この場所の、このチャンネルのライトを、このくらいの量光らせて!」という命令を送っています。
RGBチャンネルにそれぞれに入ってるのは実はグレースケールの画像
RGBチャンネルそれぞれにはグレースケールの画像が入っています。もっと言うと、RGB各8bitの画像なら、8bitのグレースケール画像が3つ、さらに言うと、0~255の値が各ピクセルに3つずつ割り当てられています。
このグレースケールを「色」ととらえずに「ライトをどのくらい光らせるか」ととらえてください。各チャンネルのグレースケール画像のそれぞれのピクセルの値というのは「モニタのRGB値をどのくらい光らせるか」ということを表していることがわかるかと思います。
一般的なモニタはRGB各8bitの階調数(データ幅)を表示できるので、RGBチャンネルそれぞれ8bit=24bitの画像がフルカラー(トゥルーカラーともいいます)の画像となります。
それじゃアルファチャンネルって何?
アルファチャンネルも発想は同じです。グレースケールの画像が入っています。
そもそもアルファチャンネルというのは、「ここ透明にして!」というデータではなく、「プラスアルファ」のデータという意味です。一般的に不透明度を表すデータとして使われているのですが、元々はあくまで補助データです。
つまりチャンネルとは?
それぞれのグレースケール画像に対して、チャンネルごとに出し方を変えているだけ。
まとめ
- デジタル画像というのは、ピクセルというもので構成されていて、デジタル化するために分割されている。
- 画像データと一緒に、どんな画像データなのかを記述するためのデータが入っている。
- RGBAチャンネルというのは、それぞれにグレースケール画像が入っていて、そのグレースケール画像に対して、出し方を変えているだけ。
CGでイラストを描いたり、Web用の画像を扱う人でも、このくらいの基本的な画像の知識を知っておくと、仕組みがわかって作業ができるので、より手の込んだことができるようになります。
超基本的なことをダラダラと書きましたが、何かの参考になれば幸いです。