ちょっとした工夫でかっこいいボタンが簡単に作れてしまう



簡単にカッコいいボタン

ボタン一つでもちょっとした工夫でぐっとデザインセンスが良くなる。
いいデザインをする人ほど、細かい部分にこだわってデザインする。
だから、見た目は同じように見えても全体としてなぜだかプロのデザインって格好良かったりする。
さて、今回のボタンも見た目シンプルだけれど常に心がけておくだけでデザインがかなり向上するので、
今回の内容もメモして覚えておいて欲しい。

使うのは1度のレイヤー効果だけ

いろいろとレイヤーをたくさん作ってかぶせて、効果を付けてっていろいろやればもっと格好良くなるかもしれないけれど、
複雑にすればいいってものじゃない。
シンプルなものが意外と格好よかったりもする。
どんなものも基本が大切。
料理でもスポーツでも、プロの技を見ると難しいことばかりやっているように思えるが、
基礎があってこその応用。
デザインだって、基礎があってのオリジナル。
さて、順番に見ていこう。

ベベルをかける

みんなよく使うと思う、ボタンをちょっと立体感を出させるために「ベベル」効果を使う。
ベベル効果
設定は次のようにする。
ここは適当でよい。僕自身も適当に作った。
深さを強くして、立体部分をはっきりさせた。
さりげないベベルにしたいので、サイズも小さめに。
ベベル効果

さらに立体感を出す

立体感を出すために、「光彩(内側)」を使う。
ボタン縁の角ばった部分は光を反射させるので、ベベルの部分と平面の部分の境界にあたる部分に光を入れてみる。
境界に光を入れる
設定は次の通り
境界に光を入れる
境界を少し明るくすることが出来た。
先ほどのベベルだけの場合と比べてみる。
ボタンの立体感
ボタンの縁の立体感が増したのがわかると思う。
普通、あまり使わないこういった細かくさりげない工夫が、ぐっとボタンの質を高める。
ボタンに限らず、立体感を出すのにこの「光彩(内側)」が使えるのを覚えておこう。

グラデーションで自然に

ここについてはやらなくてもいいと思う、メインはさきほどの「光彩(内側)」。
普段、周りにあるものは必ず色の変化がある。
全ての部分が全く同じ色であることはないので、
リアルに近づけるには多少なりともグラデーションをかけておく癖をつけておくと良い。
ボタンのグラデーション
設定は次の通り。何も難しくない。
ボタンのグラデーション

さりげない工夫だけれど、いつでも使える癖をつけてデザインの質を上げれるようにしよう。

Related Posts Plugin for WordPress, Blogger...

One Response to “ちょっとした工夫でかっこいいボタンが簡単に作れてしまう”

  1. [...] ちょっとした工夫でかっこいいボタンが簡単に作れてしまう シンプルだけどクールでかっこいいボタンをPhotoshopで簡単に作る方法 [...]

Leave a Reply