Google Chrome または Safari を使用される事を強くお薦めしますw
他のブラウザでは Javascript の処理が重いです(汗)


2010/12/10

画像の合成 その1

老若男女誰もが萌える学園モノを作ろう!と思い立ったとしますw
必要な画像の種類としては何よりも登場人物の立ち絵と背景でしょう。
まずこんな背景を用意したとします。

立ち絵として小悪魔ちゃん(ぉぃ を用意します。

これを透過pngとかgifにして背景の上に配置すると・・・

こんな残念な結果になります。
小悪魔ちゃんの回りに白いドットがあって非常に汚いですね。

小悪魔ちゃんの頭の羽(なんで頭にも羽があるのかは突っ込んではいけません)の先を拡大してみるとこんな風になっています。

絵の縁の部分ではお絵かきツールが画像のギザギザを目立たせないために背景色へのグラデーションとなるピクセルを配置してくれちゃっていまして、これが透過色として抜けてくれないので合成したときにゴミになってしまうのですね。

解決法としてはこのグラデーションの部分をお絵かきツールで地道にポチポチと1ピクセルずつ透過色に変更するというのがもっとも頭を使わなくて良い方法ですw
「技量の無さを体力でカバーする」というのは実は私はそんなに嫌いじゃないんですがw、ただこの方法には面倒だという以外にもう1つ問題があります。それは、

背景の色合いによっては縁のギザギザが目立ってカッコ悪い

ということです。お絵かきツールが滑らかに見えるようにしてくれた部分を消すのですから当然ですね。

「Dragon's eye」では体力勝負で縁のゴミを取り除いた画像を作りましたので、それを合成してみましょう。校庭で出会った姉山先生ということにしてください(笑)

上の小悪魔ちゃんほどひどい結果ではないですし、この程度なら気にしなくてもいいやん、と思うかもしれませんが、やっぱり顔の縁がギザギザなのは、せっかくの美人なのにちょっと可哀想ですw

というわけで、この立ち絵の回りのゴミやギザギザをスクリプトで目立たなくできないか?
というのが今回のテーマです。

何の検証もせずに記事を書き始めていますので、どこまで効果のある結果を得られるのか、あるいは全然効果がないのか、まったく分かりませんw

0 件のコメント:

コメントを投稿