前回の最後に予告したとおり、今回はエフェクトブースターおよび CardWirth そのものの話題というより、情報処理における一般教養とでもいうような話題を扱います。
コンピュータでは（日常生活ではあまり使わない）十六進法という特別な数字の表記法をよく用いますし、ことに画像などの色合いを指定する場合に多用される傾向があります。
そこで、これらについてあまり触れる機会がなかった方のために、十六進法表記の基本と、色彩を十六進法で表記することについて解説します。
既にこうした話題に通暁されている方は、今回を飛ばして次回に進んでいただいて結構です。
コンピュータと十六進法
十進法
我々が日常で扱う数字は、ふつう十進法で表記されます。十進法というのは十の累乗ごとに桁があがり、それぞれの桁は 0 ～ 9 の十種類の数字で示す、そうやって数をあらわす仕組みを言います。
例えば 263 という数字が意味するのは
| 国語的表現 | 二百六十三（にひゃく・ろくじゅう・さん） |
| 算数的表現（小学生向け） | 100 のかたまりが 2 個と、10 のかたまりが 6 個と、1 のかたまりが 3 個 |
| 数学的表現（中学生以上） | 2 * 102 + 6 * 101 + 3 * 100 |
ということですね。表現はかなり異なりますが、意味としては同じ概念を指しています。
ちなみに、この「桁」のことを英語で digit といいます。「四桁の数字」は a four-digit number です。よく使われる「デジタル」 digital は digit の形容詞形ですね。
語源はラテン語の digitus で「指」の意味です。おそらく指を折って物を数えることからきているのでしょう。両手の指の数の合計が十であることと、十進法が多用されることはもちろん無縁ではありません。
電子回路と二進法
この「十ごとに桁が上がる」という原則を、他の数に置き換えたものを（一般化して）「N進法」といいます。
N = 3 であれば三進法、N = 8 であれば八進法という具合ですが、現代で広く普及しているコンピュータはデジタル式の電子回路（古くは電気回路）で、内部的には二進法を多用してさまざまな計算を行っています。
今風の半導体を用いた電子回路が普及する前は ON / OFF の出来る電気的なスイッチを使っていたのですが、回路に電気が流れている状態を ON（=1）、流れていない状態を OFF（=0）とし、その回路を高度に組み合わせることで論理的な演算、あるいは数学的な処理を行うコンピュータが作られました。
みなさんもむかし、数学（あるいは技術科？）で論理回路（AND 回路とか OR 回路とか）について習ったのではないかと思います。このチュートリアルは情報処理の学生に向けたものではないのでその詳細は割愛しますが、そういう二進法の電気回路（いまどきは電子回路）を上手に組み合わせることで色々計算ができるようになる、という程度に理解していただければ結構です。
この二進法は数字が 0 と 1 だけですから、二ごとに桁があがります。
十進法では 0、1、2、3、4、5、6、7、8、9、と来て次に 10、11、12・・・となりますが、二進法では 0、1 の次にもう桁が上がるので 10 となります。その次は 11 、さらに次は桁の繰り上がりがあるので 100 です。対応関係を表にしますと
| 十進法 | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 二進法 | 0 | 1 | 10 | 11 | 100 | 101 | 110 | 111 | 1000 | 1001 | 1010 | 1011 | 1100 | 1101 | 1110 | 1111 |
という具合です。
ちなみに、この二進法の一桁のことをビット bit といいます。コンピュータの CPU を 32 bit とか 64 bit とかいうアレですね。英語の辞書を引くと binary digit の略だと説明されていますが、おそらく「かけら」とか「ちょっとしたモノ」という意味の英単語 bit との掛詞でもあろうと思われます（「ちょっとだけ」を a little bit とかいう時の bit です）。
二進法と十六進法
ただ、現実問題としてコンピュータに関わる人が二進法そのものを使うことは稀です*1。
理由は単純で、二進法は扱いづらいからです。ちょっとした数でもすぐ桁が増えてしまって、非常に面倒くさい。
たとえば十進法で 356 * 214 = 76184 となる数式が、二進法では 101100100 * 11010110 = 10010100110011000 とかですよ。見るだけでイヤになります。
電子回路で計算させる分には処理の手数が増えても個々の演算がシンプルな方が都合が良いので、コンピュータにはこれでよいのですが、そのコンピュータを扱う人間はそうは行きません。
そのため、情報処理業界ではかなり古くから十六進法が使われてきました*2。
十六進法は十六ごとに桁が上がる表記法で、10 ～ 15 をアルファベットの A ～ F で代用します。
| 十進法 | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 二進法 | 0 | 1 | 10 | 11 | 100 | 101 | 110 | 111 | 1000 | 1001 | 1010 | 1011 | 1100 | 1101 | 1110 | 1111 |
| 十六進法 | 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | A | B | C | D | E | F |
F の次は桁が上がって 10、以下 11、12・・・19、1A、1B、1C、1D、1E、1F、20、21 ・・・という具合ですね。
なぜ十六進法が用いられるかというと、16 は 2 の階乗（16 = 24）だからであり、二進法と十六進法は相互に置き換えが容易な性質があるからです。
先の 356 や 214 を例にして説明しましょう。
356 は二進法で 101100100 ですが、これを下から四桁ずつに区切って 1 0110 0100 とします。これを先ほどの表に基づいて 1 → 1 、0110 → 6 、0100 → 4 と単純に置き換えれば十六進法の表記となります。つまり十進法の 356 は十六進法の 164 です。
同様に 214 を二進表記すると 11010110 、これを下から四桁ずつ区切って 1101 0110 とした後、1101 → D 、0110 を 6 と機械的に置き換えるだけで十六進表記の D6 が得られます。
つまり十六進法は二進法を四桁ずつまとめて扱うことが出来る性質があるので、「二進法だと都合がいい」コンピュータと、「桁数が増えすぎないほうが都合がいい」人間との、両者の都合を折衷するメリットがあるわけです。
Windows の電卓が意外と使える
とはいえ、急に「十進法の 214 は十六進法で幾つだ？」なんて聞かれてもすぐに出てくるものではありません。
便利なことに、最近は Windows に付属する電卓がこの程度の変換はすぐにやってくれますので活用しましょう。
使うには Windows のメニューから、アクセサリにある電卓を起動します。
メニューの「表示」から、「プログラマ」を選択します。すると・・・
このような表示に変わります。ここでキーボード（もちろんテンキーも可）を用いて数字を入力します。
そして左の中ほどにある「16進」のラジオボタンを選択します。
入力した値が十六進表記の D6 に変わりましたね。こんな風に、手軽に十進表記と十六進表記の変換を行ってくれます。
コンピュータにおける十六進法
さきほどコンピュータに用いられる bit が「二進法における桁数」のことだと説明しました。これは純然たる数学と情報科学（ないし情報工学）の違いとも言うべきものですが、紙や黒板で計算するのと違い、コンピュータで計算するにおいては扱う数の桁数に上限があるのです。
いまどきの家庭用コンピュータはふつう
- CPU：計算を担う
- 記憶装置（メモリや HDD など）：データを置いておく
という主要な部品を持っていますが、CPU は決められた桁数ごと、つまり 32bit CPU なら 32bit ずつ、64bit CPU なら 64bit ずつのデータを処理するように設計されていて、それを超える桁数のデータを扱うことは原則として出来ません。
また、各種の記憶装置はデータを記憶するにあたって、データごとに決まった桁幅を確保するようにしくみになっています。
どういうことかというと・・・たとえば先ほどの 356 は二進法で 1 0110 0100 だといいましたけども、データの幅が 16bit 確保されているならば丸々 16 桁使って 0000 0001 0110 0100 というように記憶します。左の七桁が開いているからといって、そこを詰めたりすることはしないのです。
なぜかというと、メモリ上には延々と 0 と 1 ばかり並ぶので、データを詰めて配置してしまうとどこが区切りだか分からなくなってしまうからです。たとえば先ほどの 356 * 214 = 76184 という数式をコンピュータに計算させるとしましょう。掛け算自体は CPU がやってくれますが、計算させるためにはメモリを経由して CPU に値（ここでは 356 と 214 ）を渡し、また計算結果（ここでは 76184 ）をメモリ経由で CPU から返してもらう必要があるので、一時的にメモリ上にこれらの数字が配置されることになります。
それがたまたま隣り合って配置されたときに（空間を詰めて） 1011001001101011010010100110011000 などと配置されてしまうと、どこで区切ればよいか分からなくなってしまうんですね。
たとえばこれを 1011001001 * 1010110100 = 10100110011000 と解釈してしまうと、713 * 692 = 2998 という風な計算をしたことになってしまい、誤った結果が導かれてしまうわけです。
ですから、そういうことが起きないようにコンピュータでデータを扱う際は何 bit ずつ扱うのかという取り決めが大事ですし、扱う値の最大値というものが常に重要な意味を持ってきたわけです。具体的には、
| bit 幅 | 値の範囲 | 十六進表記 |
|---|---|---|
| 8bit | 0 ～ 255（28-1） | 00 ～ FF |
| 16bit | 0 ～ 65535（216-1） | 0000 ～ FFFF |
| 32bit | 0 ～ 4294967295（232-1） | 00000000 ～ FFFFFFFF |
| 64bit | 0 ～ 18446744073709551615（264-1） | 0000000000000000 ～ FFFFFFFFFFFFFFFF |
に限られています*3。
ここでは 8bit 値が 0 ～ 255 の範囲の値（十六進表記で 00 ～ FF ）を扱う、ということを覚えておいてください。コンピュータで画像を扱う際にはよく出てきます。
コンピュータで色彩を扱うということ
アナログとデジタル
いまどき普及したコンピュータの大半はアナログ式でなく、デジタルです・・・というと、「そんなの分かってる」といわれそうですが、実はこのアナログ／デジタルというのは本来の意味が正しく理解されず、なんとなくのイメージで誤用されている言葉の典型例でもあります。
たとえば、新橋辺りでサラリーマンにインタビューして世相の代替物としている安直なテレビ／ラジオ番組は多いですが、中には「自分はアナログ人間なので」とかいってるお父さんがたまにいたりするじゃないですか。IT系のエンジニアはああいうのを見て「お前はアナログなんじゃなくてただの IT オンチだよ！」「アナクロとアナログを間違えてんじゃねえよこのポンコツ！」とイライラするのですが、本当のところ、アナログ／デジタルというのはこんな意味なのです。
- アナログ
- analogue 日本語では「連続的」。連続的な数量（必ずしも割り切れない量）を、別の連続的な量に置き換えて処理する仕組み。
- デジタル
- digital 日本語では「離散的」。連続的な数量を、離散的な数値（一定間隔でとびとびになった値）に置き換えて処理する仕組み。
その代表的な例は体温計です。
若い方はご存じないかもしれませんが、八十年代か九十年代くらいまでの体温計はアナログ式のものが普通でした。
イラスト：素材ライブラリー
言ってみれば、これは水銀やアルコールなどの流体が封じ込めてあるガラス管です。一方の端は金属製で熱をよく伝えるようになっているわけですが、体温によって暖められると中の流体が膨張するので、その物理的性質を利用して体温という連続量を体積という連続量に置換する器具というわけです（そうすることで体温という目に見えないものが目に見える形で表現することが出来ます）。
ところが、いまどきのデジタル式体温計はもっと複雑な処理を行っています。
イラスト：素材ライブラリー
たいていはサーミスタという部品を用いているのですが、これは温度によって電気抵抗が変化する性質を持っており、回路に流れる電流の変化で体温を検知する仕組みになっています。
まあ、そこだけみれば「水銀とは別方式のアナログ」といえるのですが、違うのはそこから先の処理です。デジタル式体温計は（あんなに小さいのに）幾つかの集積回路を内蔵していて、この電流の変化を数値に置き換え、幾つかの計算を行った後に液晶画面に体温として表示するようになっています。
初期のデジタル式体温計は測定するのに三分くらいかかりましたよね。これは、体温がちゃんと体温計に伝わって、正確な体温が測れるようにするためにそのくらい時間がかかったのです（アナログ式と同じ理由です）。
ところが、最近のデジタル式体温計はもっと短い時間（四十秒とか）で計測できます。これは厳密に言うと現在の体温をそのまま表示しているのではなく、計算結果によって予測しているのです。本当は三分くらいかかるのだけれども、測り始めて四十秒でこれくらい温度上昇があったから、残りの二分あまりでは更にこれくらい上がるだろう、という科学的な予測計算を行って体温を表示しているんです（その分、誤差はありますが）。
大げさに言えば、いまどきのデジタル体温計というのは超ちっちゃい専用コンピュータ入りくらいのすごいやつなのですが、その過程で体温という連続量（割り切れない数量）を数値に置き換えて計算を行っており、それがデジタル式たるゆえんなのです。
アナログ／デジタルの違いはそういうことで、いまどき普及しているコンピュータはほとんどがデジタル式、連続的な数量を扱うものではなく離散値、とびとびの数値を扱う道具です。
ですから色を扱うにおいても、コンピュータでは離散的な数値として扱うデジタル方式を取ります。
光の三原色と RGB 方式
コンピュータで色彩を扱う上での仕組みは幾つかあるのですが、ここでは比較的よく知られ、また CardWirth でも採用されている RGB 方式について説明します。
小学校の理科の実験で、太陽光をプリズムにあてて様々な色に分解したことがあると思いますが、太陽光や蛍光灯の光などは、さまざまな波長の光が混ざって成り立っています。そして、光に含まれる特定の波長の光線が強かったり弱かったりすると、それに応じて見える色も変わります。
ただ、生理学的に言えば、ヒトの目はすべての波長を等しく感じられるわけでもないのです。
網膜には赤い光に反応する細胞（L錐体）と緑*4の光に反応する細胞（M錐体）と青い光に反応する細胞（S錐体）の三種類があり、この三つの細胞がそれぞれ得た刺激の強弱によって、我々ヒトは色を感じる仕組みになっています。
ですからこれを利用し、テレビのモニターやコンピュータのディスプレイのような器具では、赤・緑・青の三種類の光を、適切な強さでブレンドすることで目的の色を出すことが可能なのです。
この赤・緑・青の三つの色を光の三原色と呼び、その強さ（割合）を指定することで色を表現する方法を RGB 方式と呼びます。RGB はもちろん Red Green Blue の頭文字ですね。
そして、前述のように「デジタル機器」では、この光の強さをデジタル方式で・・・つまり自然界に存在するような連続量ではなく、数直線の目盛りのような離散値で表す方式を取っているわけです。
コンピュータで一般に使われているのは赤・緑・青のそれぞれを 0 ～ 255 の 256 段階の強さで表現し、その三つの組み合わせで色を表現するものです。もっとも色が強い状態が 255 、色が弱い状態（真っ黒）が 0 です。
なぜこのような範囲の値が用いられるかは、前述の十六進法のセクションを読んでいれば分かりますよね。もちろんそれはちょうど 8bit の値で、コンピュータが扱うのに切りがよい値だからです。
この 8 bit 値を使って、たとえばセピア色は「赤が 143 、緑が 74 、青が 43 」というような具合に表現するわけですが、赤・緑・青それぞれの十六進法の値を連結して #6B4A2B というように表記することもよく使われます。この文字列は、以下のような構成要素で成り立っています。
- 冒頭の # は十六進表記を使った色の指定であることを意味しており、ウェブページの色指定（ HTML や CSS）によく使われる方法
- 最初の十六進二桁分、6B は赤の強さを意味する
- 中央の十六進二桁分、4A は緑の強さを意味する
- 最後の十六進二桁分、2B は青の強さを意味する
これらを総合し、結果として前述のセピア色を意味する指定となっているわけです。このように十六進表記を三つ並べる方法を「十六進トリプレット」などと呼ぶことがあります。
エフェクトブースターにおける色指定
エフェクトブースターでも、前回までに扱った color パラメータや backcolor パラメータで色を指定する際には、この十六進トリプレットを用います*5。
ただし、エフェクトブースターでは前述の # 記号ではなく、$ 記号を用いて指定する決まりになっています*6。赤は $ff0000 、緑は $00ff00 、青は $0000ff という具合ですね。
表記は大文字／小文字のどちらでも OK で、 $Ff0000 でもちゃんと赤と認識してくれます。ただし全角はダメです。
さらに、赤と緑を混ぜた $ffff00 は黄色、緑と青を混ぜた $00ffff は水色（シアン）、青と赤を混ぜた $ff00ff は赤紫（マゼンタ）となります。
他にも典型的な色について以下に示しておきます。
| 名前 | 英語表記 | RGB表記 | 色 |
|---|---|---|---|
| 黒 | black | $000000 | ________________________________ |
| えび茶色 | maroon | $800000 | ________________________________ |
| 赤 | red | $ff0000 | ________________________________ |
| オリーブ色 | olive | $808000 | ________________________________ |
| 黄色 | olive | $ffff00 | ________________________________ |
| 緑 | green | $008000 | ________________________________ |
| ライムグリーン | lime | $00ff00 | ________________________________ |
| 青緑 | teal | $008080 | ________________________________ |
| 水色 | cyan | $00ffff | ________________________________ |
| 濃紺 | navy | $000080 | ________________________________ |
| 青 | blue | $0000ff | ________________________________ |
| 紫 | purple | $800080 | ________________________________ |
| 赤紫 | magenta | $ff00ff | ________________________________ |
| 灰色 | gray | $808080 | ________________________________ |
| 銀色 | silver | $c0c0c0 | ________________________________ |
| 白 | white | $000000 | ________________________________ |
正誤情報
ここでひとつ、WirthBuilder 付属のヘルプファイル editor128.chm の誤りを指摘し、訂正しておきます。
同ファイルによれば
backcolor="$１６進数値"
赤、緑、青の順番でフォントの色を設定します。十六進数値とはhtmlにおけるものと同じです。例：$000000～黒、$ff0000～赤、$00ffff～水色、$707070～灰色。初期値は白です。
color="$１６進数値"
赤、緑、青の順番で背景の色を設定します。十六進数値とはhtmlにおけるものと同じです。例：$000000～黒、$ff0000～赤、$00ffff～水色、$707070～灰色。初期値は白です。widthとheightに値が設定されており、かつキャッシュもファイル名も無い時のみ機能します。
となっていますが、どちらのパラメータとも初期値（デフォルト値）は白（$ffffff）ではなく黒（$000000）が正解です。
どちらのパラメータもそれほどは使われないので問題になることは稀ですが、色を扱った話題のついでに正しい情報を記載しておくことにします。
まとめとおさらい
今回はだいぶ広範囲にわたる話題について扱いましたが、エフェクトブースターを使用するに当たっては最後のセクションで示した十六進トリプレットによる色の指定方法だけ覚えておけばじゅうぶんです。
- color や backcolor パラメータで色を指定するには $ 記号に続けて赤・緑・青の強さを十六進二桁で表記する
次回はエフェクトブースターの話題に戻り、画像の加工について扱う予定です。
| 戻る：基礎編（その五） |
*1 年配者の中には「コンピュータは二進法の世界だから」とかワケ知り顔にいう人がいますが、だいたいシロウトさんです
*2 かつては八進法もそれなりに使われましたが、話が煩瑣になるので割愛します
*3 厳密にはこれらは「符合なし整数」と呼ばれるもので 0 及び自然数のみを扱いますが、マイナスを含めた整数を扱う場合は「符号付き整数」というものが使われます。たとえば 8bit の符合なし整数は 0 ～ 255 ですが、符号付き整数の場合は -128 ～ 127 の範囲になります
*4 一般には「緑」と呼んで済ませてしまっていますが「光の三原色における緑」はふつうの日本語における「緑色」よりかなり明るく、「ライムグリーン」とでも言ったほうが適切かもしれません
*5 このほかにテキストをセルとして扱う JPTX では fontcolor というパラメータがあり、これも同様に十六進トリプレットで表記します
*6 実際には $ だけでなく # も使えますが、WirthBuilder 添付のヘルプファイル editor128.chm には $ を使って表記する旨の記載がありますので、このチュートリアルでは $ を使う表記法を用いることにします
コメント
最新を表示する
NG表示方式
NGID一覧