人気がある8つのウェブデザインのスタイルから学んでおきたいポイント
Post on:2010年9月6日
sponsors
人気があるウェブデザインのスタイルは良い悪いに関わらず、効果的に機能し人々を魅了する何かをもっています。
それぞれの主な特徴とそれがなぜ機能するのか、8つのウェブデザインのスタイルについて紹介します。
A Detailed Look into Popular Styles in Web Design
[ad#ad-2]
下記は各ポイントを意訳したものです。
- はじめに
- 1. Illustrations
- 2. Printed Paper
- 3. Realism
- 4. Imageless & Typography-Focused
- 5. Minimalism
- 6. Vintage Look
- 7. Large Images & Photo Backgrounds
- 8. Rich & Sleek User Interfaces
- おわりに
はじめに
さまざまなデザイナーがいるように、敬意をはらう多くのウェブデザインのスタイルがあります。若干のものはよく、若干のものはよくありません、そして多くは実験的なものです。
私たちがいつも見るウェブデザインにそれらのスタイルは存在しています。それらは機能し、私たちがよく知っているように成長したデザインスタイルです。
デザイナーとして私たちはいろいろなものを見ることを好みます。しかしもちろん、私たちのクライアントは一貫性を好みます。このポストで私たちは人気の高いウェブデザインのスタイルのいくつかを調査し、それがなぜ機能するかを吟味します。
機能するデザインを知ることはあなたの次のデザインでそれらの同じ原則を使う素晴らしい方法となるでしょう。
1. Illustrations
イラストはここ数年、ウェブデザインにおいて世界中で非常に人気の高いものです。レトロなデザインをはじめ、アブストラクトなものなど全てを含みます。
それはなぜ機能しますか？
イラストを使用したデザインは私たちにさまざまな可能性を与えます。使用しているウェブサイトはクリエイティブな傾向にあると言ってもよいでしょう。
特にオリジナルのイラストを使用したウェブデザインはブランディング効果が高いものです。キャラクターやオブジェクト、あるいは全体的にイラストを使用すると面白味があり、見た目をよくします。何千何万とあるウェブサイトの中でも特にユニークな外見をもたせることができます。
主な共通点
イラストを使用したデザインはパーソナルブランディング、マスコット、アブストラクトの三つのカテゴリに分けることができます。
パーソナルブランディングは多くの個人デザイナーや小規模なデザイナーのグループのサイトで使用されています。
マスコットは通常、動物や記憶に残るキャラクターで使用されています。イラストはブランドの名前と関係があるかもしれません。イラストをブランドと結びつけてみるのも面白いでしょう。
最後にアブストラクトは形を持たないか、あるいは抽象的なイラストのことです。これらはクリエイティブに利用され、ブランドにその魅力を与えます。
2. Printed Paper
インターネットの時代がすすむにつれ、紙が後生に残されるのを皆が望むようになりました。光沢のあるグラデーション、フラットなカラー、テクスチャなどはウェブデザインの初期にはほとんど見られないものでした。しかし現在、印刷をテーマにしたスタイルが戻ってきています。面白いタイポグラフィ、繊細なテクスチャ、プリントにフレンドリーなレイアウトなどは近年他のものよりも時間をかけていっそう使用されています。
それはなぜ機能しますか？
印刷デザインは何世紀もの間存在していました。最新の印刷デザインはそれらの歴史ある技術に積み重ねられた方法を持っています。印刷のデザインは、正しいデザイン理論で設計する時には非常に有効な手段となるでしょう。ウェブでこれらの規則を取り入れるには、ただウェブ用のエクスペリエンスに改善するだけです。
人々はリアリズムを好む傾向があります。テクスチャや奥行きはデザインの感触をより本物に近づけます。それはデザインを触れることができるように感じさせ、繋がることがより容易になります。
しかしながら、光沢のあるグラデーションやハードカラーを使ったデザインはあまりにもプロフェッショナルであるか、近付きがたい印象を与えてしまいます。印刷を連想させるウェブデザインがもっと良くユーザーと繋がることができるようになるでしょう。
主な共通点
このデザインスタイルの共通の特徴としては、セリフフォント、レタープレスやドロップシャドウのエフェクト、繊細なテクスチャがあげられます。また、紙やボール紙のようなエクストリームなテクスチャもしばしば利用されます。
デザインエレメントには鉛筆やメモ用紙などペーパー関連のものを含むことがあります。もちろん、印刷を連想させるウェブデザインにするために、ペーパー関連のオブジェクトやテクスチャを使用する必要はありません。
3. Realism
本当に印刷されたようにまねることとともに、写真的なリアリズムをもったオブジェクトをまねるトレンドもでてきました。中でも、デスク上を彷彿されるリアリズムは人気が高いものです。ユーザーに面白い見地を与え、クールな見栄えを与えます。
それはなぜ機能しますか？
リアリズムのウェブデザインは本質的に、印刷を連想させるウェブデザインと同じ理由の多くで機能します。ユーザーに見るべき本物の何かを与えることで、ユーザーはデザインに触れることができ、いっそうリアルで、もっと多くの繋がりを思われさせることができます。
リアリズムを使うことで、我々はユーザーをリアルな場所の中に連れていくことができるでしょう。
主な共通点
現実的に置くことができるオブジェクトであれば、その可能性は果てしなくあります。とは言え、最近の傾向としては、ウェブデザインの中に机のオブジェクトを置いたものが多く見られます。しかしながら、この見た目のため他のタイプのオブジェクトを使う多くのデザインもあります。
他のオブジェクトを使用したり、ユニークなアングルを採用しても、視線は上からのものが多くなっています。
4. Imageless & Typography-Focused
ここまで取り上げた全てのスタイルは画像を含んだものでした。多くのデザイナーが今タイポグラフィやレイアウトを引き立たせることに力を入れ、ウェブデザインをより魅力的にすることに使っています。これらのウェブサイトは写真画像の代わりに、形やテキストやスペースやテクスチャなどを使ってアイデアをつくりだします。
それはなぜ機能しますか？
タイポグラフィはユーザーに、イメージよりむしろコンテンツにフォーカスを合わせさせます。ウェブデザインでタイポグラフィを唯一のエレメントとして使用することはよりいっそう魅力的でありえます。
このようなデザインはユーザーエクスペリエンスとウェブサイトの全体的な流れが同じであり、フォーカスがあったものとなっています。ウェブサイトからより早く、より良く全体的なメッセージを受け取ることができます。
主な共通点
多くのタイポグラフィ、そしてミニマルなデザインではビジュアル的な魅力を加える時に、カラーや形を利用します。さらに、テクスチャや奥行きのエフェクトなどを優れた特徴とします。
いろいろなフォント、多くの非標準のフォントを使用して、ユニークなエフェクトを作ってみてください。
また、カラーの組み合わせは予想外の組み合わせが通常これらのスタイルのデザインでよく機能します。最近のトレンドではツートンカラーのカラースキームが多く見られます。
[ad#ad-2]
5. Minimalism
ウェブデザインのミニマリズムは不必要なすべてを方程式から取り除くことを実行したものです。このデザインは非常にシンプルで組織的で、そして効果的である傾向があります。
全体的にシンプルで、若干のイメージと付加的な特徴をもち、極めて単純化したものをはじめ、さまざまな程度のミニマリズムがあります。
それはなぜ機能しますか？
ウェブデザインはメッセージを伝えることが全てです。ミニマリズムのデザインで取り除いた後残すものは、コアエレメントとウェブサイトが必要とするコアコンテンツです。これはメッセージを伝え、ユーザーに見るべきクリーンな、組織的な、そして落ち着いたデザインを与えます。
主な共通点
多くのミニマリズムのデザインではツートンカラーのカラーパレットを使用し、例外はありますが、ブラックとホワイトを使用しています。タイポグラフィに重点をおいたスタイルに類似しており、タイポグラフィのユニークな使い方が審美的な印象を与えます。
セリフ系のフォントの人気が高く、ホワイトスペースと奥行きを巧みに使用します。エフェクトを使用する場合は非常に繊細なものにします。ホワイトスペースは多めで、グルーピングする主要な要素です。
6. Vintage Look
人々はレトロ、あるいはヴィンテージを見ることを好みます。ヴィンテージのデザインは非常に人気の高いスタイルとなっていて、人類の歴史のどんな文明の時間でもカバーしています。中でも、インスピレーションとしてルネッサンスを使ったデザイン、1950年代、1960年代風のデザインをよく見かけます。
それはなぜ機能しますか？
人々は有史時代に好奇心をもちます。異なる文化、異なる時代を普通のウェブサイトでユニークな設定のために使用してください。関連したイメージはユニークで面白く、印象に残るよう機能するでしょう。
主な共通点
その時代の人々やオブジェクトがこのタイプのデザインで使用されます。そして、多くのテクスチャも使用されます。布や紙といったテクスチャが特に多く、暖かいトーンをもっています。
7. Large Images & Photo Backgrounds
オーバーサイズのエレメントはタイポグラフィに重点をおいたサイトやミニマリズムのサイトで特に多く見られます。これらと同様にウェブデザインの新しいタイプとして大きい写真を背景に使用したものがあります。一つの大きい背景画像を使用したデザインは活気があり、美しく、そしてクリエイティブである傾向があります。
それはなぜ機能しますか？
この外観は確かに印象的です。大きな顔写真、都市などの景観は確かに大きな影響を与えます。これを見たユーザーはすぐに「このサイトは何のサイト？」と思うことでしょう。言いかえれば、このようなウェブデザインはかなり早い段階でユーザーに興味を持たせることができるということです。
主な共通点
このタイプのデザインで最も普通の特徴は、もちろん大きい写真の背景です。写真は通常ユニークで、そしてクリエイティブなものを使用し、素早くユーザーの注意力をつかむものにします。
コンテンツは写真の背景に取り組まれるので、レイアウトはたいてい抽象的になり、コンテンツは最小になるでしょう。例えば、唯一の利用可能なコンテンツとしてナビゲーションだけを提供することも検討してください。
8. Rich & Sleek User Interfaces
リッチなユーザーインターフェイス、光沢のあるグラデーションといったモダンなウェブベースの魅力がこのデザインスタイルのすべての特徴です。前述のデザインスタイルの多くと対照的で、この外見はほとんどオフラインからインスピレーションをとりません。
それはなぜ機能しますか？
デザインはモダンで、光沢感があり、現代的です。この外見を使うのはウェブアプリケーションや開発サービスのように近代の技術的な何かを扱っているウェブサイトが多いです。光沢感のある見た目は近代的で高いバリューのあるブランドを引き立てます。
主な共通点
グラデーション、透明度、鏡面反射、そしてほんの少しのテクスチャがこのスタイルのほとんどをしめます。また、リアルな外見を伴ったリッチなユーザーインターフェイスも同様に使用されます。
例えば、ナビゲーションで通常ドロップシャドウやタイポグラフィを使用するところを、押したり戻ったりするエフェクトが加えられたりします。イメージやロゴは鏡面反射やシャドウを伴うこともあります。
このスタイルで気づくべきもう一つのことは多くの光沢があるアイコンが使われることです。このスタイルは他のいかなるスタイルに比べても多くのアイコンが使われます。
おわりに
デザイナーはデザインのトレンドとすでに人気が高いスタイルについて、その理由を理解しなくてはなりません。その理由はすでに、それが効率的であるか否かにかかわらず、ユーザーとの繋がりがあり、面白いビジュアル的な魅力を備えているということです。
ゴールは常に直観的な見地から人気が高いスタイルをみて、そして最もよく機能するものを学ぶことです。これはウェブデザイナーとして自分自身のスタイルを向上させることに役立つでしょう。
sponsors
