センスが溢れているWebサイト

今回は、私のおすすめのサイトを紹介したいと思います。

Tempalay

私が好きなバンド「Tempalay」の公式HPです。

こちらはトップページです。ぱっと見、黒や白などのモノトーンでまとめられていておしゃれですね。ヘッダーにはメニューバーとトップページに飛べるロゴ、スピーカー、謎のゾーンがありますね。


このサイトには主に5つの変わったポイントがあります。

①音が鳴る

②おしゃれなディスコグラフィー

③スコープ

④デザイン

⑤動き

①音が出る

このサイトは音が出ます。ギターの弦を触ったかのように音が鳴る部分は、このバンド特有のサイケデリック・ロック、ノイズポップが表現されており、バンドの雰囲気が音として表現されています。

4つ点灯すると和音が聞こえる部分も遊び心があって、ゲーム感覚で触る面白い部分ですね。

②おしゃれなディスコグラフィー

ディスコグラフィーとは、作曲家・演奏家・ジャンルごとなどにレコードや音楽CDをまとめ、その録音年月日などの諸データを載せたものです。ぱっと見サイト内ではどこに書いてあるのか分かりにくいかもしれませんが、②の部分になります。サムネが最新のアルバムやシングルのグレーバージョンになっており、マウスポインタが触れると元サムネの色になります。

サムネをクリックすると、ディスコグラフィーの一覧に飛ぶことができます。トップページとはメインカラーが変わりますが、シンプルでおしゃれですね。別ページに飛ぶと、そのページのメインカラーに合わせて、ヘッターの音量マークの隣のスペースの色が変わります。遊び心が満載です。

③スコープ

この見出しを見ただけではピンとこないかもしれませんが、四角いスコープがマウスに反応して写真が見える位置が変わります。まるでスコープみたいだな、と思いました。

④デザイン

この部分は特にどこかのページに飛べるわけでは無いので意味はありませんが、このモヤモヤとした画像がバンドの雰囲気を出していてとても気に入っています。マウスポイントに反応して色が変わります。

情報だけを載せるのではなく、全体の雰囲気を伝えるためのデザインは参考にしたいです。

⑤動き


この動画の部分は、ひたすらにバンド名が打ち込まれていく動きです。特に意味はない部分ですが、繰り返し打ち込まれる文字に少し狂気を感じませんか?雰囲気が出ていてとてもいいと思いました。

このサイトたくさん動きがあるので、実際に見てみてください!

最後に

このサイトは他にもギミックがたくさんあります。(別ページに飛ぶとアイキャッチが挟まれるなど…)
たくさんあるので、ぜひサイトを見てみてください。(ぜひ曲も聞いてみてください!)

サイトURL:https://tempalay.jp/