画像ファイルの形式による違い

様々な形式で保存し、
画質、ファイルサイズの違いを比較しよう。

科目の中の位置づけ

社会と情報（１）イ情報のディジタル化
社会と情報（１）ウ情報の表現と伝達
社会と情報（２）ウ情報通信ネットワークの活用とコミュニケーション
情報の科学（１）アコンピュータと情報の処理

実習内容

ねらい

　画像をいろいろな形式、圧縮率、色数で保存した場合のサイズや画質の違いについて比較し、保存形式の特徴について体験的に理解させる。
　さらに、ファイルの転送時間について見積もり、情報通信の効率的利用について考えさせる。
また、色を数値で表現する方法などの画像情報のデジタル化の仕組みについてもふれる。

実習に必要なもの

”ペイント”（Windowsのアクセサリー）
”Microsoft Photo Editor”・・・写真などの画像を表示、編集するソフト
（Microsoft Officeに付属。Windows2000では、オプションで追加インストール。）
”Pixia”・・・写真などの画像を表示、編集するソフト（JPEGで圧縮率を変えて保存するのに利用）
（フリーソフト　右記URLよりダウンロード可） http://www.pixia.jp/download/win.htm
必要により、”HexView”・・・ファイルを１６進数表示するソフト
（フリーソフト　右記URLよりダウンロード可）　http://hp.vector.co.jp/authors/VA003058/hexview.html
実習プリント
プリント例プリント例を作成しました。
表示するときは、ファイル名をクリックしてください。
"print.doc" Word 97-2003文書（36KB）

授業プリント例
授業用プリント、確認テスト、評価規準の例を作成しました。
"43_gazou.doc" Word 97-2003文書（428KB）
デジタルカメラ（または、サンプルとなる画像）
サンプル画像
サンプル画像の例を、用意しました。下記のファイル名をクリックし、ダウンロードしてご利用ください。
"sample.zip"ZIP形式圧縮ファイル(300KB)
ファイルをダウンロードし保存し、解凍してください。
sampleフォルダの中に、gif、jpeg、bmpのフォルダーがあり、この実習内で作成する各形式のファイルがあります。

実習方法

実習Ａ　いろいろな形式で保存してみよう。

デジカメで画像を撮影する。
画像のサイズを幅×高さが320×240（ピクセル）になるように切り取り、この画像をJPEG形式で保存する。（この画像をj100.jpgとする。）
＊時間の都合によっては、ここまでのファイルを作成しておいて、生徒に配布してもよい。
　　ＪＰＥＧ形式の画像（j100.jpg）
ペイントを起動し、j100.jpgを開く。
［ファイル］→［名前をつけて保存］で、ファイルの種類を”24 ビットビットマップ”にし、保存する。（この画像をb.bmpとする。）
　　24ビット　ビットマップ形式の画像（b.bmp）
もう一度、j100.jpgを開き、ファイルの種類を”ＧＩＦ　形式”にし、保存する。（この画像を、g.gifとする。）
　　ＧＩＦ形式の画像（g.gif）
ＪＰＥＧ、ビットマップ、ＧＩＦの各形式の画像について、画像の質、ファイルのサイズについて比較しなさい。
Microsoft Photo Editorで、［ファイル］→［開く］で各形式の画像を続けて開き、［ウィンドウ］→［並べて表示］にすると、ひとつの画面で３つの画像の比較がしやすい。
気づいたことをプリントに記入する。

実習Ｂ　ビットマップ形式で使用する色数を変えて保存してみよう。

ペイントを起動する。
実習Ａで作成したb.bmpを開く。
　　24ビット　ビットマップ形式の画像（b.bmp）
［ファイル］→［名前をつけて保存］で、ファイルの種類を256色ビットマップにして、保存する。（この画像を、b256.bmpとする。）
　　256色ビットマップ形式の画像（b256.bmp）
もう一度、b.bmpを開き、16色ビットマップにして、保存する。（この画像を、b016.bmpとする。）
　　16色ビットマップ形式の画像（b016.bmp）
もう一度、b.bmpを開き、白黒ビットマップにして、保存する。（この画像を、b002.bmpとする。）
　　白黒ビットマップ形式の画像（b002.bmp）
色数を変えたビットマップ形式の画像について、画像の質、ファイルのサイズについて比較しなさい。
Microsoft Photo Editorで、［ファイル］→［開く］で各形式の画像を続けて開き、［ウィンドウ］→［並べて表示］にすると、ひとつの画面で４つの画像の比較がしやすい。
気づいたことをプリントに記入する。

実習Ｃ　ＪＰＥＧ形式で圧縮率を変えて保存してみよう。

Ｐｉｘｉａを起動し、実習Ａで用いたj100.jpgを開く。
　　ほとんど圧縮していない画像（j100.jpg）
Ｐｉｘｉａで［ファイル］→［名前をつけて保存］でファイル名をj050.jpgと変更し、ファイルの種類がＪＰＥＧになっていることを確認。
保存ボタンをクリックする。ＪＰＥＧ保存設定のウィンドウが開いたら、クオリティを50に変更し OKをクリックする。
　　圧縮した画像（j050.jpg）
再度、j100.jpgを開き、ファイル名をj010.jpg、クオリティを10にして保存する。
　　かなり圧縮した画像（j010.jpg）
圧縮率を変えたＪＰＥＧ形式の画像について、画像の質、ファイルのサイズについて比較しなさい。画像を拡大、縮小し大きさを変えて見比べよう。
Microsoft Photo Editorで、［ファイル］→［開く］で各形式の画像を続けて開き、［ウィンドウ］→［並べて表示］にすると、ひとつの画面で３つの画像の比較がしやすい。
気づいたことをプリントに記入する。

総合課題

b.bmpとj100.jpgを学校の回線で転送する場合、どれぐらいの時間がかかるか計算しよう。
Ｗｅｂページやメールに写真を添付する場合、どの形式がよいか。考えよう。
ビットマップ形式、JPEG形式とGIF形式について、長所と短所について調べよう。

時間配分　１００分

時間配分	生徒の動き	教師の動き
３０分	学習内容光の三原色、色の表し方画像ディジタル化の仕組み画像ファイルの形式、拡張子ＪＰＥＧ形式（拡張子　.jpg、.jpeg） Windows Bitmap形式（ビットマップ形式）（拡張子　.bmp）ＧＩＦ形式（拡張子　.gif）ＴＩＦＦ形式（拡張子　.tif） Portable Network Graphics形式（拡張子　.png）	光の三原色、色の表し方参考　なぜ、１６７７万色の表示ができるの？画像のディジタル化の仕組み標本化、量子化参考画像のデータはどの様に保存されているの？ "nisinsuu.xls" Excel 97-2003ブック（KB）画像ファイルの形式参考　画像ファイルの形式の主なものは？
２０分	実習Ａ実習の目的、方法（３．実習方法参照）についてＪＰＥＧ、ビットマップ、ＧＩＦの各形式の画像について、画質、サイズの比較課題についての解答をプリントに記入	実習の目的、方法。各生徒ごとに実習をする。巡回、補足説明。
２０分	実習Ｂ実習の目的、方法（３．実習方法参照）についてビットマップで、使用する色数を変えて保存。使用する色数によるファイルサイズの比較。課題についての解答をプリントに記入。	実習の目的、方法。各生徒ごとに実習をする。課題Ｂ２、課題Ｂ３について、ヒントをあたえる。ヒント１ピクセルあたりの情報量　　フルカラー・・・３バイト　　２５６色・・・・１バイト　　１６色・・・・・１／２バイト　　白黒・・・・・・１／８バイト画像のデータ以外に必要とされる情報がファイルには保存されている。参考画像のデータはどの様に保存されているの？巡回、補足説明。
２０分	実習Ｃ実習の目的、方法（３．実習方法参照）についてＪＰＥＧ形式で圧縮率を変えて保存。圧縮率によるファイルサイズ、画質の違いについての比較。課題についての解答をプリントに記入。	実習の目的、方法。各生徒ごとに実習をする。巡回、補足説明。
１０分	実習内容総合課題について考察する。この時間中に完成して提出する。コンピュータの終了確認。	実習プリントの回収。次回の予告。

時間配分	生徒の動き	教師の動き
３０分	学習内容光の三原色、色の表し方画像ディジタル化の仕組み画像ファイルの形式、拡張子ＪＰＥＧ形式（拡張子　.jpg、.jpeg） Windows Bitmap形式（ビットマップ形式）（拡張子　.bmp）ＧＩＦ形式（拡張子　.gif）ＴＩＦＦ形式（拡張子　.tif） Portable Network Graphics形式（拡張子　.png）	光の三原色、色の表し方参考　なぜ、１６７７万色の表示ができるの？画像のディジタル化の仕組み標本化、量子化参考画像のデータはどの様に保存されているの？ "nisinsuu.xls" Excel 97-2003ブック（KB）画像ファイルの形式参考　画像ファイルの形式の主なものは？
２０分	実習Ａ実習の目的、方法（３．実習方法参照）についてＪＰＥＧ、ビットマップ、ＧＩＦの各形式の画像について、画質、サイズの比較課題についての解答をプリントに記入	実習の目的、方法。各生徒ごとに実習をする。巡回、補足説明。
２０分	実習Ｂ実習の目的、方法（３．実習方法参照）についてビットマップで、使用する色数を変えて保存。使用する色数によるファイルサイズの比較。課題についての解答をプリントに記入。	実習の目的、方法。各生徒ごとに実習をする。課題Ｂ２、課題Ｂ３について、ヒントをあたえる。ヒント１ピクセルあたりの情報量　　フルカラー・・・３バイト　　２５６色・・・・１バイト　　１６色・・・・・１／２バイト　　白黒・・・・・・１／８バイト画像のデータ以外に必要とされる情報がファイルには保存されている。参考画像のデータはどの様に保存されているの？巡回、補足説明。
２０分	実習Ｃ実習の目的、方法（３．実習方法参照）についてＪＰＥＧ形式で圧縮率を変えて保存。圧縮率によるファイルサイズ、画質の違いについての比較。課題についての解答をプリントに記入。	実習の目的、方法。各生徒ごとに実習をする。巡回、補足説明。
１０分	実習内容総合課題について考察する。この時間中に完成して提出する。コンピュータの終了確認。	実習プリントの回収。次回の予告。