FC2ブログ
loading

スポンサーサイト

Posted by Genesis on --.-- スポンサー広告
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

CG PNG画像とファンサイトキット

Posted by Genesis on 08.2011 CG   3 comments
今回はPNG画像の加工について紹介したいと思います。
説明していくうちに他のJPEG,GIF画像などのフォーマットも紹介するかもしれません。
今日はちょっと殴り書きなので文章にかなりまとまりがありませんがご了承ください。
修正してもまとまりがないとはおもいますが、後日改めて修正していきたいと思います。

MHFのファンサイトキットの画像にPNGフォーマットが増えてきているようなのでそれも含めて書きたいと思います。

※書き記したことは確認したので恐らく間違っていないとは思いますが、もし間違いではないかと思われるところがあればご指摘、ご報告して頂けると嬉しいです。


1. PNGとは
PNG(Portable Network Graphics)とは可逆圧縮(圧縮後の劣化を元に戻せる)が可能な画像フォーマットで一般的には静止画像を指します。
フルカラーでアルファチャンネル(透過レイヤー)を含む場合は最大48bits,アルファチャンネルを含まない場合は24bitsのRGB表色系で表されます。
更に8bits用いてインデックスカラーを登録し、目に見える画質を維持しながらファイルサイズを小さくする事を可能としています。


2. 特徴とチャンク
次なる特徴としてチャンク呼ばれるデータブロックが存在し、様々な情報を保持することが可能となっています。
例として、当ブログのある画像のデータ例です。
20110508001.png
※クリックで拡大します
これはWindows7のMSペイント(win7付属のペイント)に私の著作情報をちょっと付け足したものです。
このようにコメントもチャンクに残すことが可能です。
IHDRは13B(バイト)のヘッダーで、簡単に言えばファイルがPNG画像であることを示し、その表現の仕方などが書いてあります。
アルファチャンネルが存在する場合は、tRNSチャンクが6Bバイトで存在し、透過させる色を指定しています。
ただし、ピクセル単位のアルファ値指定が必要ない場合で、簡単に言えば色指定でその色を透過させているということです。
例:トゥルーカラー白の場合 (255,255,255)

ちなみにMHFファンサイトキットのPNG画像データ列は以下のようになっています。
20110508002.png
※クリックで拡大します
IHDRは同様にファイルヘッダー、gAMAはガンマ補正値を表し、tEXtチャンクではAdobe ImageReadyを編集に使用したことを表しているようです。
続いてIDATではメインの画素データが入って、IENDはファイル終端を示しています。
この画像の場合は画素毎でアルファチャンネルを指定しているようで、tRNSチャンクを用いていません。


3. 編集準備
フリーウェアでアルファチャンネルを保持しながら編集でき、なおかつ使いやすいソフトを30分くらいでですが、探してみました。

PictBear(ピクトベア)
http://www.fenrir.co.jp/pictbear

試したのは5,6種くらいなのですが、これが一番使いやすいのではないのかなと思います。
windowsホーム向けならほぼサポートしているようですし、今回はこのソフトウェアを使用してリサイズなどの編集の仕方を書いてみたいと思います。


4. インストール
2011/05/08現在のバージョンは2.02で配布され、pb202.exe(インストーラ)をDL(ダウンロード)することが可能となっています。
DLしたら起動し、ソフトウェア使用許諾書をお読みになり、宜しければ同意し次へと進んでください。
次にインストール先を指定する必要があります。
デフォルトではおそらく、
C:\Program Files\Fenrir Inc\PictBear Second Editionまたは、
C:\Program Files (x86)\Fenrir Inc\PictBear Second Editionとなっていると思います。
問題がなければそのまま進み、指定するる場合は任意のフォルダを指定してください。
あとはオプションになります。
いろいろ邪魔になるのが嫌だという方はすべてチェックを外すと良いと思います。

インストールが完了したら、PictBear.exe (.exeは隠す設定をしている場合は見えません)を起動しましょう。
最初に言語選択を設定する必要があるので、日本語でおkというかたは[jpn]を選択し[OK]をクリックしましょう。
後で上部メニューの表示→言語から変更することも可能です。


5. 編集
今回はMHFのファンサイトキットのPNG画像を透過チャンネルを保持しながら小さくリサイズするという編集をしてみます。
編集したい画像をドラッグ&ドロップかメニューから開くで編集できるようにします。
20110508003.png
※クリックで拡大します

編集したいPNGを読み込んだら、上部メニューの「イメージ(I)」→「イメージのリサイズ(R)」を選択します。
ピクセル値指定でサイズ変更をすることが可能なのでお好きなサイズで変更してみてください。
オプションの補間は何を補間しているか書いてないので分かりませんが、とりあえず何か補間してくれているので外さなくてもいいと思います。
例の場合は20%に縮小の320*240にしそのまま保存した画像です。
20110508004.png
問題なく透過されていることが分かります。
ただし、透過情報の状態が保存前と同じで、画素毎に指定しているようになっています。


追記ここから

6. 透過部分を作成する
PNGやGIF画像では既知の通り透過部分を生成することが可能です。
上記で紹介したピクトベアでは割と細かいところまで透過部分を指定することが可能ですが、結構面倒臭いというのがあるかもしれません。
そこで、簡単に透過部分を生成することが可能なソフトウェアを紹介します。

GIF透過専用+PNG透過専用 Ver.1.5
http://lnsoft.net

ピクトベア同様にフリーウェアで、ZIPファイルをDLし解凍するだけで使うことが可能です。
解凍したフォルダの中のGP_10days(.exe)を起動したら、透過を作りたい画像をドラッグ&ドロップし、透過させたい場所の色を選択し、出力形式(PNG or GIF)を指定してOKをクリックするだけです。

このソフトウェアはtRNSチャンクで透過となる部分の色を指定して、透過部分を生成しています。
例として次の画像の背景(白255,255,255)を透過させます。
処理前
2011051101.png


処理後
2011051102.png

解像度を落としてから処理してしまったので255,255,255にしていた部分が多少変化してしまったためか、細かい白い部分が透過されていませんが、大まかな部分はちゃんと透過できています。

付属のReadme(.txt)にある様に大抵の静止画像ファイルは読み込み可能です。
注意点としては、PNGを処理させたい場合に処理可能なPNGが24bitフルカラーまでで、透過チャンネルを含むと処理されないという点でしょうか。
あとはGIFは256色であるため画像が劣化する可能性があるということでしょうか。




修正してもまとまりがないとはおもいますが、後日改めて修正していきたいと思います。
とは書きましたが、やっぱり面倒くさいと言うのと、説明下手な私がまとめても余計に分からなくなりそうだということで、もうこのままにしようかなと思います。
書き記したことは確認したので恐らく間違っていないとは思いますが、もし間違いではないかと思われるところがあればご指摘、ご報告して頂けると嬉しいです。

気分で修正していくかもしれません。
それでは。

2011/05/08 作成
2011/05/11 加筆

スポンサーサイト
  

menu

Memo.htmlへようこそ
タイトルの通りメモ帳のような感じで使われているブログです
ごゆっくりご覧になってください  

公開記事の一覧表示
リンク

recent entries

categories

mail

ご意見・ご要望・ご質問などお気軽にどうぞ
お返事に数日間ほどお時間を頂きますがご了承ください
下記のアドレス◎を半角@に変換してお送りください

Memo.html.info◎gmail.com

name:
address:
title:
main:

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。