メロウな時間のwebサイト漁り 08

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 01 Webサイト100選
webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 01

Interscope Records – https://www.interscope.com/

今回のwebサイト漁りはInterscope Recordsでございます。
ユニバーサルレコードの傘下レコードレーベルでございまして、2pacやDr.dreやEminemをはじめKendrick lamarやJ.coleやJuice WRLD、Pi’erre BourneやらMoneybagg YoやらJIDやらDJ mustardやらetc…数え上げたらキリがないほどのアーティストが所属しております。

さてそんな巨大レーベルのWebサイトはどういった構造なのか?それでは拝見していきましょう。

Top page

Key Visはスライド形式

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 01

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 01

スクロールすると3カラムで最近のMVと所属アーティストが並びます。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 02

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 02

それぞれホバーするとキャプションが出てきます。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 03

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 03

アーティストは、キャプションと合わせてSNSアイコンも表示されます。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 04

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 04

そしてページ下までスクロールしていくとSign upの画面とfooter navが用意されています。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 05

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 05

ページ的には凝った構造もしておらず、見やすく、各アーティストごとのリンクへ飛びやすい造り。

ただし、アーティスト数が多すぎるのでホバーしないとアーティスト名が分からないのは難点かなと思いました。

Contents page

Artist page

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 06

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 06

4カラムでズラーっとArtist picが並んでおります。
ホバーするとキャプションとSNSアイコン、それからShop Itemがあるアーティストにはショッピングカートのアイコンも用意されていました。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 07

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 07

Videos page

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 08

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 08

First viewには傘下アーティストの最新動画。それから4カラムでずらりとビデオが並びます。
もちろんホバーするとキャプションが現れます。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 09

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 09

Shop page

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 10

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 10

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 11

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 11

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 12

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 12

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 13

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 13

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 14

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 14

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 15

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 15

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 16

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 16

各コンテンツごとに色分けされているおかげで視覚的に分かりやすい造りになっています。

そして、Navigation MenuのShop page tabを見ると、Shop page内のコンテンツ毎にページが用意されておりますのでそちらも見てみます。

Shop page contents

Artist Collections

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 17

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 17

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 18

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 18

Key vis以外は3カラムでレイアウト構成されてます。ホバーでアーティスト名が表示され、クリックすると該当アーティストのアイテムページへと飛びます。

Label Collections

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 19

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 19

抽象画のようなKey visが目を引きます。

スクロールしていくと、傘下レーベルのアイコンが並びます。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 20

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 20

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 21

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 21

こちらはホバーすると背景色が変わる仕組み。もちろんクリックするとレーベル毎のアイテムページへと飛べる仕組みになっています。

Gift Guide

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 22

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 22

クリスマスが近いからでしょう、Key visはクリスマスプレゼントを意識した画像。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 23

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 23

そして、各アイテムが並びます。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 24

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 24

ホバーするとキャプションが表示。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 - Interscope Records 25

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 25

itemページはこんな具合。

商品名、アーティスト名、値段、個数、購入ボタン、商品説明とサイズ表記。
必要最低限な表示でシンプルに買い物を出来る造り。

まとめ

所属アーティストが多いので、写真をホバーした時だけでなく、アーティスト名が常時表示されているとわかりやすいかなと。もしくはサイドバーかナビゲーションにA-Zのindexを配置していてくれれば、目的のアーティストを見つけやすいかなと。

Shopページの充実具合とデザインがカッコよく見やすかった。カテゴリー毎の色分けなんかで視覚的に分かりやすいページ造りは今後の参考にしたいと思います。

メロウな時間のwebサイト漁り 09へ

コメント

タイトルとURLをコピーしました