純色のブラックをヘッダーに使い画面を引き締め、切り抜いた製品のバックには淡いグラデーションを敷き、明朝体のフォントを見出しに使って上品さを演出しています。各項目の区切りには淡いグレーの罫線を使い、堅苦しくなりすぎないようにしています。下層ページの製品説明には赤やピンクなどの色を全体に大きく使い、化粧品メーカーらしい製品のアピールも見られます。
執筆者
カテゴリ
基本情報
化粧品・コスメに関連するデザイン
-
「OPERA コスメティック公式」のホームページデザイン解説ファーストビューは画面左が製品名とカートボタン、右はスライドショーとなっており、リップの色に色味を合わせた女性のビジュアルが製品の魅力を最大限にアピールしています。肌の色に近い赤みのかかったベージュをベースに、細身のフォントでスペースを大き...
-
「Surratt」のホームページデザイン解説ニューヨークのコスメブランドのECサイトです。ファーストビューでは女性のアップのビジュアルがブラックの背景に乗せられ、背景にはわずかに星がまたたくようなドットのアニメーションが添えられていてメイクの輝きを表現しています。ビジュアルには使われ...
-
「肌ナチュール 炭酸クレンジング」のホームページデザイン解説ホワイトをベースにグレーをアクセントにしたサイトです。ファーストビューには、肌ナチュールのシリーズを紹介しています。3本ラインのメニューボタンにて、Waqooの製品やコンセプトなどを案内しています。トップページの中央に、肌ナチュールの炭酸ク...
コーポレートサイトに関連するデザイン
-
「西山製麺 ドイツ法人」のホームページデザイン解説画面中央に大きく配置された企業ロゴと、暗がりの中から浮かび上がるように配置された麺の写真の組み合わせで、画面全体にまず重厚感を与えています。ブラックに近いダークグレーの背景に、麺の色を思わせるベージュのテキストが映え、見出しのアクセントに添...
-
「エッグフォワード」のホームページデザイン解説トップページは柔らかく明滅するオレンジのドットのアニメーションをバックに、グレーとオレンジのフォントで力強く書かれたメッセージと写真で構成されたスライドショーが目を引きます。グレーをベースに、オレンジをアクセントにした鮮やかな色使いですが、...
-
「STRIVE」のホームページデザイン解説サイトにアクセスするとまずブラックの背景の上を画面いっぱいに拡大した企業ロゴが走り、画面が反転するとロゴの一部がグラデーションになって背景に固定され、その上にキャッチコピーが重なるファーストビューです。ゆっくりと色が変わるグラデーションのラ...
ブラックを使ったデザイン
-
「萬珍軒」のホームページデザイン解説画面中央に大きく表示された店舗ロゴの背景にスライドショーが表示され、明度を落とした写真を次々に映し出して重厚感と迫力を感じさせるファーストビューです。ブラックの引き締まった画面にホワイトの太いフォントが映え、ゴールドの中華風のあしらいがアク...
-
「FRIXION 3.0 解放しよう。」のホームページデザイン解説ファーストビューの背景に表示される細いラインのグラフィックが画面のスクロールに合わせてアニメーションで変化し、四隅にナビゲーションバーやSNSアイコンを配置して画面中央を大きく使うことで画面全体に迫力を生み出し、特にワイドモニターでの閲覧時...
- 「西山製麺 ドイツ法人」のホームページデザイン解説
画面中央に大きく配置された企業ロゴと、暗がりの中から浮かび上がるように配置された麺の写真の組み合わせで、画面全体にまず重厚感を与えています。ブラックに近いダークグレーの背景に、麺の色を思わせるベージュのテキストが映え、見出しのアクセントに添...
堅め・信頼感なホームページのデザイン
-
「済生会横浜市東部病院」のホームページデザイン解説ホワイトに淡いブルーのグラデーションを組み合わせた背景の色使いが、医療機関らしい清潔さをまず感じさせます。メインビジュアルはブラックのフォントに手書きのブルーの文字を組み合わせ、グラデーションのボタンを組み合わせたさわやかなイメージの上に、...
-
「One Day Dental」のホームページデザイン解説サイトを開くとまず表示されるスライドショーは、ビジュアルの上に予算別のコースを表示して、治療にかかる大まかな金額を最初に表示することでユーザーの選択を促しています。ホワイトに濃いネイビーのコントラストの強さが、堅実さを清潔感を感じさせる色使...
-
「JAXA 有人宇宙技術部門」のホームページデザイン解説ファーストビューでは画面全体に表示された宇宙ステーションの写真のスライドショーと、その上に重ねられた太字のキャッチコピーが、力強いメッセージ性を感じさせます。各コンテンツの見出しは施設名は大きく写真に重ね、トピックスの見出しはやや小さくマー...
