色と動画のデジタル表現
赤・緑・青の 3 つのつまみで 1,677 万色が出せ、パラパラ漫画の要領で動画になる。どちらも数の組み合わせでできている
50分教師用メモ
準備 教室コードは新しいものにする。「教師」を押す。体験 01・03 は端末内で完結する。教室の照明を少し落とすと体験 01 の色が見やすい。
時間配分 前回まとめ・目標 4分 ／ 節1 3 つのつまみ 16分 ／ 節2 光と色の三原色 10分 ／ 節3 パラパラ漫画 14分 ／ まとめ・自己評価・ふりかえり 6分
教科書: 新編情報Ⅰ 16 色と動画のデジタル表現（p.46）。
この回の評価（指導要領 (2) ア(ア)。色と動画のデジタル化の方法。単元設計は 単元設計のページ）
- 知識・技能 光の三原色（RGB）で 1 画素 24 ビット・約 1,677 万色になる仕組みと、フレームレートで動画が作られる仕組みを説明している（体験01・03・まとめ）
- 思考・判断・表現 R・G・B を調整して指定の色を作れる（体験01）。光と色の三原色を場面で使い分け（体験02）、動画のデータ量を見積もれる（体験03）
- 態度 身のまわりの画面や印刷物を「何色の組み合わせか」の目で見ようとしている（ふりかえり）
ふりかえりの枚の自己評価の分布を見て、「まだ」が多い目標を次回冒頭で拾い直す。
区切りの数 × 1 区切りのビット数 ＝ データ量
白か黒なら 1 ビットで足りた。では、写真のような色を出すには 1 画素に何ビット要るのか。答えは、画面を虫めがねで見ると分かる
ディスプレイは、何色の光でできている
教師用メモ
前回「まだ」が多かったデータ量の計算を 1 問（口頭）。
授業の終わりにできるようになること
お題の色を作る
画面と紙で分ける
1 秒に何枚で動いて見えるか
3 つのつまみ
赤・緑・青の強さで、どんな色も
R・G・B を動かして、お題の色を作る
3 本のつまみが赤（R）・緑（G）・青（B）の光の強さ（0〜255）。左の色が変わる。まず 3 本とも 255 にして「白」を確かめ、次にお題の色に近づける。この画面は自分の端末だけ
教師用メモ
進め方（12分）
- 「3 本とも 255 → 白」「3 本とも 0 → 黒」を全員で。「赤だけ 255 → 赤」「赤と緑を 255 → 黄」。光を混ぜると明るくなる（加法混色）。
- お題（黄・紫・オレンジ・肌色など）を 3 つ作る。「近い」と出れば合格。
- 読み取り: 1 色 8 ビット（256 段階）× 3 色 = 24 ビット。256 × 256 × 256 = 16,777,216 通り（フルカラー）。16 進数の 6 桁は Web の色指定そのもの。
「肌色」が難しい。R を高く、G を中、B を低く。色は 3 つの数、が今日の核心。
1 画素 ＝ R・G・B の 3 つの数 ＝ 24 ビット
| 光の三原色 | ディスプレイの 1 画素は赤・緑・青の 3 つの光点。それぞれの強さの組み合わせで色を作る。3 つ全部が最大で白、全部 0 で黒（加法混色） |
| フルカラー | R・G・B をそれぞれ 8 ビット（256 階調）で表す。8 × 3 = 24 ビット。約 1,677 万色 |
| データ量 | 前回の式に入れる。1,920 × 1,080 のフルカラー画像は 1,920 × 1,080 × 24 ビット ≈ 6.2 MB（圧縮前） |
教師用メモ
目標 01。「なぜ 3 色で足りるか」は人の目に 3 種類の色を感じる細胞があるから、と一言。
光と色の三原色
画面は光り、紙は光を反射する
光の三原色か、色の三原色か
光を混ぜると明るくなり、白に近づく（加法混色）。インクを混ぜると暗くなり、黒に近づく（減法混色）。まず上で付ける印を選び、次にその印を付けるものを押す。全部に印を付けたら「答え合わせ」
教師用メモ
進め方（6分） 3 分で答え合わせ。「画面で作ったポスターを印刷すると色が違う」経験を聞く。光と反射で原理が違うから。印刷は 3 色で純粋な黒が出しにくく、黒（K）を足して CMYK。目標 02。
パラパラ漫画
1 秒に何枚めくれば、動いて見えるか
1 秒に何枚で、なめらかに見えるか
丸が左から右へ動く。つまみで「1 秒に切り替える枚数」（フレームレート）を変える。何枚あたりから「動いている」と感じるか、自分の目で探す。1 秒あたりのデータ量も見る
教師用メモ
進め方（10分） 1 から上げていく。10 あたりでカクカクが減り、24〜30 でなめらか、60 でさらに。テレビは 30 fps、映画は 24 fps、ゲームは 60 fps 以上のものも。
データ量 フルHD（1,920 × 1,080）フルカラー 1 枚 ≈ 6.2 MB。30 fps なら 1 秒で約 187 MB。「10 分の動画は？」→ 100 GB 超。だから圧縮が要る（次回）。目標 03。
動画 ＝ 静止画の連続 ｜ フレームレートで 30 倍
| フレーム | 少しずつ描き換えた 1 枚 1 枚の静止画。次々に表示すると連続して動いて見える（パラパラ漫画） |
| フレームレート | 1 秒あたりに表示するフレームの数。単位 fps。テレビ 30、映画 24、ゲーム 60 以上 |
| データ量 | フルHD・フルカラー 1 枚 ≈ 6.2 MB、30 fps で 1 秒 ≈ 187 MB。短い動画でも非常に大きい。だから圧縮する |
※ 4K は横 3,840 画素、8K は 7,680 画素。画素数が 4 倍、16 倍になる。フルHD の 2K は横約 2,000（1,920）から
教師用メモ
次回の圧縮につなぐ。「187 MB を数 MB に落として送っている。何を捨てている？」を問いとして残す。
色の段階を減らして、先に崩れるのはどちらか
色は 3 つの数で、動画は 1 秒あたりの枚数で決まる。数を変えて見え方を確かめる
確かめる前に、いまの予想を 1 つ選ぶ。当たっていなくてよい。予想を置いておくと、違ったときに気づける
選んだ人数が右に出る。分かれているところを 1 つ読み上げてから次へ
教師用メモ
予想を先に（2分） 先に道具を開くと、触って終わる。予想を置いてから確かめると、違ったところが残る。
6分。2 つの道具を続けて使う。データ量とのつり合いに触れる。
道具は外で公開されている Web アプリ。この授業のページの中で開くので、別のページへは移らない。閉じれば、そのままこの枚に戻る。ブラウザの中で動き、入力はこの授業のサーバーには送られない。
道具で確かめて、予想と合っていたかを見る
- 「この枚で開く」を押す
- 階調を減らす
- 写真と、色が少ない絵で、崩れ方が違うことを見る
- 「この枚で開く」を押す
- 1 秒あたりの枚数を減らす
- 動きがぎこちなくなる境目を探す
教師用メモ
進め方 手順のとおりに触らせる。終わったら前の枚の予想と見比べ、外れた人を 2 人読み上げる。
6分。2 つの道具を続けて使う。データ量とのつり合いに触れる。
道具は外で公開されている Web アプリ。この授業のページの中で開くので、別のページへは移らない。閉じれば、そのままこの枚に戻る。ブラウザの中で動き、入力はこの授業のサーバーには送られない。
3つの目標に、自分の操作で答える
今日の目標、自分はどこまで
3 つの目標それぞれに、できた／だいたい／まだ、を 1 つ選ぶ。右の帯にクラス全体の分布が出る
教師用メモ
1 分。「まだ」が多い目標は、次回の冒頭で拾い直す。
身のまわりで「3 つの数」でできている色を一つ
一文でよい。今日の体験のどれかに触れて書く
教師用メモ
3 分。次回は圧縮。「1 秒 187 MB をどう小さくするか」を予告。