- 追加された行はこの色です。
- 削除された行はこの色です。
[[素材作成・加工時の注意]]
[[TopPage]] > 付録 > 素材作成・加工時の注意
[[TopPage]] > [[付録]] > 素材作成・加工時の注意
* 素材作成・加工時の注意 [#x3cdc4e8]
プログラムの中で画像を使用する際は,jpg, png, bmpなどの形式が指定できます.
** それぞれの形式の比較 [#v4171c25]
以下に,同じデータから作成した jpg画像,png画像を示します.
~
#ref(trump.jpg,around,75%)
#ref(trump.png,,75%)~
~
// trump.jpg trump.png
ぱっと見ためには,あまり違いがないように見えますが,~
文字や絵柄の部分を拡大すると,jpg画像では,たくさんノイズがのっているのがわかります.~
左側がjpgで,右側がbmpで一度保存した画像です.
~
#ref(sample_jpg.png,around,75%)
#ref(sample_bmp.png,,75%)~
~
// sample_jpg.png, sample_bmp.png
このように,
- 1色でのべた塗り部分が多い画像(アニメ絵のような画像)
- 文字が配置された画像
の場合は,jpgよりも pngやbmpの方が適しています.
逆に,グラデーションや水彩風の絵,写真のように,細かく色が変わりやすい画像の場合はjpgの方が適しています.
このような差が表れる理由は,圧縮形式の違いによるものです.~
詳しい理由を知りたい人はググってみましょう.
** 圧縮と非圧縮 [#s4f79e5b]
bmp画像は,非圧縮画像のため,データの量が多くなります.~
上記の画像の例では,jpgやpngよりも10倍程度ファイルサイズが大きいです.~
jpgやpngは圧縮画像であり,人間が「気づきにくい」範囲で余分なデータを捨てて サイズを小さくしています.
特にjpg画像は「非可逆圧縮」の方法をとっています.~
つまり,一度圧縮して劣化させると,元の画像には戻りません.~
そのため,jpg形式で加工・保存を何度も繰り返すと,どんどん劣化していきます.
加工の際には,非圧縮の状態で保存をしておき,最終段階で圧縮画像を描きだすという順番をとりましょう.
加工の際には,
''非圧縮の状態で保存をしておき,&color(darkred){最終段階で圧縮画像を描きだす};という順番をとりましょう.''
音声についても同様です.~
mp3は非可逆圧縮により,wav形式よりもデータ量が少なくなっています.
加工する際はwav形式のデータを使用しましょう.
** カラーの形式 [#n2f7f03c]
Illustrator等で画像を加工する際に,カラーの形式でRGBとCMYKを選ぶことができます.~
Javaのプログラム内ではRGB形式で保存された画像しか表示できません.~
''Javaのプログラム内では&color(darkred){RGB形式で保存された画像};しか表示できません.''~
CMYKで保存した場合は,RGBに変換して保存しなおしてください.~
RGBは光の三原色の
&color(red){赤(Red)};,
&color(green){緑(Green)};,
&color(blue){青(Blue)};
の組み合わせで色を表現する加法混色です.~
3つの色を全部混ぜると白色になります.~
ディスプレイやテレビ,信号など,光を発するもので使われます.
CMYKは色の三原色の
&color(cyan,black){青緑(Cyan)};,
&color(magenta){赤紫(Magenta)};,
&color(yellow,black){黄(Yellow)};に,
黒(Black)を 加えた4つの色で表現する減法混色です.~
3つの色を全部混ぜると黒色になります(はずなのですが,実際には綺麗な真っ黒を表現できないため,黒を追加しています).~
ポスターや本などの印刷物や絵の具などが代表例です.~
プリンタのインクやトナーにもこの混色法が使われてます.~
今回の演習のプログラム内では,ディスプレイ上に画面を表示させるため,RGB形式の素材を使用します.
- Illustratorでドキュメントを新規作成する際:
-- 「新規ドキュメント」のウィンドウ内の「△詳細」の部分をクリック
-- カラーモードをCMYKからRGBに変更
- Illustratorで途中まで作業している場合:
-- 「ファイル」の「ドキュメントのカラーモード」をクリック
-- RGBカラーを選択