2017年2月01日

デザイナー魂を刺激するコーポレートサイトを厳選

【2017年版】デザインの参考にしたい!オシャレなコーポレートサイトまとめ10選

【2017年版】デザインの参考にしたい!オシャレなコーポレートサイトまとめ10選

コーポレートサイトは企業の印象やブランドイメージに大きく影響するため、デザインにもこだわりを持って制作を行っている企業が多いです。
この記事では、数あるサイトの中から特にオシャレなコーポレートサイトを厳選し、注目点を解説します。

コーポレートサイトには現在のデザイントレンドが取り入れられている場合も多いので、自分でデザインを考える際の参考にもなるはずです。

※デザインは執筆時(2017年1月時点)のものなので、変更になる場合があります。

 


ライオン株式会社


http://www.lion.co.jp/ja/

洗剤、石鹸、歯磨き、トイレタリー用品などを販売するライオン株式会社のコーポレートサイトです。PCからアクセスするとまず目に飛び込んでくるのが自動再生される動画。

HTML5の<video>タグを使って自動で動画を再生しています。
製品を大きく映さず、日常生活の風景の中でさりげなく製品をアピールしているのがポイントです。

背景に動画を埋め込むデザインは現在のトレンドのひとつで、静止画よりも情報量が多く、印象も深まります。音声を自動再生すると音量や場所によっては迷惑になるので、動画を埋め込む場合はデフォルトの音声をオフにしておいた方が良いでしょう。


 


株式会社イーサイバー


http://www.e-cyber.co.jp/

Webアプリケーション事業を展開する株式会社イーサイバーのコーポレートサイトです。
こちらは画面いっぱいに動画を埋め込み、その上にロゴとメニューを配置しています。

このように全画面動画を取り入れるサイトが増えており、動画の上に大きめのテキストを配置することで印象が深まります。
(こちらのサイトは動画にテキストを配置しています)


 


UCC上島珈琲


http://www.ucc.co.jp/eng/

UCC上島珈琲の海外サイトです。

日本サイトとはデザインが大きく異なっていて、背景に動画を埋め込んだデザインとなっています。動画は言葉を超えて伝わるものがあるので、海外サイトに向いているかもしれません。

他にもソニーや任天堂など、日本向けと海外向けでサイトのデザインが異なっている企業は結構あります。有名企業が海外サイトをどのようにデザインしているのかチェックしてみるのも面白いと思います。


 


株式会社リスペクト ホーム


http://respect-pal.jp/

インターネットメディアサービスやマーケティング支援コンサルティング事業を展開する株式会社リスペクト ホームのコーポレートサイトです。
スクロールに合わせて画像が追従する「パララックス」を取り入れています。

「パララックス」は現在のデザイントレンドのひとつで、コンテンツに動きを持たせることで訪問者の興味を惹きつけます。

画像やテキストをうまくつなぎ合わせれば、ストーリー性のあるコンテンツ作りもできます。
コーポレートサイトなら会社の沿革や創業物語をパララックスで見せるのも面白いかもしれませんね。


 


グリーベンチャーズ株式会社


https://www.greeventures.com/

グリーベンチャーズ株式会社は、グリー株式会社を株主に持つ、インターネット・モバイル関連のスタートアップ企業に特化したベンチャーキャピタルです。

このコーポレートサイトのデザインのポイントは2つあります。
ひとつは全画面の背景画像です。

背景全体に画像を配置することで印象が高まります。

もうひとつは「ゴーストボタン」です。
ゴーストボタンは背景が透けて見えるボタンを指します。
ボタンであると気づかれにくいという欠点がありますが、他のデザインを邪魔しないというメリットがあります。

PC限定になりますが、マウスカーソルに追従して画像が波打つ仕掛けも施されています。


 


i.school


http://ischool.t.u-tokyo.ac.jp/

「東京大学知の構造化センター」主宰の教育プロジェクト、i.schoolの公式サイトです。
二分割した画面が印象的で、左右で配色を変えることでメリハリが生まれています。

気づかれにくいゴーストボタンに矢印を加えることで、ボタンであることを示す工夫もみられます。これなら機能性とデザインの両方を活かすことができそうです。


 


株式会社ユニメディア


http://unimedia.co.jp/

プロモーション事業・ソリューション事業を展開する株式会社ユニメディアのコーポレートサイトです。
背景画面を三分割し、自動で切り替わるようにしています。

スクロールするとロゴが小さくなり、ヘッダーのメニューがハンバーガーメニューに切り替わります。スクロール後は画面四隅にそれぞれロゴ、メニュー、検索、SNSのアイコンが配置されるようになっていて、画面を有効に使いながらデザイン性を高める工夫がみられます。


 


BEAMS JAPAN


http://www.beams.co.jp/beamsjapan/

衣料品・雑貨のブランド / セレクトショップ、BEAMS JAPANのコーポレートサイトです。

アイコンをメインにデザインされたオシャレなコーポレートサイトで、非常にインパクトがあります。コンテンツをB1階〜7階で表現するなどのユーモアも感じられます。

2016月9月にBEAMSの公式サイトがリニューアルされ、公式サイトとECサイトが統合されました。スタッフのブログを発信するなど、ECサイトにオウンドメディアとしての役割も持たせています。

BEAMS 公式サイト

http://www.beams.co.jp/


 


有限会社お茶の秋月園


http://www.akizukien.jp/

日本茶を製造・販売する有限会社お茶の秋月園のコーポレートサイトです。
線をほとんど使わず、画像とテキストで上手に区切りをつけています。

画像も非常に綺麗で、商品の魅力が伝わってきます。

オンラインショップのデザインも参考になります。
基本的にはコーポレートサイトと似たような構成ですが、商品の見せ方がとても上手です。

秋月園オンラインショップ

http://www.akizukien-shop.com/


 


株式会社ティー・エフコーポレーション


http://www.tf-corp.co.jp/

宮城県仙台市に本社を置く株式会社ティー・エフコーポレーションのコーポレートサイトです。
左メニュー固定、グリッドデザインが特徴で、画像と動画が目を引きます。

左メニュー固定を採用するサイトは密かに増えていて、上部に配置することの多いメニューを左側に固定することにより、ファーストビューでコンテンツに目がいきやすくなります。


 


まとめ

今回紹介したコーポレートサイトはそれぞれデザインにこだわりが見られ、企業やブランドにマッチしたサイトから、印象深いサイトまでさまざまです。

コーポレートサイトを手がけるかどうかに関わらず、是非、webデザインの参考にしてみてください。

役に立った/参考になったと思ったら、シェアをお願いします。

人気のスキルの求人・案件情報

レバテッククリエイター
おすすめコンテンツ

レバテッククリエイターはWeb・ゲーム業界に特化したデザイナー・クリエイター向けの求人・案件提案サービスです。