背景全体にイメージ写真を使ったサイトを、最近見かけるようになりました。
利用されているジャンル、業種はさまざまで、商品やプロジェクト、ウェブサービス、メンバーなどの紹介から、企業用公式サイトとして利用されているケースもあるようです。ユーザーにより効果的に、コンテンツを魅せることができ、ビジュアル的なインパクトあります。
海外デザインブログSplashnology.comで、クリエイティブな色使いとアイデアが詰まった、ウェブデザイン35個をまとめたエントリー「35 Websites with Full Size Photo Backgrounds」が公開されていたので、今回はご紹介します。
パララックスエフェクトなどの仕掛けや、アニメーションなどが実装されているサイトが多く、いつもと違ったワクワク感を演出してくれます。
詳細は以下から。
ビジュアルをたのしむ、フルスクリーン写真を使ったウェブサイトまとめ
アパレルブランドの公式サイトで、シーズンごとの商品をまとめたルックブックなども一緒に公開されており、矢印キーでの操作が可能。
音楽事務所の公式サイトで、さすが迫力のあるイメージ写真を利用した、視覚的にもたのしいウェブサイト。
トップページでは、キーボード操作によるビートボックスを楽しむことができ、クールなグラフィックデザインを多用した、パララックスエフェクトも目玉。
映画を得意としたデザイン事務所で、圧倒的なグラフィック写真の美しさを表現したウェブサイト。
ぼかしエフェクトを加えた、フルスクリーン写真と、縦長なフォントの組み合わせがオシャレなWebサイト。
アメリカで活動するバンドの、イベント情報やギャラリーなどを、まとめた公式サイトで、ぼんやりと浮かびあがるヘッダーは、タイトルともあっています。
フランスにある、味わい深いレストランの公式サイト。レストランの営業時間やメニューなど、飲食店向けデザイントレンドを盛り込んだ内容となっています。
フルスクリーン写真を使った、企業サイト制作時の参考になりそうな、動きなどの見た目だけでなく、必要記載事項をすっきりまとめたデザイン。
快適なライフスタイルを求める新感覚メディアサイトのひとつで、コンテンツごとの境目に、ぼかしエフェクトを加えた、ユニークなレイアウトが◎。
パーカーを着たチンパンジーの周りに、飛び散った煙草が、スクロールと一緒に変化する、ユニークな仕掛けが素敵。
Range Rover Evoque Special Edtion with Victoria Beckham
車の紹介ページで、スクロールするごとにコンテンツが切り替わる、パララックスエフェクトを用いたサイト。
見出しタイトル文と、ピクトグラムアイコンのみレイアウトされた、フルスクリーン写真を最大限に活かしたデザインサイト。
シングルページ完結型レイアウトで、コンテンツごとに背景イメージを切り替えることで、ユーザーは視覚的にたのしむことができます。
背景で動画を流しながら、必要なコンテンツを半透明ポップアップで表示する、ユニークなレイアウト。
ニューヨークにあるメディア事務所で、これまでの制作実績を、フルスクリーンスライドで紹介しています。
コンテンツ切り替え用サムネイルに、動画を利用したりと、ユニークな仕掛けが満載の、ダイナミックなウェブサイト。
ニット帽など製作、販売しているアパレルブランドで、作業風景をモノクロ写真で納め、トップ画像として利用。
手作りパスタを販売しているショッピングサイトで、モノクロカラーをテーマにした、落ち着いた印象を与えてくれます。
ひとりの料理家の生い立ちなどを書き記した、自伝的ウェブサイト。ポートフォリオサイトのアイデアにも良いかもしれません。
画面中央のロゴ全体が、ナビゲーションメニューとなっており、コンテンツが自動的に切り替わるエフェクトが実装。
バッグにも、ピクニットシートにもなるアイデア商品の紹介、販売を行っているウェブサイト。
余白スペースをたっぷり使い、グリッドレイアウトで整列された、はじめてのユーザーにも分かりやすいレイアウトが魅力的。
デザインカンファレンスの告知ページとなっており、コンテンツごとに色分けした、分かりやすさも考慮したサイトデザイン。
自分だけの作品集、ポートフォリオに使えるWordPressテンプレート30個まとめ
WordPressテンプレートは、シンプルにサイト制作を進めることができます。テーマ素材の利用も、考えてみてはいかがでしょう。
サムネイル@ : VLNC Collective – Idea Makers
参照元リンク : 35 Websites with Full Size Backgrounds – Splashnology.com
