アシアルブログ

アシアルの中の人が技術と想いのたけをつづるブログです

質感はどこからやってくる?

こんにちは、鴨田です。

何かパーツをデザインするとき、
もっとリアルにしたいな、質感を出したいな、とか、
思うことがあったりしませんでしょうか。

まあどういうデザインを行っているかによって違うとは思いますが、
誰もが一度はそんなことを考えたことがあるはずです。

では、何をもってリアルな質感というのか?

答えはそれぞれにあるとは思うのですが、
3DCGを少しだけかじっていた人間としては、
その主要なところは「影、立体感、反射/透明度」が主だったところだと思っています。

ということで、一つのボタンを例にして、
どうすれば、ボタンに質感を与えられるのかを見ていきたいと思います。



00.ボタンを置く




ボタンだと言い張れば、多分ボタンです・・・。



0.ボーダーを追加して、角丸にする




まあ、ボタンかな・・・。



1.影を付ける




なんとか、ボタンっていってもいいような気がしてきました。



2.立体感(ベベル)を表現する




ようやく押せるボタンという雰囲気が出てきました。



3.反射/透明度を付け加える




大分盛ってしまいましたが、デザインされたボタンという感じになりました。

なんかやりすぎた感があるので、ちょっと手直しします。



4.手直し




手直しになってるのかどうか分かりませんが、少しユニーク感は出たのではないかと思います。
(実際、こんなゴテゴテしたものを使うかどうかは置いておいて)



上記、一連の作業はPhotoshopで行いました。
特に難しいことは行っていないので、見よう見まねで誰にでも作れるはずです。

意味があるのかどうか分かりませんが、
一応、パレットのスクリーンショットだけ置いておきます。
よくやる効果の重ね合わせですね。