画像の背景を透明にしよう２　＜AzPainter２＞

　更新日：2013/9/18

　グラデーションと塗りつぶし

　　　アンチエイリアスとは前回も話した通り、「線や色をきれいに見せる補正」のことです。

　　赤色の単色と青色の単色が並んでいるとぎらぎらとして目がチカチカします。これは互いの色が100％主張し合っているからです。

　しかし、右の画像のようにグラデーションがかかっていた場合、互いの色のほかに譲歩し合った色があり刺激も少なくなっています。

　この例はグラデーションであってアンチエイリアスではありません。　しかし、イメージとしては似たようなもんです。　何が言いたいのかというと

　　左側の赤色を緑色に「塗りつぶし」をしてみた結果です。　左の画像は綺麗に緑色になっています。　が、右の画像はところどころ赤色や紫色が混じっています。

　「塗りつぶし」とは同一の色が続く範囲を指定の色に塗り替えます。したがって、グラデーションがかかっていると塗り替え作業はすぐに止まってしまうのです。

　この右の四角も塗りつぶしを何度も何度も選択しています。　通常の一回では一番左がちょびっとしか塗り替えられないでしょう。

　このように見やすいように細かい配色がされている場所は塗りつぶしが効きにくいです。

　アンチエイリアスとはこの細かい配色が隅々まで施してある状態のことを指します。

　では何が厄介なのか、実際に見てみましょう。

　　ここに一つの絵があります。　そこらへんに良くいる蛇の絵ですね。夏場は多いです。

　この画像の背景を透過したいので背景をピンク色に塗りつぶしました。　こうしてみてみると一見きれいに染まっているように見えます。

　しかし、この画像のサイズを見てみると画像右上「　563×394　」と書かれています。　これではアプリづくりに大きすぎるのでサイズの変更をします。

 　　左の画像が現在のサイズです。　オレンジの下線部分「縦横比維持」にチェックが入れてあるのを確認してから「幅」を300に変更してみましょう。

　幅が300に変更されると同時に高さも210に変更されます。　これは元の縦：横の比率を守ったままサイズを変更できたということです。　

　　このようにサイズが変更されました。サイズ変更のことを「リサイズ」とも呼びます。

　さて、この画像の背景を透過します。　方法は前回と同じなので割愛しますが、わかりやすくするために透過したという設定で背景を緑色に塗りつぶしてみます。

　指定した色を全て透明にする　≠　指定した色を緑色にする　これを同じと考えてみてください。

　　　　　　　　アンチエイリアスなし　　　　　　　　　　　　　　　　　　アンチエイリアスあり

　　わかりやすくするために、左側にアンチエイリアスがかかっていないもの、右側にアンチエイリアスがかかっているものを並べてみました。

　お気付きかもしれませんが、アンチエイリアスがない方はリサイズ前の画像です。　リサイズして縮小したので補正がかかっているというわけです。

　多くの色の情報をもつ画像をリサイズ後の少ない色で同じように表示するためにはグラデーションを使用したりしてごまかしが入ります。

　この画像を透過してみます。　今回はわかりやすく緑色に塗りつぶしてみます。　指定した色を変化させる、という点では同じ効果ですので問題ありません。

　　　　　　　　　アンチエイリアスなし　　　　　　　　　　　　　　　　　アンチエイリアスあり

　　お分かりになるでしょうか。このピンク色に浮き出ているのがアンチエイリアス部分です。

　ここで勘違いしないでおきたいのは、背景をピンク色に塗ったからそうなったのでは？　もとから色を塗らないでおけば大丈夫だったんじゃ？という疑問です。

　色を塗らなかった場合はなにも色は着きません。　でも、それは人間の都合と誤解からきているものでちゃんと白い色が背景に塗られています。

　なのでピンクに塗らなかったとしても右の画像のピンク色の部分が白と灰色に染まって残ってしまいます。

　この残ってしまったピンク色も様々なピンク色からできているので、この部分をまた塗りつぶしたとしても１ドット、２ドットしか変化しません。

　話が長くなりました。　じゃあどうしたら良いのか？

　地道に、ひたすら塗りつぶす

　　やるしかないんです。　拡大して、ピンク色の部分をひたすら塗りつぶすしかありません。

　でもあきらめないでください！　ここでAzPainter2の凄味が発揮されます！

　背景にするための塗りつぶし用の色を選択した状態にして、消したい色の上でキーボードのEnterキーを押しながら左クリックをしてみましょう！

　なんと、この画像上にあるすべての”消したいと選択した色”が自分が選択している色に置換されます！

　・・・とは言っても、グラデーションがかかっていることに変わりはないので一発では済みません。何度も何度も選択することになります。

　それでも、画像上のすべてのその色を置換（置き換え）してくれるので、一回置換すると画像のあちこちで色が変わるのがわかります。

　　地道な作業です・・・。　ピンクって何色あるんだよって言いたくなるほど、置換しても置換してもピンクは残ります。

　画像によっては背景と同じ色で鉛筆ツールやペンツールで上塗りしていったほうが速いかもしれません。

　画像右側オレンジの○で囲った部分、白い点がありますがこれが「１ドット(ピクセル）」です。

　これをひたすらポチポチしていきます・・・。

　　これでアンチエイリアスがかかっていた画像もきれいになりました。

　このように背景を透明にすることに成功・・・　あれ？　牙が・・・。

　　ゴホン・・・。　まとめます。

　・場合によって”色の置換”と”鉛筆やペンツールの手作業による塗りつぶし”は使い分ける。

　　面積が少なかったり、入り組んだ難しい画像でなければ鉛筆やペンを使いましょう。

　・画面サイズを縮小するとほとんどアンチエイリアスがかかってくる。元からかかっているものもある。

　　つまり、もとから小さいサイズで描画すればアンチエイリアスが不意にかかることはありません。

　・同じ配色系統の背景ならばアンチエイリアスが気にならない場合もある。

　　明るいアンチエイリアス（白や黄）が残っている画像を暗い背景（黒や青）の上に持ってくると一発でわかります。

　以上、お粗末な説明で申し訳ありませんでした。

　質問や指摘等あればあなぐらまで。

　検索ワード：AzPainter2　背景　透明化　透過　アンチエイリアス

　　 ←エトセトラへ戻る

   　← ねこパンチする！