Webデザインの核を担う“情報設計”を、見落としていませんか？

私たちが普段から触れているコンテンツや機能の多くは、使いやすく、目的がすぐに果たせるよう、設計者と開発者によって“構造化”されています。ユーザーがインターフェイスを認識しやすいよう、適切な方法でコンテンツとナビゲーションシステムを構築しているのです。

Webデザイナーが留意するべき要素は数あれど、コンテンツの構造化はとても重要な項目です。

今回は情報設計の考え方の本質に迫り、デザイナーが知っておくべき基本的なポイントをご紹介します。

情報設計とは？

情報設計（Information Architecture／以下：IA）とは、WebサイトやWebアプリケーション、モバイルアプリケーション、ソーシャルメディア、ソフトウェアなどのコンテツ上にある情報を、誰でも理解できるよう、何をどのように配置するかを決めることです。

IAは、ユーザーが製品の機能に容易に適応し、簡単に必要なものをすべて見つけることができるように、コンテンツを整理することを目指しています。IAの現場では、ユーザー満足度を高めることが優先事項とされています。そのため、IAの設計者はターゲットとする視聴者ニーズを具体的に把握しようとするのです。

また、その構造は提供したいサービスや売りたいものによって異なります。たとえば、小売のWebサイトとブログをの構造を比較すると、全く異なる2つの構造が浮かびあがってきます。

IA分野の創設者は、アメリカの設計者で情報設計研究所を設立した、グラフィックデザイナーのリチャード・ソール・ワーマン氏。IAは、設計やソフトウェア開発を含む多くの分野での基礎研究となっています。

デザインにおけるIA設計の役割

デザインにおけるユーザー中心のアプローチがトップトレンドになった今、多くの設計者が効率的な設計の基礎であるIAの原理を学んでいます。視覚的要素、機能、相互作用、およびナビゲーションは、デザインプロジェクトの骨組みであるIAに従って構築されます。つまり、魅力的なコンテンツ要素と強力なUIデザインを揃えていたとしても、適切なIAなしでは失敗する可能性があるということです。

ナビゲーションが不明瞭な製品やサービスを前にしたユーザーは、あれよあれよという間に迷子になり、煩わしさを覚えてしまいます。最初に悪い印象をもたれてしまうと、二度と利用してもらえないかもしれません。

しかし、多くの企業はIAを実用的でないと考えているようです。IAを作成するのにはある程度の時間とスキルが必要であるという主張を理解してもらうのは難しいです。ですが、強力なIAは製品の品質を保証するものですから、修理と改善に費やしていた時間とコストを節約することだってできます。

IA設計は構造を、UX設計は感じ方をデザインする

ここまで読んで、「IA設計はUX設計と同じでは？」と疑問をもつ人がいるかもしれません。

技術的にいえば、IA設計とUX設計はお互いに関係していますが、同じではありません。IAは、プロジェクトのワイヤフレームとサイトマップになる設計構造の設計図です。UXデザイナーは、それらを基本的な材料として使い、ナビゲーションシステムの計画を立てます。

優れた情報設計は効率的なユーザーエクスペリエンスの基礎です。効果的なIAが良いユーザーエクスペリエンスを生み出し、製品を使いやすくします。

情報の整理に特化した、IAの構成要素

IAを作りあげようとしたとき、どんな要素を理解しているべきなのでしょうか。IA分野のパイオニアであるルイス・ローゼンフェルド氏とピーター・モービル氏の著書「Information Architecture for the World Wide Web」から、4つの主要な構成要素をご紹介します。

組織化システム

組織化とは、グループやカテゴリなどに情報を分けることを指します。このシステムがあることでユーザーが特定の情報を容易に見つけるのに役立ちます。また、組織化システムは大きく分けて以下の3種類に分類できます。

 階層型

ビジュアル階層とも呼ばれるよく知られたコンテンツ構成のテクニックであり、ゲシュタルトの心理学の理論に基づいています。主な狙いは、書籍もしくはポスター、Webページまたはモバイル画面などで、各要素の重要度をユーザーが理解できるようにコンテンツを提示することです。大きさ、色、コントラスト、アライメントなどの物理的な違いに基づいて、オブジェクトを区別するために脳が活性化されます。

シーケンシャル

この構造では、何種類かの経路を作成し、ユーザーがタスクを完了するために必要なコンテンツを段階的にめぐらせます。このタイプは、小売のウェブサイトやアプリで頻繁に使われており、ユーザーは購入するために、あるタスクから別のタスクに移動する必要があります。

マトリクス

このタイプはユーザーにとって少し複雑ですが、ナビゲーション方法を選択できるため、ユーザーにコンテンツ構成の選択肢が与えられます。たとえば、コンテンツを日付に応じて並べかえたり、トピック別に表示したりできます。

さらに、コンテンツを構造化スキームに従ってグループ化することや、製品のコンテンツを分類することができます。 一般的な手法をいくつかをご紹介します。

• アルファベット順スキーム：コンテンツをアルファベット順に整理する方法です。ユーザーのナビゲーションツールとしても機能します。
• 時系列スキーム：コンテンツを日付で整理する方法です。
• トピックのスキーム：コンテンツを特定の題目で整理する方法です。
• オーディエンスのスキーム：コンテンツをユーザーグループごとに整理します。

ラベリングシステム

このシステムは、データ表現の方法と関係しています。製品の設計にはシンプルさが求められるため、デザイナーは複雑なデータを別の単語や記号で表すことが多いです。

例えば、Webサイト上で電話番号、電子メール、ソーシャルメディアの連絡先など会社の連絡先情報を表示させる場合、デザイナーはそれらの情報を”会社情報”としてくくってひとつのページにまとめます。ラベリングシステムでは、データを効果的に統合することができるのです。

ナビゲーションシステム

ナビゲーションとは、アプリケーションやWebサイト全体がユーザーを導く一連のアクションとテクニックのこと。それを実現させるためには、ユーザーがコンテンツ間をどのように移動しているのかを知る必要もあります。

検索システム

このシステムは、ユーザーがWebサイトやアプリなどのデジタル製品内のデータを検索するのに役立ちます。検索システムは、ユーザーが情報を見失うほどに情報が豊富な製品に対してのみ有効です。具体的には、検索エンジンやフィルタなどのツールをを使います。

IAはユーザーエクスペリエンス設計の中核部分です。効率的なIAを導入することで、ユーザーは必要なコンテンツをすばやく簡単に見つけることができます。設計者はIA の原則を学んで、ユーザーを魅了するデザインを作りましょう。

（翻訳：Kazunari Mino）