ウェブデザインをワンランクアップさせるデザインテクニック『奥行き』の使い方
Post on:2011年6月22日
sponsors
あなたのウェブデザインをワンランクアップさせる『奥行き』を使いこなすための5つのデザインテクニックを紹介します。
Creating Depth in Web Design: 5 Design Tricks
[ad#ad-2]
下記は各ポイントを意訳したものです。
はじめに
デザインに『奥行き』を与えると、ウェブサイトをユニークにし、ビジターに忘れがたい印象を与えることができます。それが抽象的な方法なものであっても、奥行きがリアリズムを与えます。グラフィックデザイン、ロゴ、ウェブデザインなどこういった付加的なリアリズムはあらゆるデザインにおいて、興味を引き起こすことができます。
また、奥行きを使うことで、特定のエレメントの強調をしたり、情報の正しい階層を作ることも可能です。フラットなデザインでも注目を得るかもしれませんが、奥行きを与えることでさらに多くの注目を得ることができるでしょう。
ウェブデザインに『奥行き』を与えるデザインテクニックはたくさんあり、その中からトレンドである5つのテクニックをチェックしてみましょう。
リアリスティックなインターフェイス
見た目がリアルであるというのは、非常に効果的です。グラデーション、シャドウ、オーバーレイなどをエレメントに適用した3Dのようなリアルなボタンは、より際立ったものに見えます。
しかしながら、これらのテクニックを過度に適用してしまうと、デザインを悪い方向に導くので注意が必要です。
リアリスティックを取り入れてデザインに奥行きを与えるポイントは、それらがどのように現実的に見えるか想像することです。単に3Dのインターフェイスを作るだけでなく、リアリスティックなものを作ってください。
ラッピングとリボン
ラッピングをデザインに取り入れることは最近のデザイントレンドで、奥行きを与えつつ、ビジュアル的にも素敵なエフェクトを与えます。
ラッピングには、ソリッドやソフトなどさまざまな外見のものがあります。これらのリボンはアクションを呼びかけるデザインエレメントとして、見出しや特徴のアイテムなどによく使用されます。また、エレメント間の奥行きと分離をあらわすためにも使用されます。
遠近法
デザインに遠近法を取り入れることは、視覚的に魅力的な方法で、同時に奥行きを加えることができます。このテクニックは他のテクニックより繊細になる必要はなく、デザインに対してメインとなる興味を起こすことを意図したものです。遠近法をデザインに使うと、多くのビジターの印象に残るものになるでしょう。
遠近法を取り入れるデザインアプローチは、多くの異なる形状で行えます。これらの基本的なルールは、昔美術で習った方法とほぼ同じです。水平なスペースにそれを配置し、角度を変化させるにつれ、サイズと角度を一貫して変化させます。
オーバーラッピング
奥行きは、エレメントをグリッドにオーバーラッピングさせることで簡単に作り出すことができます。例えば、コンテンツエリアをより大きく見せるためにエリアの残りをオーバーラッピングさせ、より近くにあるように見せることができます。また、ドロップシャドウを使うとより強調することができます。
下記の例では、エレメントはすべてフラットです。しかしながら、いくつかのエレメントを重ねることで、奥行きを生み出しています。複数のオブジェクトを重ねることで、デザイン全体に奥行きを作り出すことができます。
シャドウ
シャドウで奥行きを作ることは人気のあるトレンドで、非常に優れたデザインテクニックです。一番のポイントなるのは、繊細に使用することです。例えば、浮いているようなエレメント、紙がめくれたようなエフェクトなど、これらはすべて繊細なシャドウによって生み出されます。
シャドウはフラットなデザインからエレメントを浮かせ、よりリアルに見せることができます。これはリアリスティックなアプローチを非常に簡単に行えると言ってもよいでしょう。上記のように、写真にシャドウを含ませることで、より際立つ見た目になります。
Warping Drop Shadows to Give Depth
紙がめくれたようなエフェクトも最近のトレンドで、見た目の構造を犠牲にせず、簡単にデザインに奥行きを与えることができます。似たテクニックとして、ページやコーナーにカールを与え、ユーザーの興味のポイント生み出すものもあります。
おわりに
すばらしい見栄えをつくるために、常に『奥行き』を使わなければならないわけではありません。しかし、『奥行き』が大きな結果を生みだすことは事実です。
[ad#ad-2]
sponsors
