webデザイン覚書 シェイプ・オブジェクトについて

with コメントはまだありません

配色の次に決定することは、シェイプです。

ここでいうシェイプとはオブジェクトの質感や形のことを指します。

ボタンの形状や各エリアの角を丸くするのか直線にするのか、
も検討します。

基本的には、すべての要素の角を丸くしてあげた方が、
作りこんだ印象を与えられます。2,3pxだけでも
だいぶ印象が違います。

かわいい印象などを与えたい場合は、
角丸のピクセル数を大きくしても良いかと思います。

角を直角のままにする場合は慎重に行います。
とてもうまく構成しない限り単調に見えてしまいます。
ユニクロや無印商品などのサイトは、
直線系で統一されたデザインが多いですが、
非常にきれいな構成だと思います。

単純にすべての要素を線で囲むのではなく、
うまくマージンをとったり、時には、
線で囲まないように空間を開放したりなど、
単調に見せないような施しが必要です。

次に質感ですが、
単色、べた塗は特に特有の質感を与える
わけではないですが、非常に強いエリアになります。
ガツッっと目立たせたい部分やアクセント
ほしいところなどに使用すると良いかと思います。
ただし、多用するとまた単調に見えますので、
全体のバランスを見ないといけません。

そのほかには、
グラデーションアクア系の質感、べベル・エンボス
など様々ですが、これはサイトの印象に合わせ
自由に選んで良いと思います。
ですが、質感はあまり混在させない方が、
いいと思います。アクア系ならアクア系で
全体を統一した方がデザインがしやすいと思います。

あとは、テイストにもよりますが、
なるべく画面に奥行きをもたすことができれば、
より手の込んだ印象を与えるデザインになります。

これは言葉で表すのは少し難しいですが、
レイヤー感を出すというか、平面的に考えるのではなく、
3次元的に全体を構成するように心がけていくと、
非常に深み・奥行きのある印象を与えることができます。

白い紙の上に、左上から順番に
要素を置いていくのではなく、何層もあるような意識をし、
不透明度を変えてみたり、重ねてみたりすることで、
少し違った印象を与えられます。

もちろんこれは、テイストにより様々ですので、
一つの意見としてお聞きください。

僕のシェイプに関する考えはこんなところです。。。

Leave a Reply