2011-08-04
パス抜きでキャラクターのシルエットを作る！
一年以上空いてしまいました、お久しぶりです父です。
今回は先日参加させていただいたオフに持っていった名刺の作成についてです。
パス抜きと呼ばれているテクニックを使ったのですが、それについて簡単にまとめをば。
必要なもの
- GIMP（ここでは2.4.7を使用しています）
- 対象の画像
- 根気（重要）
この説明では「天空に満ちる月！キュアブライト！！」を使用します。
ではでは早速…
１、画像の下準備
まずは画像を読み込みます。GIMPを起動し、
ファイル→新規から目的の画像を選びます。
この時点では透明な領域を持たないレイヤーで作成されているので、
ファイル→Open as Layers
からもう一度同じ画像を選ぶことで、透明領域を持つレイヤーを作成しておきます。
以降は作成したレイヤーに対して処理を行っていきますので、レイヤーダイアログから作成したレイヤーを選択しておきます。
元の画像を開いた背景というレイヤーは削除してしまっても大丈夫でしょう。
（レイヤーダイアログが出ていない場合はダイアログ→レイヤーでレイヤーダイアログが表示されます。）
２、パス抜きをする
次は実際にパス抜きを行います。
ここで簡単にパス抜きとは何かを言いますと、
キャラクターを綺麗に抜き取るための領域選択をパスを使って行うこと。と言えます。
では実際にやってみましょう。
下の画面で選択されているボタンがパスツールです。コレを選びましょう。
さて、パスツールを選んだ後は、画像に従ってパスを作成していきます。
パスの作成は簡単で、クリックしていくだけでOKです。
上記の画像では、髪の毛の輪郭にそってポンポンとクリックして行った状態です。
コレを根気良くキャラクターの外周にそって一周させるわけですね。
拡大率が高ければ高いほど、細かくパスが設定されるため丁寧に抜き取ることが出来ますが、それだけパスの数が増えて集中力を要します。その辺はトレードオフということで。
下記の画像は一周させた後になります。20分ほどかかりました。
さあ、実際にキャラクターのみを抜いて見ましょう。
まずは選択→パスからをクリックして、キャラクターの内部が全て選択された状態になります。
続いて、選択→反転をクリックしてキャラクターの外部を全て選択します。
キャラクターの外部が選択されたら、後はDelキーで選択範囲を削除します。
ていっ
はい、綺麗に抜けました。でもこの画像では抜けていない部分もありますね。
髪の隙間など、一周させるだけでは抜けない部分もある場合は、同様にやって抜いてしまいましょう。
もちろん内部を削除する場合は反転の手順は必要ないですのでご注意を
３、シルエットにする
綺麗に抜き終えた後は実際にシルエットにしていきます。
色→明るさ-コントラストを選択します。
ここでコントラストの数値を左一杯まで持っていきます。色の強弱をなくすわけですね。
はい、シルエットっぽくなってきました。一度OKをクリックして変更を確定させましょう
そしてもう一度、色→明るさ-コントラストを選び、今度は明るさとコントラスト両方を右一杯まで持っていくことで、白一色にしてしまいます。
はい、真っ白なシルエットになりました。
さて、ここに着色をして良い感じにしてしまいましょう。
４、着色する
着色はいたってシンプルです、バケツツールを使って一発で塗ってしまいましょう。使い方はペイントの塗りつぶしツールと同じです。
ただし、上記の画像では、バケツツールの不透明度と言う値が100の状態です。
コレだとちょっとギザギザが目立ってしまうので、70〜85ぐらいに落として塗るとギザギザが起こりにくくなります。
さて、コレで単純なシルエットの作り方は完了です、iPod風画像はこんな感じで作られます。
（ただ、ベジエ曲線というものを使ってもっと素晴らしいものを作る方がおられますので、コレは簡易法ということで。）
５、工夫する
根気はまだ足りていますか？
ではちょっと工夫してみましょう。
今度は素肌の部分やアクセントになる部分を白抜きしてみましょう。
元の画像をもう一度ファイル→Open as Layers
でレイヤーとして取り込みます。このとき無編集のレイヤーが上に来るようにレイヤーダイアログで順番を入れ替えておきます。
その状態から素肌の部分をパスで囲んでみました。
さて、この状態でシルエットのレイヤーを選択し、無編集のレイヤーを非表示にするとこんな感じになります。
つまり、無編集レイヤーを観ながらパスで選択領域を作り、実際はシルエットのレイヤーを修正しているわけです。手順3の真っ白にする手順行うと…
こんな感じで素肌が白抜きできましたね。この調子で作業を続けて…
こんな感じにしてみました、リボンは黄色く色づけて見ました。
６、もうひと工夫する
根気はまだ足りていますか？
素肌を白で抜いてしまうと、明るい背景の画像には合わせにくくなってしまいます。
なので、シルエットが浮き出るように工夫してみましょう。ラストです。
完成したシルエットのレイヤーをコピーして、シルエットをピンク一色にしたレイヤーを作ってみました。
コレに対してぼかしフィルタをかけてみましょう。
フィルタ→ぼかす→ガウシアンぼかしを選択します。
ぼかしフィルタはその名の通り輪郭をぼかす処理を行ってくれます。
ぼかし半径を縦横25に設定するとモヤっとした状態になりますので、
上からシルエットのレイヤーを重ねてみましょう。すると…
白い背景でもシルエットが浮き上がって見えますね。
さて、以上でパス抜きをしてシルエットを作るまでの説明は終わりです。
アラの目立つ説明になっていたらすいません、なるべく簡単にしたつもりです…
GIMPのバージョン違いで違う場面も出てくるかと思いますがそこはなんとか気合でお願い致します…
もっと効率、品質の良い方法もあると思われますので、興味のある方は色々調べてみてはいかがでしょうか。
それでは、大変長くなってしまいましたが、最後まで読んでくれてありがとうございます。
まったねー。
疲れた。
2010-01-25
タスクが多いことは良い事だ。
日記 |
仕事があって、仕事が忙しく。
趣味があって、趣味で知った人が居て。
酒が飲める体で、一緒に飲む人がいて。
美味しい飯も食えて、食べ過ぎて運動して。
こんなに良い事ばっかりなのに、不平や不満があっさり出てくる自分はまだまだだなぁと思う。
不平を言う暇もなく、不満を零す時間が勿体無いと思えるぐらいがよいのかもしれないなぁ。
2010-01-08 ViewをBitmapに。あ、あとあけおめです！
皆様、明けましておめでとうございます。
旧年中は様々な形での、ご支援ご支持、また厳しい意見などありがとうございました。今年もよろしくお願いいたします。
更新が遅れてしまいました。
一発目からandroid。
http://www.brighthub.com/mobile/google-android/articles/30676.aspx
この記事を見て色々摸索中。
タイトルの通り、Viewで描画されるものをBitmapで確保するための手段。
何のために使うかですか？OpenGLでテクスチャにするためですね。
書かれている内容としては
動的にBitmapを確保し、Canvasと結びつけて、好きなレイアウトをキャンバスを通してBitmapに描画することでViewをそのままBitmapとする。
といった内容なのですが、どーも上手くいきません。
どうやらレイアウトの描画、例えばRelativeLayoutならば
RelativeLayout rl = new RelativeLayout(this);
(ビットマップの確保、キャンバスの生成、素材Viewの作成)
rl.addView(v);
rl.draw(canvas)
とやることで、Canvasに関連付けられたBitmapにViewが描画され、適切な範囲を切り取ることで完成。
らしいが…
addViewの際に使用したViewがレイアウトの場合（ViewGroupを継承したクラス）
子ビューが描画されない…、ルートとなったビューのみ描画さるにとどまる。
スタックトレースとにらめっこしているとどうやら、ViewTreeの走査は行われているようなので、
描画されていてもおかしくないのになぁ。
追調査が必要…
2009-11-03
ベヨネッタ
先月の29日、話題のゲームソフトであるベヨネッタが発売となりました。
私も発売当日に即購入を致しましてプレイ致しました。
眼鏡美人が襲い来る脅威に、美しくそしてどこか背徳的に立ち向かって行くアクションゲームである本作は、デビルメイクライ（１作目）のプロデューサーでもあります神谷英樹氏が指揮を執ったことでも有名です。
今回のベヨネッタでもその神谷ismとでも言うべきアクションの面白みがふんだんに盛り込まれた、刺激的なものとなっておりました。
ノーマルの難易度でのクリアは達成されましたので（力押しではありましたが…）次から難易度の高いモードでの攻略をして行こうと思っております。
しかし、世の中には本当に情報の早い方がおられまして、もう隠し要素と言えるものを発見し楽しまれているようです。
私もまだノーマルをクリアしたに過ぎないので、どんどん新しい要素を発見していきたいところですね。
自分のペースでゆっくりと。
