Being Digital · Sampling / Bits / Encoding / Compression

情報のデジタル化世界はどうやってビットになるのか

スマホで撮った写真、いま聴いている音楽、送ったメッセージの文字、口座の残高 — コンピュータの中では、すべて0と1の列です。 それは魔法ではありません。測る・丸める・番号をつけるという、 たった3つの操作の積み重ねです。 この教材では、その原理から出発して、 数・文字・画像・音・圧縮の仕組みを順にたどります。 使う数学は2倍と足し算だけ。すべてのデモは、触って動かせます。

学習を始める ↓
Section 1

Being Digital — ひとつのビット列、6つの顔

同じ0と1の列が、数にも文字にも色にもなる

1995年、MITメディアラボの創設者ニコラス・ネグロポンテは、 著書『ビーイング・デジタル』で来たるべき変化をひと言で表しました — 「アトム(物質)からビット(情報)へ」。 新聞も、写真も、音楽も、映画も。紙やフィルムやレコード盤という「モノ」で運ばれていた情報が、 すべて同じ0と1の列になり、1本の回線で送れて、1台の機械で扱えるようになる。 30年後のいま、私たちはその予言の中に住んでいます。

でも「すべてが0と1になる」とは、具体的にどういうことでしょうか。 下のデモにあるのは、たった32個のビット(=4バイト)です。 そしてこの同じビット列が、読み方の約束を変えるだけで — 大きな整数にも、マイナスの数にも、小数にも、4つの文字にも、1つの色にもなります。 どれか1ビットをクリックして、6つの顔が同時に変わるのを見てください。

つまりデジタル情報の正体は、ビット列読み方の約束(符号化)のセットです。 約束を知らなければただの0と1の羅列、約束があれば意味になる。 この教材はここから、その約束の中身をひとつずつ開けていきます — 整数の約束は Section 4・5、小数は Section 6、文字は Section 7、色は Section 8 で。

ビットをクリックして反転すると、6通りの読みが同時に変わる。プリセット「Helo」は英単語4文字をASCIIで書いたビット列 — 同じ列が整数として読めば約12億、色として読めばくすんだ青緑になる。

Section 2

連続な世界を、数える — 標本化と量子化

デジタル化とは「とびとびに測って、目盛りに丸める」こと

世界はアナログ(連続)です。地形の起伏はどこまでもなめらかで、 光の明るさにも音の大きさにも「段」はありません。 一方コンピュータが覚えられるのは、有限個の数字だけ。 この橋渡しがデジタル化で、中身はたった3つの操作です。

① 標本化(サンプリング) … 連続なものを、とびとびの点で測る ② 量子化 … 測った値を、用意した目盛りに丸める ③ 符号化 … 目盛りの番号を、0と1で書き留める

身近な例が、地図の等高線です。なめらかな山の高さを「10mごと」の段に丸めて 線で描いたもの — つまり標高の量子化です。 天気予報のグラフも、連続して変わる気温を1時間おきに測った点の列 — 時間の標本化です。 私たちはコンピュータが生まれるずっと前から、連続な世界を「とびとび」にして記録してきました。

下のデモは、山の断面(地形のプロファイル)をデジタル化する装置です。 測る間隔を粗くすると小さな谷が消え、目盛りを粗くすると斜面が階段になる — 「何を捨てて、どこまで残すか」を2本のスライダーで体感してください。 右下に出るデータ量(測点の数 × 1点あたりのビット数)にも注目。 品質とデータ量は、常にトレードオフです。

「測点の数」=標本化の細かさ、「目盛り」=量子化の細かさ。誤差表示をONにすると、元の地形との差(=捨てた情報)が赤く塗られる。地形はプリセットで切替可。

Section 3

ビット — 「はい/いいえ」で世界を半分にする

6つの質問で、64個の中からひとつを言い当てる

符号化の材料になるのがビット(bit = binary digit)です。 照明のスイッチのように、0か1か・OFFかONか — 2択の質問ひとつ分の答えが1ビット。これが情報の最小単位です。 1948年、数学者クロード・シャノンは「どんな情報も、この2択の答えの列で数えられる」ことを示し、 情報を量として測る道を開きました。すべてのデジタル技術の出発点です。

ビットの本当の凄みは、倍々の爆発力にあります。 質問がひとつ増えるたびに、区別できるものの数は「+2」ではなく「×2」。

n ビット → 2ⁿ 通り (10ビット=1024通り、20ビット≈100万通り、30ビット≈10億通り)

下のデモで実感してください。0〜63の好きな数をひとつ、頭に思い浮かべて、 「◯以上ですか?」という質問に6回答えるだけで、その数をぴったり言い当てます。 タネは単純 — 1回の質問で候補が半分に減るので、64 → 32 → 16 → 8 → 4 → 2 → 1。 そして最後に種明かしがあります。 あなたの6個の答え(はい=1、いいえ=0)を順に並べたものは、 実はその数の2進数表記そのものなのです。 「質問の答えの列」と「数の書き方」が同じものだった — 次のセクションで正体を見ます。

スタートを押し、思い浮かべた数について「はい/いいえ」で答える。1回答えるごとに候補(明るいマス)が半分に減っていく。6問目で確定。

Section 4

数を書く — 2進法と16進法

10進は10倍ごと、2進は2倍ごと。#FF6600 も実は数

ビットの列で「数」を書く方法が2進法です。 仕組みは私たちの10進法と同じ位取り — 10進が右から 1, 10, 100…(10倍ごと)の位なのに対し、 2進は右から 1, 2, 4, 8, 16…(2倍ごと)の位。 各位に0か1を置き、1が立っている位の重みを足すだけです。

1101₂ = 8 + 4 + 0 + 1 = 13

これが2進→10進のデコード(読む方向)。 逆に10進の数を2進にするエンコード(書く方向)には、 「2で割って、余りを下から読む」という手順が使われます。

13÷2=6 …1 → 6÷2=3 …0 → 3÷2=1 …1 → 1÷2=0 …1 ⇒ 余りを下から読んで 1101₂

8ビットをひとまとめにしたものが1バイトで、0〜255の256通り。 ファイルサイズの KB・MB・GB は、このバイトを千倍ずつ束ねた単位です。 下のカウンタで▶を押すと、2進の「繰り上がり」が見えます。 7(0111)から8(1000)に進む瞬間、3つの桁が一斉にひっくり返る — 10進で 99→100 に桁が繰り上がるのと同じことが、2進では頻繁に起きているだけです。

2進の弱点は、桁数が長くて人間が読みにくいこと。 そこで4ビットずつを1文字にまとめる速記法が使われます。これが16進法(0〜9とA〜F)。 実は多くの人がすでに使っています — Webの色指定 #FF6600 は 「赤255・緑102・青0」という3つのバイトを16進で書いたものです(詳しくはSection 8で)。

ビットのカードをクリックしてON/OFF。▶で自動カウント — 0111→1000 のような繰り上がりの連鎖に注目。下段に10進・16進の読みが常に表示される。

Section 5

マイナスの数 — 2の補数という発明

0と1しかない世界に、どうやって「−」を持ち込むか

ビットの世界に、マイナス記号はありません。ではどうするか。 素朴な案は「先頭の1ビットを符号(0=+、1=−)に使う」ことですが、 これだと +0 と −0 が両方できてしまい、 しかも足し算の回路を正負で作り分ける必要があって不便でした。

採用されたのは、車の走行距離計(オドメーター)のような一周する数直線です。 8ビットの世界では、255(1111 1111)に1を足すと桁があふれて 0 に戻ります。 なら「0のひとつ手前」をそのまま −1 と呼べばいい — 実際、1111 1111 に 1 を足すと 0 になるので、「+1すると0になる数」=−1として完璧に辻褄が合います。 これが2の補数表現。 「先頭ビットの重みだけをマイナス(−128)とみなす」と言い換えることもできます。

1111 1111 = −128 + 64 + 32 + 16 + 8 + 4 + 2 + 1 = −1

まず下のデモで、カードをクリックしながら「先頭の位だけマイナス」の感覚をつかんでください。 +127 に 1 を足すと −128 に「一周」します。これがオーバーフロー。 昔のゲームでスコアや残機が255を超えると0に戻ったり、 パックマンの256面目が壊れる有名なバグが起きたりしたのは、 8ビットカウンタのこの「一周」が正体です。

先頭のカードだけ重みが −128(赤)。カードをクリックして値を作るか、▶で+1し続けて +127 → −128 の「一周」(オーバーフロー)を観察。下の数直線で位置を確認できる。

では、負の数のビット列は具体的にどう作るのか。エンコードの手順は3ステップです。

① 絶対値を2進に … −3 なら、まず 3 = 0000 0011 ② 全ビットを反転 … 0000 0011 → 1111 1100(=255−3) ③ 1を足す … 1111 1100 + 1 = 1111 1101(=256−3=253)

つまり「−3」のビット列の正体は 256−3 です。 デコード(読む方向)は、先頭ビットが0ならそのまま、 1なら「256を引く」(=先頭の位を−128として足す)だけ。 そしてこの表現の最大の御利益が、引き算が足し算になること — A−3 を計算したければ A+253 を計算すればよく、あふれた9桁目を捨てると mod 256 の魔法で答えが合います。 下の加算器で、A と B を変えながら確かめてください。B をマイナスにすると、 右側に「なぜ引き算が足し算でできるのか」の種明かし(①→②→③)が現れます。

スライダーで A と B を変えると、2進の筆算がリアルタイムに変わる。「127+1」プリセットでオーバーフロー、「5−3」で引き算が足し算になる様子を確認。9桁目にあふれた1は捨てられる — それが mod 256 の正体。

Section 6

小数 — 浮動小数点という発明

0.1 は正確に書けない。電卓の 0.30000000000000004 の正体

次は小数です。小数点の位置を固定して書く方法(固定小数点)もありますが、 それでは銀河の距離と原子の大きさを同じ形式で扱えません。 採用されたのは、科学の記数法 6.02 × 10²³ と同じ発想 — 数を「仮数 × 2の指数乗」の形で持ち、小数点の位置を指数で自由に動かす方式です。 小数点が「浮いて動く」から浮動小数点(floating point)。 世界共通の規格が IEEE 754(1985年)で、32ビット版の内訳はこうです。

[符号 1bit][指数 8bit][仮数 23bit] → 値 = (−1)^符号 × 1.仮数 × 2^(指数−127)

ここに、多くの人が知らない事実があります。 10進の 0.1 は、2進では 0.0001100110011… と無限に循環して、正確には書けません。 1/3 が10進で 0.333… になるのと同じ現象が、10進の「きりのいい数」で起きるのです。 だから電卓アプリやプログラムで 0.1 + 0.2 = 0.30000000000000004 という 不思議な答えが出ることがある。バグではなく、2進小数の宿命です。 下のデモで「0.1」を選ぶと、コンピュータが実際に格納している値が 0.100000001490116… であることを、正確な10進表記で確かめられます。

32個のビットをクリックして直接いじるか、プリセット/入力欄から数を与える。「格納されている正確な値」の行で、0.1 が本当は 0.1 でないことを確認。×2/÷2ボタンで、指数が1変わるだけで値が倍・半分になるのも見どころ。

仕組みが見えたところで、こんどは10進の数からこの32ビットが作られる エンコードの過程と、ビット列から数に戻すデコードの過程を、 手順どおりに追ってみましょう。 整数部は Section 4 の「2で割って余りを読む」、小数部は「2を掛けて、1を超えたらその桁は1」。 あとは科学の記数法と同じように 1.xxx の形にそろえ(正規化)、 指数に127を足して記録し、仮数は先頭の1を省いて23ビットしまう(隠れビット)だけです。 プリセットの「0.1」では、×2の手順が無限に繰り返される様子 — つまり0.1が2進で書き切れない理由そのもの — が見えます。

左=エンコードの過程(①符号 ②2進に変換 ③正規化 ④指数+127 ⑤仮数と隠れビット)、右=できたビット列を数に戻すデコードの過程。プリセットや入力欄で数を変えると全手順が引き直される。

Section 7

文字 — 文字コード戦国時代からUnicodeへ

「A」は65という約束。そして日本語をめぐる長い混乱

数が書けたら、次は文字です。原理は拍子抜けするほど単純 — 文字に番号を振って、番号を2進で書く。それだけです。 この対応表を文字コードと呼びます。 出発点は1963年制定の ASCII(アスキー)。 7ビット・128文字の表に、英字・数字・記号と改行などの制御文字を収めました。 A=65、B=66、a=97、スペース=32 — この割り当ては60年後の今もそのまま生きています。 下の表で文字をクリックしてみてください。 大文字と小文字の差はちょうど32、つまりビット1個の違い — これも設計です。 余った8ビット目は、通信中の誤りを見つけるパリティビットに使われていました。

ASCIIコード表(128文字)。文字をクリックすると 文字=番号=16進=2進 の対応と、8ビット目のパリティ(1の個数を常に偶数にして、通信エラーを1ビットまで検出する仕掛け)が表示される。

さて、問題は日本語でした。漢字は数万字あり、128どころか1バイト(256通り)でも全く足りません。 1978年、日本は約6800字に番号を振ったJIS漢字コードを制定します。 ところが「その番号を実際のバイト列にどう埋め込むか」で、道が分かれました。

  • Shift_JIS(1982年〜) — 当時すでに使われていた半角カナと衝突しないよう、 コード表の空いている隙間に漢字を「ずらして(シフトして)」詰め込んだ方式。 パソコンや携帯電話(ガラケー)で広く普及した。
  • EUC-JP(1980年代) — ASCIIと絶対に衝突しないよう、 漢字の各バイトを「最上位ビットが1」の領域に置いた方式。UNIXサーバーの世界で普及した。

JIS漢字コードは、94行×94列の大きな表の番地で文字を指定します。 たとえば「大」は34行目の71番目 — これを34区71点と呼びます(区点番号)。 Shift_JISもEUC-JPも、出発点は同じこの区点番号。違うのは、 そこからバイト列を作る計算規則だけです。 EUC-JPの規則はひとつだけ — 各バイトの最上位ビットを1にする(+0x80)。 先頭ビットが必ず1になるので、先頭が0のASCIIと絶対に衝突しません。 一方Shift_JISは曲芸的です。当時すでに半角カナがコード表の 0xA1〜0xDF を占領していたため、 残されたわずかな隙間に約6800字を詰め込む必要がありました。 使える1バイト目が94個もない — そこで2つの区を1つの1バイト目に相乗りさせ、 2バイト目の前半/後半でどちらの区かを区別する、という計算をします。 この「ずらして詰める」操作こそが Shift(シフト)の名の由来です。 下のラボで、同じ区点番号が2通りのバイト列に化ける過程を追ってください。

同じJIS区点番号から Shift_JIS と EUC-JP のバイト列が計算される過程。「字」では 0x7F(DEL)を欠番として飛ばす例外が、「薔」(73区)では半角カナ領域 0xA0〜0xDF を丸ごと飛び越える例外が発動する。

こうして同じ「大」という字が、方式ごとにまったく違うバイト列になりました。 書いた側と読む側で方式がずれれば、正しいビット列が意味不明の文字列になる — これが文字化けで、1980〜90年代の日本のパソコン通信とメールは、まさに文字化けとの戦いでした。 下のラボで体験できます。文字を打つとビット列に分解され、 それをわざと違う対応表で読むと、ビットは1つも壊れていないのに読めなくなります。

入力欄に自由に文字を打つと、1文字ずつビット列(UTF-8)に分解される。下の文字化けシミュレータは、同じバイト列を別の対応表で読むとどうなるかの実演。

決着をつけたのが、1991年の Unicode — 世界中の文字にひとつの台帳で番号を振る計画です (現在15万字超。絵文字もこの台帳に載っています)。 そして台帳の番号をバイト列にする書き方の代表が UTF-8(1992年)。 考案者のケン・トンプソンが、食堂のランチョンマットに設計を書き付けたという逸話で知られます。 その設計は見事のひと言で、①ASCIIの文字は1バイトのまま完全互換、 ②日本語などは2〜4バイト、③先頭バイトの1の並びが「この文字は何バイトか」を宣言する (1110xxxx なら3バイト)。過去と未来を両立させたこの方式が、いまやWebの98%以上を占めています。

では、1文字がUTF-8のバイト列になるエンコードの過程を追ってみましょう。 手順は「台帳の番号を調べる → 番号を2進に → 番号の大きさでテンプレートを選ぶ → テンプレートの x の位置に流し込む」。 デコードは逆向きで、先頭バイトのヘッダを読めば何バイトの文字かが分かり、 ヘッダを外して残りをつなげば台帳の番号に戻ります。

A(1バイト)→ é(2バイト)→ あ(3バイト)→ 😀(4バイト)と切り替えると、テンプレートが変わる。オレンジ=ヘッダビット(バイト数の宣言と「続き」の印)、水色=台帳番号の中身。

最後に、同じ文字列を3つの方式で並べて見比べます。歴史の縮図です。

同じ文字列が Shift_JIS / EUC-JP / UTF-8 でどんなバイト列になるかの比較。英数字はどの方式でも同じ1バイトになる(ASCII互換)ことにも注目。

Section 8

画像 — 光を升目で数える

ピクセルは空間の標本化、階調は光の量子化

写真も画面の表示も、Section 2の原理を2次元に広げたものです。 画面を升目に区切り(空間の標本化 → ピクセル)、 各マスの光を赤・緑・青の3つの数に丸める(光の量子化 → RGB階調)。 ふつうは各色8ビット(0〜255)なので、1ピクセルは 24ビット=3バイト。 表せる色は 256³ ≒ 1677万色です。

#FF6600 → R=FF(255), G=66(102), B=00(0) — カラーコードは3バイトの16進表記

下のデモは夕景の街の画像です。レンズを動かすと、 なめらかに見える絵が実は数の升目であることが見えます。 「解像度」を下げるとディテールが溶け(標本化不足)、 「階調」を下げると空のグラデーションに縞模様(バンディング)が現れます(量子化不足)。 夜空や夕焼けのグラデーションにたまに見えるあの縞の正体は、これです。

画像の上でポインタを動かすとルーペがピクセルとRGB値を拡大表示。「解像度」=升目の細かさ、「階調」=1色あたりのビット数。R/G/Bボタンで光の三原色に分解できる。

Section 9

ベクタ — 拡大しても崩れない絵

升目に塗るか、描き方を覚えるか。フォントが常に美しい理由

絵の持ち方には、升目に塗るラスタのほかにもう一系統あります。 「(100, 50) から (400, 80) へ太さ2の線」「中心 (200, 100)・半径40の円」のような 描き方の指示書を数値で持つ方式 — ベクタです。 表示するたびに数式から描き直すので、どんなに拡大しても輪郭がシャープなまま

いちばん身近なベクタはフォントです。 画面の文字がどんなサイズでも滑らかなのは、文字の輪郭が曲線の数式として定義されているから。 地図アプリをいくら拡大しても道路や文字がきれいなのも、同じ仕組みです。 意外なところでは絵文字😀も実はフォント — つまりベクタです。 逆に、写真のような複雑な光と色はとても数式では書けないので、ラスタの出番。適材適所です。

持ち方得意苦手
ラスタ(升目)写真、スクリーンショットどんな絵でも写せる拡大するとギザギザ
ベクタ(指示書)フォント、地図、ロゴ、絵文字拡大に強い・データが軽い写真のような複雑さは書けない

下のデモは同じ絵を、左=ラスタ(一度升目に塗ったもの)、右=ベクタ(毎回描き直すもの)で 表示しています。ズームを上げると、同じ絵だったはずの2枚に何が起きるか。

ズームスライダーを上げて左右を見比べる(ドラッグで見る場所を移動)。文字のカーブ、円の輪郭の差に注目 — ラスタは升目が拡大されるだけ、ベクタは数式を引き直す。

Section 10

音 — 時間を輪切りにする

1秒を44100回。標本化定理という驚くべき保証

音は空気の圧力が揺れる連続の波です。 これをデジタル化するには、時間方向に標本化します — CDなら1秒間に44100回、 波の高さを測って16ビット(65536段階)に量子化する。 つまり音楽CDの正体は「1秒あたり44100個の数の列」です。

ここで、デジタルの常識を変えた定理があります。 標本化定理(ナイキスト=シャノン)— 「含まれる最高の周波数の2倍より速く標本化すれば、元の連続波形を完全に復元できる」。 十分細かく測れば、デジタルは劣化コピーではなく完全な記録になるのです。 人間の可聴域は約20kHzまで。その2倍+余裕が、44100回/秒の由来です。

逆に標本化が遅すぎると、高い音が別の低い音に化けます(エイリアシング=折り返し)。 映像で車輪が逆回転して見えるのと同じ現象です。 下のデモで波形を目で見ながら、サンプリングを粗く・階調を浅くした音を実際に聴いてください。 高音がこもり、ザラザラしたノイズが乗る — スライダーの意味が耳でわかります。

オレンジの線=元の連続波形、水色の階段=デジタル化した波形(拡大表示)。▶ボタンで「元の音」と「いまの設定でデジタル化した音」を聴き比べ。音量にご注意。

Section 11

圧縮 — 同じ情報を、短く書く

36MBの写真がなぜ3MBで済むのか。「写真はJPEG、文字はPNG」の理由

Section 8で見たとおり、スマホの写真は無圧縮なら36MB。1時間の音楽は600MB。 そのままでは送るのも貯めるのも大変です。 そこで圧縮 — 情報を捨てずに言い方だけ短くする工夫です。 最も素朴なのがランレングス符号化(RLE): 「白白白白白白白黒黒」を「白7黒2」と書く。 同じ値が続くデータほどよく縮み、 逆にノイズのような規則性のないデータはまったく縮みません(むしろ増える)。 圧縮とは規則性の発見なのです。もうひとつの古典がハフマン符号(1952年) — よく出る文字ほど短いビット列を割り当てる方法で、 発想は「頻出のEに最短の符号(トン)」を与えたモールス信号(1837年)と同じです。 作り方が見事で、出現回数の少ないもの同士を下からつないで木を組み、 枝の左右を0と1にすると、最適な符号表がひとりでに出来上がります。 考案者ハフマンは当時まだ大学院生 — 期末レポートのために思いついた方法が、 ZIPやPNG、JPEGの中で今も働いています。

ここで素朴な疑問が湧きます。符号の長さが文字ごとにバラバラ(Aは1ビット、Bは3ビット…)なら、 受け取った0と1の連続を、どこで区切って読めばいいのでしょう。 区切り記号は入っていないのに、です。からくりは「どの符号も、他の符号の先頭部分になっていない」 という性質にあります(これをプレフィックス符号=接頭辞符号と呼びます)。 たとえば A に 0 を割り当てたら、他のどの文字の符号も 0 で始まらない (B は 101、N は 11…)。だから 0 と読めた瞬間、迷わず「A で1文字ぶん確定」と判断できます。 この性質は、ハフマンの木の作り方から自動的に保証されます — 文字は必ず葉(枝の先端)に置かれ、 葉に至る途中では文字が確定しないからです。

だからデコード(復号)は木を根からたどるだけ。 ビットを1つ読んで、0なら左の枝、1なら右の枝へ進む。 葉に着いたらそこが1文字ぶんの区切りで、その文字を書き出し、また根に戻って次のビットへ。 これを繰り返せば、区切り記号なしの一本の0/1の列が、元の文章にぴたりと戻ります。 下のラボの符号列で、実際に木の根から指でたどってみてください。

ここまでは元に戻せる可逆圧縮。もっと縮めたいときは、 人間が気づかない情報を捨てるという大胆な手に出ます。これが非可逆圧縮です。 JPEGは「目は細かい模様の変化に鈍い」という視覚の癖を突いて写真を1/10以下にし、 MP3は「大きな音の直後の小さな音は聞こえない」という聴覚の癖を突きます。 ただし副作用があり、JPEGでくっきりした線や文字のまわりに現れるモヤモヤ(モスキートノイズ)はその代表。 だから写真はJPEG、文字やイラストの画像はPNG — よく聞くこの使い分けには、ちゃんと理由があります。

下のラボの「RLE」モードでは、マス目にお絵かきしながら圧縮率がリアルタイムに変わるのを見られます。 「ハフマン」モードでは、入力した文字列から符号の木が組み上がり、 よく出る文字に短い符号が割り当てられていく様子が見られます。 「JPEG画質」モードでは、本物のJPEGエンコーダで画質とファイルサイズのトレードオフを操作できます。 文字・線画に切り替えて低画質にしたときのモスキートノイズは必見です。

RLEモード:ドラッグで黒マスを描くと下に符号列と圧縮率が出る。「ノイズ」プリセットで圧縮が破綻するのも見どころ。ハフマンモード:文字列を打ち替えると木と符号表が組み変わる。「AAAAABBC」のような偏った文字列ほどよく縮む。符号列(区切りのない0/1の並び)を木の根からたどると復号できる。JPEGモード:画質スライダーを下げてサイズとノイズの関係を観察(ブラウザの実JPEGエンコーダを使用)。

最後に、この教材で通ってきた「情報のデジタル化」の歴史を一望します。

  1. 1837モールス電信 — 文字を長短2種の信号列で送る。実用デジタル通信のはじまり
  2. 1948シャノン『通信の数学的理論』— ビットの誕生。情報が「量」になる
  3. 1952ハフマン符号 — 大学院生の期末レポートから生まれた可逆圧縮の古典
  4. 1963ASCII制定 — A=65 の約束が生まれる
  5. 1978JIS漢字コード制定 — 日本語のデジタル化が始まる(方式乱立の時代へ)
  6. 1982音楽CD発売(44.1kHz/16bit)、Shift_JIS 登場
  7. 1985IEEE 754 — 浮動小数点の世界標準
  8. 1991Unicode 1.0 — 世界の文字にひとつの台帳
  9. 1992JPEG規格、UTF-8考案 — 画像と文字の共通言語が揃う
  10. 1995MP3公開、ネグロポンテ『ビーイング・デジタル』— アトムからビットへ
  11. 2007スマートフォン登場 — 写真・音・文字・地図が1台の中で全部ビットに
Section 12

考えてみよう

日常の「なぜ」に、原理で答えられるか

Q1. 小さな画像を引き伸ばすとギザギザになるのに、文字はどんなに拡大しても滑らか。なぜ?

画像はラスタ(升目の集まり)なので、拡大すると升目がそのまま大きくなります(Section 8・9)。 いっぽうフォントはベクタ — 文字の輪郭が数式で定義されていて、表示のたびに描き直されるからです。 地図アプリや絵文字が常に滑らかなのも同じ理由です。

Q2. 文字がたくさん写ったスクリーンショットをJPEGで保存したら、文字のまわりがモヤモヤに。なぜ?

JPEGは「細かい模様の変化には鈍感」という視覚の癖を突いて情報を捨てる非可逆圧縮です(Section 11)。 写真では気づきませんが、文字のような急なエッジでは捨てた成分がモスキートノイズとして見えてしまいます。 PNGは可逆圧縮なので1ピクセルも変わりません。文字・イラストはPNGが正解です。

Q3. 夜空や夕焼けのグラデーションに、縞模様が見えることがある。あれは何?

バンディングです。各色8ビット=256段階という量子化の目盛りが見えてしまう現象(Section 2・8)。 ゆるやかなグラデーションでは、隣り合う目盛りの差が広い面積で並ぶため、段差が縞として知覚されます。 高級なテレビが「10bitパネル」を売りにするのは、この目盛りを1024段階に増やして縞を消すためです。

Q4. 電卓アプリで 0.1 + 0.2 を計算したら 0.30000000000000004 になった。壊れてる?

壊れていません。0.1 も 0.2 も、2進数では無限循環小数になり正確には格納できないため、 ほんのわずかに違う値どうしを足した結果です(Section 6)。 2進小数の宿命であり、だからお金の計算をするシステムは2進小数を避けて設計されています。

Q5. 古いWebページやメールで「譁�蟄怜喧縺�」のような文字列を見た。データは壊れた?

壊れていません。ビット列は無傷のまま、違う文字コード表で読まれただけです(Section 7)。 「譁�蟄怜喧縺�」は、UTF-8で書かれた「文字化け」という文字列をShift_JISとして読むと現れる典型パターン。 読み方(エンコーディング)を指定し直せば元に戻ります。Section 1で見た「ビット列+約束」の、約束を取り違えた例です。

Q6. 昔のゲームで、スコアやアイテム数が255を超えたら0に戻った。プログラマーのミス?

半分ミス、半分は仕組みです。8ビットのカウンタは256通りしか区別できず、255の次は一周して0に戻ります(Section 4・5)。 マイナスを扱う場合は+127の次が−128。パックマンの伝説の「256面バグ」も、 面数を数える8ビットカウンタのオーバーフローが原因でした。

Next Explorable 自由曲線の数学 — ベジェ曲線からNURBSへ Section 9で見た「フォントの輪郭は数式」の中身へ。文字やイラストの曲線の正体を、内分点だけで理解する姉妹教材。