デザインノウハウ

属性マークを引き立てる!枠デザインアイデア集

当サイトはアフェリエイト広告を利用しています
ユウ
ユウ

印象が変わるから意外と大事!

同じ内容のYouTube動画はこちらから!

属性マークの枠の作り方

前回紹介した属性マークをアイコンにするための枠の作り方を解説します。

まずはマークの色より少し暗めに配色した背景をベースにしたものをいくつか紹介します。

マークと同色のフチをつければシンプルなアイコンが完成です。
シンプルすぎると思ったら、フチとマークにシャドウを追加しても良いでしょう。

マークの上下に反射を追加すると立体的なアイコンが完成です。
「ワープ:魚眼レンズ」でマークを少しだけ歪ませるとより立体的に見えます。

また、周辺にグレーと「光彩(内側)」に白フチをつけたものを追加すればガラス球風のアイコンに出来ます。

次に黒背景にマークと同色のフチをベースにしたものをいくつか紹介します。

黒と暗めのグレーで線形グラデーションを作ればカッコ良い雰囲気のアイコンが完成です。
黒とマークの色の円形グラデーションにしても違った雰囲気になります。

斜めのグラデーションで金属の反射を追加するとメダル風のアイコンが完成です。
フチを「パス交差」のグラデーションにすれば立体的なフチのあるアイコンになります。

属性マークは枠を変えるだけでもかなり雰囲気が変わります。

マークを使用する媒体に合わせた枠をデザインするのに役立てば嬉しいです。