このページの本文へ

ここから本文

  1. Home
  2. ITトピックス
  3. モバイル&SNS時代における企業ウェブサイトのあり方と最新のデザイントレンド
  4. 最新のトレンドを取り入れたユーザーオリエンテッドなウェブサイト構築のポイント

最新のトレンドを取り入れたユーザーオリエンテッドなウェブサイト構築のポイント

2018年12月|SPECIAL FOCUS

2018年3月に三菱電機は新しいデザインのグローバルウェブサイト(GWS)をリリースしました。GWS(www.MitsubishiElectric.com)は、今後、各国のコーポレートサイトのデザインやコンテンツのマスターとなる役割を果たします。これにより一貫したブランドイメージの構築と、高いレベルでのユーザーオリエンテッドな情報発信が可能になりました。GWSのリニューアルについて、プロジェクトを主導した宣伝部ウェブサイト統括センターの粕谷俊彦氏に伺いました。

三菱電機株式会社
宣伝部 ウェブサイト統括センター 専任
粕谷 俊彦 氏

広告会社でのコピーライター経験を経て三菱電機に入社。1990年代はパソコンや携帯の宣伝担当として、広告・カタログ・イベントなど製品プロモーション全般に携わる。2001年から公式サイト運営部門にて、様々なコンテンツやサービスの開発を進めてきた。2009年12月には独自開発したウェブサイトを冊子化する機能によって「第3回 企業ウェブグランプリ」でベストグランプリを受賞。直近は海外向けのサイト開発を主な業務としており、社外の専門家を集めたUX(User Experience)チームを率いて、ユーザーフレンドリーな情報発信プラットフォーム構築を推進している。

三菱電機株式会社

グローバル企業にふさわしいウェブサイトに進化

宣伝部ウェブサイト統括センターは、三菱電機の公式ウェブサイトを運営しています。2001年からこの部署に所属した粕谷氏は、様々な新規サイトの立ち上げやFacebookページの開設を行ったほか、FA(Factory Automation)サイトのリニューアルなど大規模プロジェクトに携わってきました。

2018年3月に新デザインで公開された三菱電機のグローバルウェブサイト(GWS)のリニューアルの背景について、粕谷氏は次のように説明します。

「先進的なグローバル企業のウェブサイトは、国や地域が異なってもデザインに一貫性があり、ドメインなどは統合されるなど体系的に作られています。一方、従来の三菱電機ウェブサイトは、各国間でデザインが完全には統一されておらず、情報発信も個別に行われている状態でした。企業が洗練されたイメージを構築し競合と差別化を図るには、ウェブサイトは非常に重要です。そこで、世界のトップと称されるウェブサイトを目標としてリニューアルのプロジェクトを立ち上げました」

ウェブサイト統括センターでは、2014年から三菱電機のウェブサイトを世界規模で統合するプロジェクトを進めています。第一フェーズでは、各国で企業情報を発信するコーポレートサイトを統一されたデザインで構築。現在までに構築されたサイト数は31か国1地域、23言語、51サイトに及びます。

GWSのリニューアルは、各コーポレートサイトの情報発信をコンテンツとデザインの両面から強化するものです。GWSは、各国のコーポレートサイトへの送客を行うだけでなく、コンテンツやデザインの基盤を供給するマスターサイトとして機能します。本格稼働後には、まずGWSに英語で掲載された内容が翻訳され、同じデザインで各国のコーポレートサイトに掲載されるようになります。

最新のトレンドを取り入れ
直感的なウェブデザインを採用

GWSの新しいデザインを旧デザインと比べると違いは明白です。新デザインでは、従来は目次のテキストが並んでいた上位階層でも、ビジュアルを多用し、大きな文字やインフォグラフィック(情報、データ、知識を視覚的に表現したもの)を使用した、直感的に分かりやすいサマリー型の構成になっています。また、記事部分はワンカラム+シングルページのレイアウトになっており、ユーザーはスクロールしていくだけで、途切れることなくスムーズに読むことができます。

「デザインのリニューアルに当たっては、アクセスログの解析や海外でのオンラインアンケート調査、世界的なデザイントレンドを考慮して、指針を定めました。スマートフォンでの使いやすさを重視すること。文章を読むのではなく感覚的に分かるように写真やビジュアルを大きく使う。アピールしたい情報は動画コンテンツを活用する。内容を象徴する数値や図などは大きく強調し、情報にメリハリをつける。直感的に理解を促進するようなタイポグラフィやアイコンを活用する。これら5つを実現すべき要素としました」(粕谷氏)

モバイルユーザーの多い海外向けサイトのマスターとなるGWSのため、デザインにおいてもスマートフォン対応を重視しました。表示するデバイスの画面サイズに合わせて自動的にレイアウトが変わるレスポンシブデザインの採用により、スマートフォン、タブレット、PCと様々なデバイスでアクセスしても最適なレイアウトで表示されます。

GWS のデザイン

モバイルファーストデザインやタイルパーツの共通化などでデバイスが違っていてもおなじブランドイメージを提供している。

ユーザー志向とデータドリブン※は表裏一体

リニューアルに当たっては、まずGWSの役割の再定義や既存サイトのデータの棚卸しを行うなど、ウェブサイトの基本的な項目から綿密な検討が行われました。旧サイトの課題や新デザインや内容を検討する際には、ログデータやアンケートを分析し、PDCAを回して改善を続けるデータドリブンなアプローチが繰り返されました。

「ウェブサイト訪問者が求める情報を提供するユーザーオリエンテッドとデータドリブンは表裏一体の関係にあります。ユーザーオリエンテッドなサイトにするためにはデータドリブンでやる必要がありますし、データドリブンにすることによってユーザーオリエンテッドなものができます」(粕谷氏)

また、データドリブンのアプローチのポイントについて粕谷氏は説明します。

「ログデータやアンケートの結果を定量的に把握することは大事ですが、それ以上に重要なのが課題の発見です。データから課題を見つけて、そこから仮説を立ててプロトタイプを作り、それを再びデータで検証していきます。最近注目されているデザインシンキングやアジャイルといった開発手法には、データドリブンな考えが欠かせません」

2018年度後半には、GWSのデザインをテンプレート化して、各国のコーポレートサイトに展開していきます。これにより、グローバルウェブサイトの内容がより早く各国のサイトに反映されるようになります。また、各国の現地法人が作るローカルサイトでも使えるように、グローバルウェブサイトを構成するコンポーネントのサンプルと利用方法をまとめたスタイルガイドも提供する予定です。

これまでのウェブサイトの構築経験を踏まえ、更新しやすいサイト作りを重視していると粕谷氏は語ります。

「サイトの更新が効率良く行えること、継続して質を上げていけることは当初より意識していました。どのように優れたデザインを作っても、更新に手間がかかるものでは、単発の打ち上げ花火で終わってしまいます。コンポーネントの提供は現地法人に喜ばれています。サイト構築の支援体制を整えることで、現地法人のサイトも含め、ワールドワイドでデザインのレベルアップを推進していきます」

  • 得られたデータを総合的に分析し、企画立案などに役立てること。データ駆動型ともいう。