オルタナティブ投資

アルファチャンネルとマットについて

アルファチャンネルとマットについて

■そして今回は上のレイヤーに更にエフェクトをかけまして、白黒をはっきりさせます。
エフェクトから「色調補正」→「輝度&コントラスト」をかけます。
完全に透明にしたい所を白にできるまでコントラストの値をいじってください。

画像とビデオの読み込みと書き込み¶

注意2 : Windows と MacOSX 環境では,OpenCVで使われる標準の画像コーデック(libjpeg, libpng, libtiff そして アルファチャンネルとマットについて libjasper)がデフォルトで利用されます.よって,OpenCVは常に JPEGs, PNGs, TIFFs を読み込むことができます.MacOSXでは,ネイティブなMacOSX画像ローダを利用するためのオプションもあります.しかし現在は,MacOSXに組み込まれたカラーマネジメントにより,これらのネイティブな画像ローダを利用すると,画像のピクセル値が多少異なるものになることに注意してください.

Linux, BSD系,その他のUnix系のオープンソースOS環境では,OpeNCV は OSが提供する画像コーデックを探します.コーデックのサポートを得るために,関連パッケージを(開発ファイル,例えば「libjpeg-dev」など,を忘れずに)インストールするか,あるいは,CMakeで OPENCV_BUILD_3RDPARTY_LIBS を ON にしてください.

cv::imwrite¶

フォーマット個別の保存パラメータ. paramId_1, paramValue_1, paramId_2, paramValue_2, . という形式にエンコードされています.現在のところ,以下のパラメータをサポートしています:

  • JPEG の場合,これは品質 ( CV_IMWRITE_JPEG_QUALITY ) を表し,0から100までの値(高い値になるほど品質が良くなります)をとります.デフォルトでは95です.
  • PNG の場合,これは圧縮レベル ( CV_IMWRITE_PNG_COMPRESSION ) を表し,0から9までの値(高い値になるほど,ファイルサイズは小さくなりますが圧縮時間もかかります)をとります.デフォルトでは3です.
  • PPM, PGM または PBM の場合,これはバイナリフォーマットフラグ ( CV_IMWRITE_PXM_BINARY ) を表し,0または1の値をとります.デフォルトは1です.

関数 imwrite は,指定したファイルに画像を保存します.画像フォーマットは, filename の拡張子によって決まります.サポートされる拡張子の一覧については imread を参照してください.この関数によって保存できるのは,8ビット(PNG, JPG 2000, TIFF の場合は 16ビット)のシングルチャンネル,または3チャンネル(チャンネルは’BGR’の順序)の画像だけです.フォーマットやビット深度,チャンネル順序が異なる場合は, Mat::convertTocvtColor を用いて保存前に画像を変換するか,一般的な XML 入出力関数を用いて,画像を XML や YAML フォーマットで保存します.

VideoCapture¶

The class provides C++ video アルファチャンネルとマットについて capturing API. Here アルファチャンネルとマットについて is how the class can be used:

透明度の設定…アルファチャンネルって?

透明度の設定…アルファチャンネルって?

『アクションゲームツクール』では透明度のついた画像が使えます。

上の画像でなんとなくわかるでしょうか? アルファチャンネルとマットについて オバケ(そう見えないかもしれませんが、オバケです)の頭のあたりは透けていませんが、足元にいくほど透明に近づいています。
ほかにも半透明の水や、煙、霧などの効果にも、画像に透明度をつけておくと効果的でしょう。
こういう「透明度のついた画像」はアルファチャンネルを使って作ります。

実際の作り方より先に、アルファチャンネルのしくみについて説明しておきましょう。
アルファチャンネルとは画像にくっついてくる情報で、「画像のどこをどのくらい透明にするか」を示しています。と、言葉にするとなんだかよくわからないので、下の画像をごらんください。

鳥を写した画像に、3種類のアルファチャンネルをつけてみました。
アルファチャンネルでは、「黒く塗られた部分は透明に、白く塗られた部分は不透明に」表示するというルールがあります。上の2パターンを見るとわかりやすいでしょう。 アルファチャンネルとマットについて
単純な白と黒ではなく、グレーならどうなるでしょうか? 3番目の例のように、「黒に近ければ透明度は高く、白に近ければ透明度は低く」表示されます。

以上をふまえて、実際にアルファチャンネルを持った画像の作り方を見てみましょう。
アルファチャンネルを扱えるグラフィックツールはいろいろありますが、ここでは有名なフリーソフトの『GIMP』を使うことにします。
※GIMP for Windows 2.6.6を基準に解説しています。

ゼロから画像を作る場合、GIMPの「レイヤーマスク機能」を使う方が感覚的にわかりやすいでしょう。[レイヤー]→[レイヤーマスク]→[レイヤーマスクの追加]を選択して、ダイアログで[完全不透明(白)]を選びます(やり方によっては他のオプションの方が便利だったりしますが、今はいちばん単純な方法を選んでいます。もっとくわしくはヘルプなどをごらんください)。
レイヤーパレットに 2枚のサムネイルが表示されます (画像)が、右側が新しく追加されたレイヤーマスクです。
レイヤーマスクでも、「黒いほど透明に、白いほど不透明に」のルールは同じです。ためしに ブラシで黒く塗ってみると、下地の透明が見えてきます (画像)。
あとはイメージ通りに透明度のついた画像を描いていきましょう(完成図は左)。
この段階ではまだ「レイヤーマスク」であってアルファチャンネルではないので、[レイヤー]→[レイヤーマスク]→[レイヤーマスクを適用]を選びましょう。アルファチャンネルに変換されます。パレットの チャンネルタブを開くと、下の方にアルファチャンネルが追加されているのが見える (画像)はずです。後から修正したくなったら、もう1度[レイヤー]→[レイヤーマスク]→[レイヤーマスクの追加]から、[レイヤーのアルファチャンネルを移転]を選べばまたレイヤーマスクで作業できます。
最後に .png形式で保存 (画像)します。
(絵を描くのにかかる手間を考えなければ)簡単ですね!

絵を描く作業そのものは他のグラフィックツールを使うという場合は、GIMP上ではコピー&ペーストだけの作業でいいでしょう。
まだ透明度のない画像とアルファチャンネルになる画像を それぞれ用意して (画像)、透明度のない画像の方にレイヤーマスクを追加します。ここにアルファチャンネルになる画像を[編集]→[貼り付け]しましょう。この時点ではまだ 「フローティング選択範囲」という状態 (画像)なので、[レイヤー]→[レイヤーを固定]して、あとは前の手順と同じ要領で[レイヤーマスクを適用]して保存します。

合成チャンネル


前編 では、アルファチャンネルには「ストレート」と「プリマルチプライド」の2タイプあるという話をしました。今回はMaya, 3ds Max, Photoshop, After Effects, Nukeというソフトで、どうアルファチャンネルを扱うか説明したいと思います(※ソフトのバージョンによって違う場合があるかもしれません、その点あらかじめご了承ください)。この記事を読み終わる頃には、あなたはアルファチャンネルをかなりマスターしているはずです。きっと今まで以上にクオリティーの高いコンポジット(あるいは3DCG制作)が出来るようになります。それに、もう二度と、「変なフリンジが出て困る」なんて嘆くことは無くなるでしょう!

ストレート・アルファ(Straight Alpha)画像・・・まだRGBチャンネルにアルファ値が乗算されていない。純粋な「正しい」カラー。アンプリマルチプライド(UnPremultiplied Alpha)、ノン・プリマルチプライド(Non-Premultiplied Alpha)とも呼ぶ。

プリマルチプライド・アルファ(Premultiplied Alpha)画像・・・すでにRGBチャンネルにアルファ値が乗算されている。背景と合成するためにRGB値が弱くされた、暗いカラー。乗算済みアルファ、合成チャンネルとも呼ぶ。

After_Effects_Alpha_A_08_v002.png

プリマルチプライ処理:
ストレートのRGB × アルファ値 = プリマルチプライドのRGB

アンプリマルチプライ処理:
プリマルチプライドのRGB ÷ アルファ値 = ストレートのRGB

Alpha_B_02_v002.png

→黒フリンジの原因は、「プリマルチプライ処理の2度掛け」です。グラフィックソフトがプリマルチプライド画像をストレート画像として扱ってしまい、もう1度プリマルチプライ処理をしてしまっているのです。エッジ部分の(アンチエイリアスの掛かった)半透明ピクセルのRGBが必要以上に暗くなり、私たちは「フチが黒ずんだ」と思うわけです。……ということは、アンプリマルチプライ処理を行えば解決するというわけです!また、逆に白フリンジの原因は、必要なプリマルチプライ処理が行われていないからです。プリマルチプライ処理を行えば解決します。

◆理由2……カラコレ(色調整)は、必ずストレート画像に対して行う必要がある。プリマルチプライド画像に対してカラコレを行ってはならない。プリマルチプライドのRGBは本来の正しいカラーではないため、不適切な合成結果になる。これはソフトに関わらず、画像処理の原則である。

Alpha_B_04_v002.png

まずは3DCGソフトから見ていきましょう。3DCGソフトからレンダーされる画像は、ほとんどの場合プリマルチプライドです。

Alpha_B_05_v002.png

Alpha_B_06_v002.png

さぁ、次はPhotoshopです!Photoshopは、アルファチャンネルをどう扱うのでしょう?Photoshopはストレートで画像を読み込んだり保存します。たとえば、あなたが透明な背景にペイントしてPSDファイルを保存すれば、そのファイルはストレートということになります。

◆Photoshopの中の「アルファチャンネル」機能

Alpha_B_07_v002.png

◆Photoshopで黒背景を削除する方法

1. [チャンネル]パネルで、アルファチャンネルのアイコンをCtrl+クリック (⌘+クリック)して、選択範囲を読み込みます。
2. Ctrl+Shift+I (⌘+Shift+I) で選択範囲を反転します。
3. Deleteキーを叩いて、レイヤーから黒背景ピクセルを削除します。

◆Photoshopで黒フリンジを除去する方法

レイヤー>マッティング>黒マット削除

Alpha_B_09_v002.png

◆Photoshopで3DCG用のマップを作成する際の注意点

せっかくなので逆のケース、Photoshopから3DCGソフトに画像を持ち込むときの話もしましょう。実は全く同じ問題が起こる場合があるのです。3DCG で「葉っぱ」や「花びら」などをつくるとき、Photoshopで描いたマップを板ポリゴンに貼ります。このとき、RGBとアルファのマップを別々に用意し、 3DCGソフトに持ち込むのですが、3DCGソフト上で「黒フリンジ」が発生してしまう場合があります。この問題の原因もやはり「プリマルチプライ処理の2度掛け」です。ですから、PhotoshopからストレートRGBを出力すれば解決します。以下の手順を実行してください。

1.一番上にアルファ値を表す白黒レイヤーを配置してください。
2.このレイヤーのブレンドモードを[除算]にします。

Alpha_B_11_v002.png

◆After Effectsのフッテージのアルファ設定

After Effectsでフッテージを読み込む際、アルファタイプを聞かれるため、[ストレート]か[合成チャンネル]か選びます。After Effectsにどちらのタイプなのか、教えてあげましょう。[自動設定]ボタンを押せば、たいていは適切な方に設定されます。なお、[環境設定]>[読み込み設定]>[ラベルのないアルファを変換] を「自動設定」にしておくと、いちいち聞かれないので便利です(PNGについては間違ってストレートで読み込まれてしまうことがあるので注意が必要です)。

Alpha_B_12_v002.png

Alpha_B_13_v002.png

◆After Effectsのレンダリング

After Effectsからレンダリングする場合、出力モジュール設定の中で[チャンネル]を「RGB+アルファ」に設定してアルファ付きに設定します。この際、[カラー]を「ストレート(マットなし)」にすると ストレートでレンダーされ、「合成チャンネル(マットあり)アルファチャンネルとマットについて 」にすればプリマルチプライドでレンダーされます。PNGの場合はストレートしか選べません。

Alpha_B_15_v002.png

◆After Effectsで黒フリンジを除去する方法

エフェクト>チャンネル>カラーマット削除

Alpha_B_16_v002.png

◆After Effectsで3DCGのマルチパスを合成する方法

Alpha_B_17_v002.png

1.全てのレイヤーに[チャンネルシフト]エフェクトを適用し、アルファを[フルオン]にしてください。これも、After Effects上で行うアンプリマルチプライ処理の一種です。この場合アルファは100%の状態になり、RGBはストレートの「正しい」カラーになります。この状態ですべてのレイヤーを重ねます。

2.一番上にアルファを持ったレイヤーを配置し、ブレンドモードを[ステンシルアルファ]にしてください。最後にこのレイヤーのアルファ値で「型抜き」するわけです(過去記事で説明しましたがレイヤーの計算は下からです、一番上のレイヤーは最後に計算されます)。これはアルファ値を乗算する、プリマルチプライ処理です。

Alpha_B_18_v002.png

Nukeではアルファをどう扱えば良いか、見ていきましょう!
NukeではストレートをUnpremultiplied、プリマルチプライドはそのままPremultipliedと呼んでいます。

◆PremultノードとUnpremultノード

Premultノードは、プリマルチプライ処理を行います。Unpremultノードは、アンプリマルチプライ処理を行います。この2つのノードによって、Nukeユーザーはストレート画像とプリマルチプライド画像を自由に「行ったり来たり」できるのです。

Alpha_B_19_v002.png

◆NukeのReadノード

プリマルチプライド画像を読み込んだ場合は、(linearカラースペース以外の画像なら)Readノードの[premultiplied]のチェックを入れてください。これによって、Nukeにプリマルチプライド画像だと教えてあげるわけです。しかし、linearカラースペースの画像を読み込む場合は[premultiplied]のチェックを入れる必要はありません。というのは、このチェックを入れたときにNukeが行っている内部処理は、一度アンプリマルチプライ処理を行ってからlinearカラースペースに変換し、プリマルチプライ処理をして元に戻すというものだからです。

Alpha_B_20_v002.png

Alpha_B_21_v002.png

◆NukeでMergeする際の注意点

Nuke のMergeのAinput(前景)には、必ずプリマルチプライドを入力してください。overオペレーションの計算式はA+B(1-a)です。これは前回説明した、「前景と背景を重ね合わせる式の短いバージョン」です。つまり前景はプリマルチプライドでなくてはいけません。

Alpha_B_23_v002.png

◆Transformノード、Filterノードを使用する際の注意点

トランスフォーム(移動・回転・拡大縮小)、フィルター(ブラーなど)の処理は必ずプリマルチプライドで行ってください。ストレートで行ってはいけません。

Alpha_B_24_v002.png

◆Nukeでカラコレを行う際の注意点

前述の通り、画像処理の原則として「カラコレは必ずストレートで行う」必要があります。プリマルチプライド画像に対してカラコレしてしまうと、エッジまたは 画像全体に問題が発生します。ですから、Nukeでカラコレする場合は、カラコレ系のノードをUnpremultノードとPremultノードで挟んでください。アンプリマルチプライ処理を行って、RGBを正しいカラーにしてから、カラコレします。カラコレが終わったら、プリマルチプライ処理を行ってください。

Alpha_B_25_v002.png

◆プリマルチプライ処理(Premultiply)は、ストレートをプリマルチプライドに変換する処理。乗算。
ストレートのRGB × アルファ値 = プリマルチプライドのRGB

◆アンプリマルチプライ処理(Unpremultiply)は、プリマルチプライドをストレートに変換する処理。除算。
プリマルチプライドのRGB ÷ アルファ値 = ストレートのRGB

◆黒フリンジの原因は、「プリマルチプライ処理の2度掛け」。アンプリマルチプライ処理を行えば解決する。逆に、白フリンジの原因は、必要なプリマルチプライ処理が行われていないこと。プリマルチプライ処理を行えば解決する。

カラコレは、必ずストレートのRGB値に対して行うのが画像処理の原則。プリマルチプライドのRGBは正しいカラーではないため、これに対してカラコレを行ってはならない。

レイヤーマスクの作成方法


Davinci Resolve

今回使用する素材はこちらです。

Media Inからは、タイムラインに写っているクリップが出力され、
Media Outにつなげることで、Fusion内の結果をタイムラインに戻します。
画像のプレビュー右画面がMedia In、左画面がMedia Outです。

ノードパネル上でShift+スペースキーを押すと、
Select Toolというパネルが表示され、ここから使いたいノードを呼び出せます。

キーイングをするためのツールのことをKeyerと呼びます。
Select ToolでKeyerを検索してみましょう。

画像の通り、keyerにも様々な種類があることがわかります。
今回はこの中の、Delta Keyerを使います。

Delta Keyerのキーイング方法はクロマキーです。 アルファチャンネルとマットについて
クロマキーは先述のように、映像内の色彩、彩度から特定の色を指定するやり方です。

緑:フォアグラウンド(前景入力)
黄:バックグラウンド(後景入力)
青:エフェクトマット(エフェクト入力)

まずは、Media InのOutからDelta アルファチャンネルとマットについて Keyerの黄端子に接続しましょう。
これで、Delta Keyerに元素材が入力されました。

Delta アルファチャンネルとマットについて Keyerのノードを選択したら、
Inspectorからスポイトのアイコンをドラッグして、Media Inプレビューのグリーンの上でドロップしましょう。

Delta Keyerのプレビューを見てみると、
指定したグリーンの範囲が抜けてアルファになっているのがわかります。
これで、映像内のグリーンの色が指定されました。

このボタンで、プレビューのカラーチャンネルやアルファチャンネルの切り替えができます。
これは、アルファチャンネルのみ表示された状態です。
黒色の範囲がアルファチャンネル、
白色の範囲が抜けていない部分です。

これを修正するために、Delta Keyerの設定から、
RGB値や、MatteタブからThreshold(抽出する色の幅のしきい値)を調整して、
体の中身を白色で埋めてあげましょう。

Delta Keyerで作った素材から、この白黒マスクを作成しましょう。
そのために、Shift+スペースキーでChannel Booleanノードを追加します。


ChannelBoolean(bol)

Delta KeyerのOutからChannel Booleanの黄端子に接続し、
プレビューの表示をカラーチャンネルに切り替えて見てみましょう。

BackGroundノードを追加しましょう。

これは平面素材、いわゆる下地のようなもので、
デフォルトでは黒色ですが、設定から色を変更することもできます。
今は背景を真っ黒にしたいため、デフォルトのまま使います。

この下地をChannel Booleanの結果と合併するのですが、
ここでMergeノードを使います。

このノードは、名前の通りノードとノードをマージ(合併)させる時に使います。
今回、人物を前景、下地を後景にしたいので、
Channel BooleanのOutを緑端子に、BackGroundのOutを黄端子に接続しましょう。

キーイングの時点でエッジを馴染ませようとしすぎて、 アルファチャンネルとマットについて
ブラーをぼやぼやにしたりギリギリまで攻めたりすると、
その分、レイヤーマスクの範囲が狭まるということですから、
コンポジットの際に調整の自由が制限されることがあります。

エッジの馴染ませはコンポジットの作業にあたるので、 アルファチャンネルとマットについて
レイヤーマスク作成の際は馴染み方を気にするよりも、
コンポジターがどう使うか、コンポジットで使いやすい素材になることを意識して作成するといいかと思います。

以上で、レイヤーマスクの作成については終わりなのですが、
これを実際にどうやって使うのか、
試しに、簡単な仮コンポジットをしてみたいと思います。

レイヤーマスクの使い方

合成素材として、BackGroudで真っ赤な背景を用意しました。
作成したレイヤーマスクを使ってグリーンバックを切り分け、
この背景を合成させたいと思います。


作成したレイヤーマスクはこのMergeから出力されています。

今回はここまでですが、
ここから人物のエッジにブラーをかけたり、背景との馴染み具合を調整して、
最終的な合成結果のクオリティを仕上げていきます。
これがコンポジットです。

以上で、レイヤーマスクの作成と使用作法は終了です。
単に合成と言ってもそのうちに様々な工程があり、
キーイング、マスク、コンポジットと、それぞれ意識するべきことは違います。
作業工程を把握し、その時に何が大切になるかを考えていれば、
スムーズな仕事ができるのでは無いでしょうか。

旧)ES. Motion Graphic Diary (VJ 映像素材・CG 動画素材・作品などの公開)

110222-0001


今回こちらではAfterEffectsに読み込ませる前に、720×540のMP4ファイルをProRes422の形式に変換しています。


AfterEffectsに読み込ませ、その素材でコンポジションを作成します。

110222-0005

■レイヤーを複製して同じレイヤーを二つにします。

110222-0006

110222-0008


■そして今回は上のレイヤーに更にエフェクトをかけまして、白黒をはっきりさせます。
エフェクトから「色調補正」→「輝度&コントラスト」をかけます。
完全に透明にしたい所を白にできるまでコントラストの値をいじってください。
アルファチャンネルとマットについて

110222-0009

■次に今エフェクトをかけたレイヤーの下レイヤーを選択し、「ルミナンスキー反転マット」を選んでください。

110222-0010

これで鳥以外の部分を抜く事ができたのですが、画像ではわかりづらいですね…
なので背景に目立つものを置きました。

鳥をよく見てみると周りにフリンジがあります。

背景によっては目立たないのでそのままでも良かったりするのですが、今回はこのフリンジも簡単な処理をして消しておきます。

110222-0012

■鳥のレイヤー二つを選択してプリコンポジションします。

110222-0013


■プリコンポジションしたレイヤーにエフェクトをかけます。
エフェクトから「マット」→「チョーク」を選びます。
数値を少しいじってみるとわかるかと思いますが、縁が削れていく感じになります。
それによってフリンジを消していきます。

今回チョークマットの値を1.0にしました。

チョークをかけた後(チョークマットの数値1.0)

チョークをかける前

110223-0001


■今回はチョークでやってみましたが、オブジェクトがシルエットなので色を「色相・彩度」の色彩統一で変えてしまった方が手っ取り早くなじむかも知れません。

■このような方法などでオブジェクトを抜く事ができます。
なお白黒にする段階でグレーの部分があると半透明になります。
今回の場合は白になっていくにつれ透明になり、黒になっていくにつれ不透明度が上がります。
逆に黒が透明になる場合は「ルミナンスキー反転マット」ではなく「ルミナンスキーマット」を選んでください。


◆ブログ書いている人のプロフィール

ES. (エス. )
モーショングラフィックデザイナー アルファチャンネルとマットについて (と言うことにしています。)

■経歴みたいなの
昨年12月に「まるごと FREEでつかえる 動画素材123」という本を出させていただきました。重版決定。動画素材123本収録しています。http://bit.ly/douga123

もうだいぶ前からになりますがクラブVJをやっていました。
そこから映像関係のお仕事をやるようになり、コンサートや企業プレゼン、展示会などのムービーを創ったり、時にはプレゼンテーション素材をつくったりするようになりました。

今はPVなども制作したり動画素材を配布・販売したりしています。

もうちょっと詳しいプロフィールはこちらへどうぞ

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
■ES. (Molojun)は動画素材集の本をBNNから出版しました。
123本の動画素材を収録。使い放題です。
↓↓↓↓↓↓↓↓↓

関連記事

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

コメント

コメントする

目次
閉じる