見出し画像

【1日1サイトレビュー #3】master-piece| マスターピースオフィシャルサイト


【概要】

高いファッション性と高い機能性を兼ね備えたバックブランドのWebサイト

【印象】
・背景色を黒と白で分けており、かつ挿し色に黄色が使用されており、メリハリのある印象。
・トップページがほぼ細字の英語で記されており、洗練された印象を感じる。
・遅いと感じないフェードインなので、スクロールしていて心地よい。
・「見やすさ≦お洒落感」なWebサイトなのかな、と感じた。

【想定目的】
・集客、売り上げ拡大

【想定ターゲット】
・主に20代〜40代の男性向け

【構成】
・トップページ+下層ページ7ページ(PRODUCTS、LOOK、JOURNAL、NEWS、ABOUT、STORE、FACTORY BASE)

【メインビジュアル】
・スライドで表示される4枚のなかで、一人ひとりのファッションが変化しないので、情報量が多くなくスッキリしている。
・また、背景もほぼ変わらないので、落ち着いた印象を感じさせるのはサイト全体の配色だけでなく、そういったメインビジュアルも落ち着いた印象を与えることに大きく寄与しているのではないか。

【コンテンツ】
・サイトには男性のモデルのみ掲載されており、主に男性向けのプロダクトを販売。
・トップページのメインビジュアルがフェードインで画像が切り替わる。
・トップページ上で下へスクロールすると、各下層ページへの入り口が上から順に表示されるが、それぞれレイアウトが違う。また、その中のほとんどが下から上へのフェードインで表示される。文字は左→右へのフェードイン。
→外側へ広がるように現れる、他のWebサイトもこれが多いのか(?)。
・各コンテンツにマウスオーバー時、奥から手前へふわっと拡大されるアニメーションが施されている。
・テキストや枠の黒ははっきりとした黒だが、黒を背景としている部分は若干グレーに寄っている。

【配色】
・黒テキスト、枠:#000
・白背景:#FFF
・黒背景:#242424
・「NEWS」部分の黒背景:#2E2E2E
・「© master-piece」:#555555
・メインカラーが黒と白、サブカラーが黄色のような構成と感じるが、メインビジュアルの大半を占める色が砂の暗め肌色のため、黄色と暗め肌色が同系色としてリンクしている気がした。だから違和感がなかったのかな(?)。下記リンクにて、砂の色は「枯野(かれの):#DAC290」に近かった。

【フォント】
・白テキスト(英語):Raleway,sans-serif
・白/黒テキスト(英語)、数字:Poppins,sans-serif
・白テキスト(follow us):Playfair,serif

【レスポンシブ】
・スマホの方が見やすい(縦長でスマホ画面に収まる)。各コンテンツのレイアウトが統一されており、PCより見ていて安定感がある。
・ただ、下までが長い分、各コンテンツを見ながら再度トップに戻る可能性は低そう→離脱が早い(?)。メニューも2本線のハンバーガーボタン。

画像1


この記事が気に入ったらサポートをしてみませんか?