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
スクロールすると3カラムで最近のMVと所属アーティストが並びます。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 02
それぞれホバーするとキャプションが出てきます。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 03
アーティストは、キャプションと合わせてSNSアイコンも表示されます。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 04
そしてページ下までスクロールしていくとSign upの画面とfooter navが用意されています。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 05
ページ的には凝った構造もしておらず、見やすく、各アーティストごとのリンクへ飛びやすい造り。
ただし、アーティスト数が多すぎるのでホバーしないとアーティスト名が分からないのは難点かなと思いました。
Contents page
Artist page

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 06
4カラムでズラーっとArtist picが並んでおります。
ホバーするとキャプションとSNSアイコン、それからShop Itemがあるアーティストにはショッピングカートのアイコンも用意されていました。

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

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 08
First viewには傘下アーティストの最新動画。それから4カラムでずらりとビデオが並びます。
もちろんホバーするとキャプションが現れます。

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 11

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

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

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

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

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

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

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 24
ホバーするとキャプションが表示。

webサイト 100選 | メロウな時間のWebサイト漁り- メロウな時間のwebサイト漁り 08 – Interscope Records 25
itemページはこんな具合。
商品名、アーティスト名、値段、個数、購入ボタン、商品説明とサイズ表記。
必要最低限な表示でシンプルに買い物を出来る造り。
まとめ
所属アーティストが多いので、写真をホバーした時だけでなく、アーティスト名が常時表示されているとわかりやすいかなと。もしくはサイドバーかナビゲーションにA-Zのindexを配置していてくれれば、目的のアーティストを見つけやすいかなと。
Shopページの充実具合とデザインがカッコよく見やすかった。カテゴリー毎の色分けなんかで視覚的に分かりやすいページ造りは今後の参考にしたいと思います。
コメント