Webコンサルティング

デザイナーの小島です。
寒くなってきてそろそろ今年のバス釣り(早朝)も厳しくなってきました。
(出来ればもう一回くらいは行きたいけど)

これからの季節どんどん寒くなり、しまいには野池などは凍ってしまいます。
全面氷で真っ平らです。フラットです。

フラットデザイン
iPhoneなどが取り入れて当たり前のように見かけますが
逆にボタンに見えなくて押しにくい等の声を良く聞きます。

そんな中で海外のサイトで見かけるようになってきた言葉が「flat design 2.0」
何年か前にWeb2.0という言葉がはやりましたがその流れでしょうか。
平坦で押しにくい印象のフラットデザインにちょっと効果を加えて立体感や動きを見せる方法です。

実際はフラットデザインという言葉が出来て少したったころから存在はしていて
ロングシャドウなどが有名でした。
あとはポリゴンデザインなどもありますが
これはWebサイトのテーマなどにマッチした場合は良い感じだと思います。

今回はそんなフラットデザインのアレンジを考えたいと思います。

真っ平らフラットデザインです。
Webサイトによっては効果的だったりもしますが
手抜きと思われる可能性大です。

ロングシャドウを付けてみました。
でもとりあえず付けた感満載です。

ボタンにグラデーションを付けてみました。
ちょっとおしゃれっぽくなりました。

文字に影を付けてみました。
わかりにくいですがある無いとでは大違い。
さりげないおしゃれです。

ボタンに影を付けてみました。
一気にボタンっぽくなりました。

文字をアイコンにしてみました。
印象が良くなった気がします。

あかるくしてみました。
最近のiPhoneのボタンのイメージです。

丸くしてみました。
丸ボタンはミニマル系デザインだと良くみかけます。

アイコンを写真にしてみました。
モンサンミッシェルにしてみました。
昔よく見た感じになりました。

分かりにくいので文字を乗せてみました。
文字で分かりやすさは出ましたがバランスは大切です。

文字を取るついでに
この際モンサンミッシェルだけにしてしまいました。

色補正しました。

大きくしてみました。
最近のPhotoshopは便利です。
クイック選択ツール→境界線を調整でこれくらいは出来てしまいます。

そんな訳で最近流行のフラットデザインですが
やらな過ぎもやり過ぎも良く無いのがわかりました。
絶妙なところを探して行くのもデザインの楽しいところでもありますね。