海外のウェブサイトから学ぶ、ディテールにこだわったデザインのテクニックのまとめ

多くのユーザーはその繊細なディテールに気がつかないかもしれませんが、ディテールにこだわることでデザインの全体的な印象に大きな影響を与えているウェブサイトをVandelay Desingから紹介します。

下記は各ポイントを意訳したものです。

サイトのキャプチャ

El Passion

繊細なテクスチャを背景にし、ちょっと面白いドロップシャドウ、ロゴのホバー時のエフェクトもかっこいいです。

サイトのキャプチャ

Atelier

ページ上部の真ん中にあるユニークなシャドウのエフェクトが目をひきつけます。

サイトのキャプチャ

Carnation Group

スライダーのコントロールに使用しているドロップシャドウがあるとないとでは使い勝手が変わるでしょう。

サイトのキャプチャ

RAPP

ナビゲーションの各アイテムはホバー時にカラーが異なります。

サイトのキャプチャ

Capitol Couture

繊細なテクスチャ、ボーダー、カラーを使った垂直型のナビゲーションが美しいです。

サイトのキャプチャ

Ascension Latorre

ヘッダで使用しているテクスチャは、フラットなカラーやグラデーションではこのクオリティはだせないでしょう。

サイトのキャプチャ

Telegrame

背景に繊細なテクスチャとウェーブ状のボーダーが印象的なデザインです。

サイトのキャプチャ

SachaGreif

コンテンツエリアは背景の上に繊細なシャドウのエフェクトをもっています。

サイトのキャプチャ

Taiyab Raja

ポートフォリオのサムネイルに使用しているドロップシャドウは、とても印象的です。

サイトのキャプチャ

Scene 72

このサムネイルはとてもユニークな背景をもっています。

サイトのキャプチャ

Bloapp

このサムネイルは角丸とドロップシャドウです。

サイトのキャプチャ

BERG Cloud

ナビゲーションはレトロちっくな3Dのエフェクトで、とても面白いです。

サイトのキャプチャ

helloberry inc

背景にとても繊細なパターンが使用されています。

サイトのキャプチャ

The Archer Group

ヘッダのボーダーは単に細い線ではなく、手書き風の面白いボーダーを使用しています。

サイトのキャプチャ

Designers.MX

背景に繊細なざらっとしてテクスチャ素材を使っています。

サイトのキャプチャ

Gerren Lamson

ヘッダにはライトが使われており、背景のパターンのテクスチャはフラットなものを使うより繊細なタッチになっています。

サイトのキャプチャ

Beta Punch

繊細なパターンのテクスチャを効果的に使用しています。

サイトのキャプチャ

cssigniter

宇宙空間を連想させるグリッドのオーバレイが面白い外見を与えています。

サイトのキャプチャ

Band Themer

ヘッダに繊細なテクスチャを使い、背景のざらっとしたテクスチャにフィットしています。

top of page

©2017 coliss