CATEGORY : レスポンシブ
-
映画『AMY エイミー』公式サイト
イギリス出身の女性歌手、エイミー・ワインハウスの生涯を描いたドキュメンタリー映画、『AMY エイミー』日本公式サイトのWEBデザインです。 左側にコンテンツを寄せて右側に大きく画像を表示したレイアウトが特徴で、図版率が高く華やかでダイナミックな印象のサイトです。...
-
Amy – Official Movie Site – In Theaters This July
イギリス出身の女性歌手、エイミー・ワインハウスの生涯を描いたドキュメンタリー映画、『AMY エイミー』オフィシャルサイトのWEBデザインです。 フルスクリーンで大胆に表示した動画をメインに使用したサイトに、ピンクをアクセントにした配色とスタイリッシュな文字組みが映えるデザインです。...
-
東洋化成株式会社 TOYOKASEI CO., LTD. / アナログレコードのプレスは東洋化成
アナログレコードの製造や各種印刷を行っている、東洋化成株式会社のコーポレートサイトのWEBデザインです。 モノトーンにネイビーをプラスした配色と画面幅いっぱいに表示した製造工程の画像がクールで、落ち着きや伝統も感じられるサイトです。...
-
レコードの日 オフィシャルサイト
日本のレコードプレスメーカー東洋化成主催のアナログレコードの祭典、レコードの日 オフィシャルサイトのWEBデザインです。 丸みのあるWEBフォントやマーカーを引いたような装飾と、並べられたカラフルな色彩のレコードジャケットがポップな印象を与えているサイトです。...
-
Beyoncé
テキサス州ヒューストン出身のシンガーソングライター/ダンサー/女優、Beyoncé（ビヨンセ）のオフィシャルサイトのWEBデザインです。 フルスクリーンで表示したアーティスト画像と、MUSICページ等で見られる横幅いっぱいのアイキャッチ画像がクールでダイナミックな印象のサイトです。...
-
AUTO-MOD official website
日本のロックバンド、AUTO-MOD（オートモッド）のオフィシャルサイトのWEBデザインです。 モノトーンを中心とした配色と、フルスクリーン表示したモノクロのアーティスト画像がダークで退廃的な雰囲気を演出したサイトです。 ...
-
Conditions Records
アメリカ/テキサス州オースティンのインディペンデント・レーベル、Conditions Records（コンディションズ・レコード）オフィシャルサイトのWEBデザインです。 モノトーン＋ビビッドなオレンジの配色とフラットデザインを組み合わせた、モダンですっきりとした印象のサイトです。 ホワイトとグレーの濃淡でヘッダーやコンテンツの区切りを表現していて、ボーダー等の無駄な装飾を削ぎ落したシンプルな...
-
Bösendorfer Japan – ベーゼンドルファー・ジャパン
オーストリアのピアノ製造会社、Bösendorfer（ベーゼンドルファー）の日本公式サイトのWEBデザインです。 モノトーン＋ゴールドの配色とエレガントなロゴ、「ウィーンの至宝」とも言われる美しいピアノの画像が高級感を感じさせるサイトです。 細いラインがスタイリッシュなアイコンを用いてサイトのデザイン性も損なわず、ピアノの特徴を視覚化しています。...
-
Ulrich Schnauss
ドイツ/キール出身のエレクトロニカミュージシャン、Ulrich Schnauss（ウルリッヒ・シュナウス）のオフィシャルサイトのWEBデザインです。 薄いグレーを基調にモノトーンで統一された配色と細めのフォント、余白を活かしたレイアウトが特徴のミニマルでクールなデザインのサイトです。 モノクロで並べられたリリース作品のジャケットがマウスオーバーで色付く仕掛けが素敵です。...
-
THE BACK HORN 20th ANNIVERSARY
東京で結成されたオルタナティヴ・ロックバンド、THE BACK HORN（ザ・バックホーン）の20th ANNIVERSARY特設サイトのWEBデザインです。 ブラック×ゴールドの配色と明朝体フォントを使用したエレガントなデザインに、グランジテイストのテクスチャーを合わせたサイトです。 ...
-
Sarah Brightman
イギリス出身のソプラノ歌手/女優、Sarah Brightman（サラ・ブライトマン）オフィシャルサイトのWEBデザインです。 フルスクリーン表示したアルバム「HYMN」のアートワークがサイトの世界観を構築した、ゴージャスでダイナミックなサイトです。 ローディング時のインパクトのあるアニメーションや、さりげなく取り入れたデュオトーン画像がアクセントになっています。...
-
La Dispute
アメリカ/ミシガン州出身のポスト・ハードコアバンド、La Dispute(ラ・ディスピュート)のオフィシャルサイトのWEBデザインです。 アルバム「Panorama」のアートワークをフルスクリーンで表示した、パステル調の淡く柔らかな色合いのサイトデザインです。 シンプルな構成のフラットデザインに、さりげなくグラデーションやパララックスも取り入れていて奥行きや広がりも感じさせています。...
-
QueenOnline.com – The Official Queen Website
イギリスのロックバンド、Queen（クイーン）のオフィシャルサイトのWEBデザインです。 ウインドウ幅いっぱいに表示されたスライダーとレンガ調のグリッドレイアウトで構成されたコンテンツへの誘導が特徴のサイトです。 モノトーンでスタイリッシュに配色されたサイトと画像の持つ色合いのコントラストがシャープですっきりとした印象を与えています。...
-
X JAPAN
日本のヴィジュアル系ロックバンド、X JAPAN（エックス・ジャパン）オフィシャルサイトのWEBデザインです。 ブラック×レッドのスタイリッシュな配色と、フルスクリーンで表示したアーティスト写真、グランジ調のテクスチャーが特徴のサイトです。 シングルカラムで構成されたレイアウトはコンテンツを際立たせていて、スクロールと連動して情報をひとつの文脈の中で伝えています。...
-
映画『WE ARE X』公式サイト Blu-ray DVD 12.13(wed) RELEASE
日本のロックバンドX JAPAN の軌跡に迫る音楽ドキュメンタリー映画、WE ARE X公式サイトのWEBデザインです。 ブルーとレッドを基調にしたキービジュアルをフルスクリーン表示、その上にロゴを大胆に表示したファーストビューが象徴的なサイトです。 GALLERYセクションではCSS3のtransformプロパティを使用して、マウスオーバー時に画像をズームさせてサイトに動きを与えています。...
-
Line 6 Japan
カリフォルニア州カラバサス市の音響機器・楽器メーカー、Line 6(ラインシックス)の日本サイトのデザインです。 フルスクリーン表示のスライダーや接写した製品画像の上に重ねたテキストがコンテンツへの誘導を担うサイトです。 ページやコンテンツに合わせて、グリッド/1カラム/2カラム/フルスクリーンとレイアウトを変えているのも特徴です。 製品の接続例をGIFアニメーションで動きを付けて紹介してい...
-
Zildjian （ジルジャン）｜ヤマハミュージックジャパン
400年の歴史をもつシンバルブランド、Zildjian （ジルジャン）の日本サイトのWEBデザインです。 モノトーン+レッドのスタイリッシュな配色と画面幅いっぱいに表示したスライダー、余白を感じさせる切り抜き画像が特徴のサイトです。 年表型のスライダーを使って表示したヒストリーベージのタイムラインがユニークです。...
-
Ringo Starr | Official Site
イギリス・リヴァプール出身のミュージシャン/シンガーソングライター、Ringo Starr（リンゴ・スター）オフィシャルサイトのWEBデザインです。 ホワイトと薄いグレーをベースにしたクリーンな配色と、画面幅いっぱいに使用した画像が特徴の、図版率の高いサイトです。 各ページごとに大きくキャッチ画像を表示しているのも特徴で、クローズアップした大胆な画像がシャープで切れ味のある印象を加えています。...
-
George Harrison – Official site with news, image gallery, links, discography of entire Harrison catalog, audio, video, and other media downloads.
イギリス・リヴァプール出身のミュージシャン/シンガーソングライター、George Harrison（ジョージ・ハリスン）オフィシャルサイトのWEBデザインです。 ホワイト・グレーベースにグリーンをアクセントとした配色と、ベーシックなレイアウトに映える手書き風フォントを使用したロゴが特徴のサイトです。 背景にパターン画像を繰り返し表示しているのも特徴で、インド哲学に魅了され続けた音楽性を表現して...
-
Official Paul McCartney: Tours, Music, Media & Community
イギリス・リヴァプール出身のミュージシャン/シンガーソングライター、Paul McCartney（ポール・マッカートニー）オフィシャルサイトのWEBデザインです。 ブラックをベースに彩度の高いアクセントカラーを加えた配色と、2カラム/グリッドレイアウトで構成されたサイトです。 テキストでさりげなくマスクしたロゴを用いていて、サイトを鮮やかに彩るアクセントとなっています。...
-
John Lennon – Official Website
イギリス・リヴァプール出身のミュージシャン/シンガーソングライター、John Lennon（ジョン・レノン）オフィシャルサイトのWEBデザインです。 ホワイトとグレーの濃淡にスカイブルーを加えた爽やかな配色と余白をたっぷりと取ったレイアウト、ダイナミックなスライダーが特徴のサイトです。 タイトルや見出しにウエイトのあるゴシック体のフォントを使用していて、本文との対比がポップで躍動感を与えていま...
-
The Beatles
イギリス・リヴァプール出身のロックバンド、The Beatles（ザ・ビートルズ）オフィシャルサイトのWEBデザインです。 MONO BOXのジャケットをモチーフとしたホワイト+グリーンの配色と、フルスクリーンで表示したダイナミズム溢れるスライダーが特徴のサイトです。 フラットデザインをベースにしながらもヘッダーやカード型コンポーネントに薄くシャドウを加えて、さりげない立体感を持たせています。...
-
オンナばかりのBIGBAND「たをやめオルケスタ」OFFICIAL WEBSITE
女性18人編成のトロピカルビッグバンド、たをやめオルケスタのオフィシャルサイトのWEBデザインです。 黒背景に映える赤い照明と衣装のステージ画像をフルスクリーンで表示した、モダンとレトロ感が共存したデザインです。 デザインフォントを使用したロゴやさりげないイラスト・アイコンが、サイトに柔らかさや親しみを与えています。 アルバムの特設ページは一転して白背景で、手書き文字を用いたポップでカラフル...
-
東京都目黒区・音楽著作権エージェント【 リトルスター・コピーライトマネージメント 】
東京都目黒区の音楽著作権エージェント、リトルスター・コピーライトマネージメントのWEBデザインです。 和を前面に打ち出した写真やパターン画像と、ほっこりとする猫のイラストを多用したサイトです。 斜めの要素や菱形、縦に貫く色帯を敷いたりと、和風のデザインの中にシャープさやスタイリッシュ感も取り入れたデザインです。...
-
スペースシャワー列伝
音楽チャンネル/スペースシャワーTV主催の新人アーティストイベント、スペースシャワー列伝のWEBデザインです。 ミントグリーンと生成り色の柔らかな雰囲気を与える配色と、左側にナビゲーションを固定したレイアウトが特徴のサイトです。 各コンテンツへの誘導を横長の矩形バナー風の一覧表示にすることで、ファーストビューで多くの情報を見せつつ分かりやすく整理しています。...
-
Perfume Global Lab
広島出身の女性3人組テクノポップユニット、Perfume（パフューム）Global LabのWEBデザインです。 ロゴ・テキスト・画像までをモノトーンで統一した配色と、細めのボーダーを使用したクールでスタイリッシュなサイトです。 グリッドレイアウトを使用していますが、コンテンツ量に合わせて左右でずれていくのも動きや遊び心が感じられます。...
-
Kelly Clarkson – The Official Dot Com – Welcome
アメリカ/テキサス州出身の女性シンガー、Kelly Clarkson（ケリー・クラークソン）オフィシャルサイトのWEBデザインです。 ブラック×ゴールドの配色とセリフ体のフォントを使用した、エレガントでクラシカルな印象を与えているサイトです。 下層ページではグリッド状のコンテンツが縦横無尽に動くユニークな構成で、画像とテキストを交互にレイアウトしてメリハリを付けています。...
-
Maison book girl major 1st album “image” 特設サイト
日本の4人組アイドルグループ、Maison book girl（メゾンブックガール）の1st album「image」特設サイトのWEBデザインです。 VRを意識したかのような視界を変化させていく動画をフルスクリーンで表示、その上にテキストをセンター配置したシャープでダイナミックなサイトです。 無機質でクールな印象の世界観と配色も特徴で、統一されたコンセプトと色彩でデザインをまとめ上げています...
-
Maison book girl new single “elude” 特設サイト
日本の4人組アイドルグループ、Maison book girl（メゾンブックガール）のシングル「elude」特設サイトのWEBデザインです。 シングルのアートワークをモチーフとした、ぐにゃぐにゃとアニメーションする絵具のようなビジュアルが特徴のサイトです。 モノトーン中心の配色と大胆な見出し、斜めの要素でコンテンツごとをシャープに区切ったクールで無機質な雰囲気が印象的なデザインです。...
-
UNISON SQUARE GARDEN TOUR 2018「MODE MOOD MODE」
東京都出身のロックバンド、UNISON SQUARE GARDENのTOUR 2018「MODE MOOD MODE」スペシャルサイトのWEBデザインです。 ゴールドとブラックで色分けされたスプリットスクリーンレイアウトから2つのコンテンツページへ遷移するのが特徴的なサイトです。 「MODE MODE MODE」ページはモノトーン+ピンクの配色と斜めの要素を組み合わせたスタイリッシュなデザイン...
-
Blondie – Official Website
アメリカ/ニューヨーク出身の女性ボーカルロックバンド、Blondie（ブロンディ）オフィシャルサイトのWEBデザインです。 黒背景をベースにしたモノトーン+レッドの配色と、モノクロの画像の対比がスタイリッシュながらレトロ感も併せ持つサイトです。 アルバム「POLLINATOR」のアートワークを模したような赤い三角の要素をサイト内に散りばめ、よりシャープで個性的な印象を与えています。...
-
Kei Owada, Singar Songwriter Official Site | 大和田慧オフィシャルサイト
東京出身の女性シンガーソングライター、大和田慧（おおわだ けい）さんのオフィシャルサイトのWEBデザインです。 ホワイトと薄いブルーを基調とした配色と、海をバックに撮影した画像をフルスクリーン表示した清涼感のあるサイトです。 右側にあるグローバルナビゲーションが、スクロールに合わせて上部固定に変化するのも特徴です。 事務的ではなく、デザイン性を持たせたメールフォームも素敵です。...
-
JINBAO JAPAN 楽器オンラインショップ
中国の楽器メーカー、JINBAO（ジンバオ）の日本公式サイトのWEBデザインです。 ホワイトとゴールドを基調とした配色と薄く敷いたパターン画像、明朝体のフォントがエレガントでクラシカルな印象を与えています。 左側にグローバルナビゲーションを固定し、残りのウインドウ幅いっぱいにコンテンツを配したレイアウトは縦幅も大きくダイナミックです。...
-
The Who – Official Site of The Who, Pete Townshend and Roger Daltrey.
イギリスのロックバンド、The Who（ザ・フー）のオフィシャルサイトのWEBデザインです。 高彩度のカラフルな配色と画面幅をいっぱいに使ったスライダーやレイアウトが特徴のサイトです。 図版率が高いのも特徴で、モノクロやデュオトーン画像を大胆に取り入れてレトロ感も演出しながら強く印象付けています。...
-
TWICE OFFICIAL SITE
韓国・日本・台湾人からなる多国籍の女性9人組アイドルグループ、TWICE (トゥワイス）の日本オフィシャルサイトのWEBデザインです。 フルスクリーン表示した動画を効果的に使ったTOPページと、色数を抑えた配色とたっぷりと取った余白がシンプルで上品な印象の下層ページで構成されています。 ページ読み込み時のローディング画面が全面グラデーション+ロゴのアニメーションとなっていて、離脱率を抑えながら...
-
:: TWICE ::
韓国・日本・台湾人からなる多国籍の女性9人組アイドルグループ、TWICE (トゥワイス）の韓国オフィシャルサイトのWEBデザインです。 ミニアルバム「YES or YES」のアートワークをモチーフとしたTOPページと、シンプルでクリーンな印象の下層ページから構成されたサイトです。 モノトーン+レッドのスタイリッシュな配色と、中央を縦方向に貫く色帯が上下方向への空間の広がりを印象付けています。...
-
TAICOCLUB’18
2006年より長野県木曽郡木祖村のこだまの森で開催されている野外音楽フェスティバル、TAICOCLUB (タイコクラブ)オフィシャルサイトのWEBデザインです。 ゆるいテイストのイラストと見出しフォント、セクションごとに色分けされたカラフルな配色が特徴のサイトです。 スクロールに合わせてさりげない表示エフェクトを加えていて、イラスト＋アニメーションでワクワク感を演出しています。...
-
ATATA『JOY』Release Tour 2016 -WE ARE ATATA ARMY!!! IN JAPAN!!!-
新代田発FEVER系6人組バンド、ATATAのミニアルバム「JOY」特設サイトのWEBデザインです。 アルバムのアートワークをモチーフとしたフェイスペイントの画像とアニメーション、3つにスプリットされたユニークなレイアウトが特徴のサイトです。 縦スクロールの中に斜めの要素を加えたり、左右ジグザグの配置で躍動感や流れを与えているポップでエネルギッシュなデザインです。...
-
ParaFes 2018 ～UNLOCK YOURSELF～ 11/23@武蔵野の森
日本財団パラリンピックサポートセンターが開催するライブエンターテインメント、ParaFes 2018（パラフェス）オフィシャルサイトのWEBデザインです。 大胆なタイポグラフィーと、彩度の高い配色がスポーツの爽やかさやアクティブ感を表現した鮮やかなサイトです。 整然としたグリッドレイアウトで構成されている中にずらして重ねたラベルや、斜めになった背景画像が遊び心やシャープでソリッドな印象を加えて...
-
Bruce Springsteen
アメリカ/ニュージャージー州出身のシンガーソングライター、Bruce Springsteen（ブルース・スプリングスティーン）のオフィシャルサイトのWEBデザインです。 モノトーン中心の配色と、趣きのある画像や質感のあるグランジ風ロゴがレトロでノスタルジックな雰囲気を感じさせるデザインです。 TOPページが記事のタイムラインのようになっていて、Pinterestに見られるようなレンガ調のレイア...
