Blue Monkey
TOP > コラム > 大阪のおしゃれなWebデザインの企業サイトまとめ【25選】

大阪のおしゃれなWebデザインの企業サイトまとめ【25選】

  • LINEで送る
  • このエントリーをはてなブックマークに追加

東京と並んで日本を代表する都市、大阪。世界的にも著名な企業を多数擁し、言わずと知れた経済・文化の中心的な存在です。

この記事ではそんな大阪に拠点を持つ企業のおしゃれなWebデザイン25例を、Webサイトの目的別に紹介します。

BtoC向けサイト

サントリーホールディングス株式会社(Suntory Holdings Limited)

https://www.suntory.co.jp/

サントリーホールディングス株式会社(Suntory Holdings Limited)

トップページを開くと、スポーツ・レジャー・教育などあらゆる場面でサントリーの飲料を飲む世界各国の人々の動画がスライドし、同社の事業の広がりを感じさせます。目玉商品の切り抜き写真もインパクト大。トップページ下には人気タレントが登場するCM・動画ギャラリーがあり、思わずクリックしたくなるデザインです。

日清食品ホールディングス株式会社

https://www.nissin.com/jp/

日清食品ホールディングス株式会社

インスタントラーメンで著名な日清のWebサイト。トップページではインスタントラーメンを食べようとする男性の前に現れた侍が、「SAMURAI NOODLES」という毛筆のロゴを斬るという躍動感あるアニメーションがフルスクリーンで流れます。インスタントラーメン開発コラムや年表は教科書風に図表化されていて訪れる人を楽しませてくれます。

マンダム株式会社

https://www.mandom.co.jp/

マンダム株式会社

化粧品メーカー・マンダムのWebサイト。人気タレントを起用したテレビCMのスチール写真が画面いっぱいにスライドする華やかでキャッチーなデザインです。白とスカイブルーをベースにした清潔感あふれる色調が研究開発情報やブランディングなどの取り組みに信頼感を添えています。

江崎グリコ株式会社

https://www.glico.com/jp/

江崎グリコ株式会社

ブランドロゴカラーの鮮やかな赤が目を惹くグリコのWebサイト。ページを開くとトップページ下に急いで走ってくる真っ赤な「グリコワゴン」がさまざまなコンテンツへの案内人になっています。「工場見学・体験スポット」のコーナーには「グリコサイン」のランナーの姿も。キッズやファミリー層好みの内容が充実し、ほのぼの感のあるデザインです。

株式会社シマノ(SHIMANO INC.)

https://www.shimano.com/jp/index.html

株式会社シマノ(SHIMANO INC.)

自転車部品や釣具の開発・製造を行うシマノのWebサイトは、サイクリングを楽しむ人たちの躍動感あふれる写真を随所に配したスポーティーなデザインです。製品のアップ写真は黒の背景で引き立て、コバルトブルーのユニフォームに身を包んだ社員の姿も爽やかで印象に残ります。

ロート製薬株式会社(ROHTO Pharmaceutical Co., Ltd.)

https://www.rohto.co.jp

ロート製薬株式会社(ROHTO Pharmaceutical Co., Ltd.)

ページを開くと中央に「NEVER SAY NEVER」のメッセージ。その背景にはロートの製品とともに世界中の人と健康をテーマにした写真の数々が流れます。「健康」への熱いメッセージに導かれ、食事業・再生医療事業などロートの挑戦についてもっと知りたくなるような活気あるデザインです。

BtoB向けサイト

株式会社クボタ

https://www.kubota.co.jp/

株式会社クボタ

トップページの「Beyond 130」(130周年サイトへ)というメッセージが目を引くクボタのWebサイト。水や地球を連想させる深いマリンブルーや澄んだスカイブルーが効果的に使われ、水面に映る人影の写真が幻想的な雰囲気を醸しています。グローバルな事業展開や環境への取り組みなどスケールの大きさを感じさせるデザインです。

日東電工株式会社

https://www.nitto.com/jp/ja/

日東電工株式会社

両面テープやスマホの画面保護フィルムから半導体関連製品まで幅広く展開する「Nitto」のWebサイト。ブランドロゴの鮮やかなコバルトブルーを中心に、半透明の色彩を重ねたデザインが美しく、製品のイメージと重なります。イメージ動画や手描き風文字も活用され、どんどん読み進めてしまうような動きのあるデザインです。

積水化学工業株式会社(SEKISUI CHEMICAL CO., LTD.)

https://www.sekisui.co.jp/

積水化学工業株式会社(SEKISUI CHEMICAL CO., LTD.)

大阪に本社を構える積水化学のWebサイト。トップページには近未来都市やコンセプトカーのイメージ画像が大きく広がり、想像力をかきたてられます。住宅をはじめとした幅広い事業領域や新着情報が写真で紹介され、等間隔で並べられたコンテンツギャラリーも親しみやすく、見やすいです。

帝人株式会社(TEIJIN LIMITED)

https://www.teijin.co.jp/

帝人株式会社(TEIJIN LIMITED)

大阪と東京に本社を構える帝人のWebサイトはイメージよりも実情報を前面に押し出すシンプルなデザインです。トップページ下部には人気若手女優を起用したプロモーション用コンテンツなどのバナーがあり、シンプルな中にブランドロゴカラーの鮮やかな赤が映えてフレッシュな雰囲気を出しています。

丸一鋼管株式会社

https://www.maruichikokan.co.jp/

丸一鋼管株式会社

丸一鋼管株式会社のWebサイトはトップページ上の「MARUISHI」のブランドロゴが目に留まり、メインスペースに爽やかな空色が広がります。鋼管やクレーン車、工場の俯瞰写真と青空や地球のイメージがオーバーラップし、グローバルな事業の広がりとともにあたたかみを感じさせるデザインです。

株式会社カネカ(KANEKA CORPORATION)

https://www.kaneka.co.jp/

株式会社カネカ(KANEKA CORPORATION)

カネカのトップページは女性タレントが登場するプロモーションコンテンツが充実し、リッチな印象。「トピックス」のタイトルにはオレンジ、グリーンなどのビタミンカラー、「コンテンツ」の背景色にはピンク、ラベンダーなどのパステルカラーを用い、全体的に明るくソフトなテイストです。

メディアサイト

ONCOLOGY(オノ オンコロジー/小野薬品工業株式会社)

https://p.ono-oncology.jp/

ONCOLOGY(オノ オンコロジー/小野薬品工業株式会社)

トップに「あなたと一緒に、がんと向き合う。」のキャッチコピーとわかりやすい目次があり、Webサイトのコンセプトがひと目でわかるデザインです。淡いグリーン、オレンジ、ブルーの水彩タッチのイラストとアイコン、同じく水彩タッチのラインづかいが効果的で「病気」というテーマの重たさを感じさせないあたたかみのあるデザインです。

anna(アンナ)

https://anna-media.jp/

anna(アンナ)

「関西をもっと楽しむライフスタイルマガジン・anna(アンナ)」のWebサイト。トップページに広がる旅の写真は敢えて彩度を抑えた大人っぽい雰囲気です。ギャラリーはシンプルで見やすく、グルメからビューティーまでそれぞれ写真が充実しています。洗練されたライフスタイルを求める女性に好まれそうなデザインです。

マイフェバ

https://www.my-fav.jp/kansai/

マイフェバ

関西のお出かけ・観光情報マガジン「マイフェバ」のWebサイト。旅やグルメを紹介する個性的なコンテンツにオリジナリティーあふれる飾り文字が添えられ、思わずあれこれとクリックしたくなるデザインです。アプリ版への導線はトップページ下にまとめられ、Web版を邪魔することなく見やすいです。

OSAKA INFO(大阪観光局公式サイト)

https://osaka-info.jp/

OSAKA INFO(大阪観光局公式サイト)

トップページの中央にブランドロゴを配し、続くコンテンツギャラリーも中央で2カラムに。検索窓も中央配置で初めての人にも使いやすい設計です。「OSAKA INFO」のロゴデザイン同様、全体的にシンプルで明快、メリハリの効いたデザインは大阪の街そのもののイメージにも重なります。

eoグルメ

https://eonet.jp/gourmet/

eoグルメ

関西を中心に話題のグルメ情報を発信するWebサイト。コンテンツギャラリーのグルメ写真にはくっきりとしたブロック体のタイトルが付けられ、ニュース記事サイト風の活気のあるデザインです。なかでも目玉の旅行情報に注目が集まるよう、立体文字を使うなどタイトルデザインに工夫が凝らされています。

採用サイト

伊藤忠商事株式会社

http://career.itochu.co.jp/student/#Top

伊藤忠商事株式会社

トップページを開くと淡い空色のキャンバスを真っ青にペインティングしていく動画が始まります。「採用にこめる想い」ではモノクロのイメージ写真にブランドロゴカラーのコバルトブルーがさりげなく重ねられ、自分のカラーと伊藤忠のカラーを重ねあわせて新しい世界を作っていくというイメージが広がるデザインです。

シャープ株式会社(Sharp Corporation)

https://corporate.jp.sharp/recruit/

シャープ株式会社(Sharp Corporation)

トップページを開くとユーモラスなポーズをとったロボットがお出迎え。シャープの採用サイトは赤をポイントに黄色、ピンクなど暖色系の色を中心とした色合いで親しみを感じさせます。「シャープの仕事」「技術情報」などのコンテンツは縦一列に配置され、概要を把握しやすい設計です。

コクヨ株式会社

https://www.kokuyo.co.jp/com/recruit/shinsotsu/

コクヨ株式会社

トップページはモノトーン調の写真をフルスクリーンで見せ、クールな印象。スクロールしていくと社員の写真やメッセージが表示され、「コクヨという舞台」「人と仕事」などのカテゴリをドラッグするとコンテンツや写真が表示されます。「コクヨ=文具メーカー」という固定イメージにとどまらず新たなイメージが広がるデザインです。

カプコン株式会社

http://www.capcom.co.jp/recruit/index.html

カプコン株式会社

ゲームメーカー・カプコンの採用サイトはトップを開くとゲームキャラクターの画像が次々と登場し、きらめくメッセージに圧倒されます。スクロールするごとに幾何学的デザインの背景が現れては消え、コンテンツギャラリーが表示されます。同社のゲームの世界観を想起させる、動きのあるデザインです。

株式会社キーエンス

https://www.keyence-jobs.jp/

株式会社キーエンス

測定器や画像処理機器などの開発・製造をグローバルに展開するキーエンスの採用サイト。トップページは淡いブルーの背景に応募者へのメッセージを載せたシンプルなデザインで始まります。フルスクリーン画像や2カラム・3カラムのレイアウトが効果的に使われ、一見淡々としているようでインパクトのあるデザインです。

住友電気工業株式会社

https://sei.co.jp/career/fresh/

住友電気工業株式会社

住友電気工業の採用トップはロゴマークの家紋を思わせるひし形が目印。採用サイトと企業サイトへのリンクが並列に配置されていて行き来しやすく、「MENU」を開くと「STEP毎に読み進めていく事で理解度がより深まります」という吹き出しが現れます。応募者が知りたいことをつぶさに知り、全体像をつかみやすい親切な設計です。

ランディングページ(LP)

バンタンゲームアカデミー

https://www.vantan-game.com/cmp/voice03/search/

バンタンゲームアカデミー

大阪と東京に校舎を持つゲームの専門学校、バンタンゲームアカデミーが声優志望の学生に向けて学校案内を発信するランディングページ。モバイルで見られることを意識したシングルカラムレイアウトになっています。丸みのあるフォント、明るい色調、人物写真を大きく取り入れるなど親しみやすいデザインで訴求ポイントも明快です。

ALLAGI株式会社

https://www.taniue.jp/campaign/

ALLAGI株式会社

不動産事業のALLAGI株式会社が展開する注文住宅・一戸建てブランド「STYLE HOUSE」のランディングページ。「来場予約キャンペーン」のページは鮮やかなオレンジ色をポイントにした明るい雰囲気で、利用者のメリットや同社の営業姿勢などを明示することで信頼感や安心感につなげるデザインです。「家づくりの流れ」「施工事例」などのコンテンツがトップに等間隔で配置され、初めての利用者でも見やすい設計です。

まとめ

ここでは大阪の企業のおしゃれなWebデザインを25例紹介しました。
大阪の活気ある街のイメージそのままに、明快でキャッチーなデザインが目立ちます。また、すでに世界的に著名な企業は、既存のイメージを強化するデザインを採用する場面と、新たなブランドイメージを生み出すために意外性のあるデザインを採用する場面とを使い分けていることがわかります。
自社の理念やサービスに合ったWebデザインを見つける際にぜひ参考にしてみてください。

  • LINEで送る
  • このエントリーをはてなブックマークに追加

お問い合わせ・

ご相談窓口

CMSに関するお問い合わせ・お見積り等、
お気軽にご連絡ください。

お電話からのお問い合わせ

03-5339-2678

【受付】平日10:00〜12:00/
13:00~17:30