判断軸を構造に変換する構造UX - 構造UX視点 -

判断軸を構造に変換する構造UX - 構造UX視点 -

判断軸を構造に変換する構造UX - 構造UX視点 -:目次

構造UXの役割は、戦略UXで定めた評価軸をもとに、サイト全体の構造と役割を設計することです。戦略UXで定められた意思決定の評価軸は、そのままでは機能しません。それらは、情報構造や導線、機能配置といった具体的な構造に落とし込まれて、はじめてプロジェクトの中で実体を持ちます。

戦略UX(Why)については『Whyで見える評価軸と前提条件 - 戦略UX視点 -』をご覧ください。

設計対象

ここで扱うのは、「情報の配置」「導線の流れ」「機能の置き方」「各要素の役割」といった、UX全体の骨格となる構造です。(見た目やデザインではありません。)

情報構造

情報構造とは、Webサイトやサービスに含まれる情報を、役割と優先順位に基づいて配置する設計です。

  • 主軸とする情報の提示
  • 近接させる補助情報の選択
  • 段階的に見せる情報の設計(下層配置)
  • 目的に寄与しない情報への対応(削除)

ここでの配置基準となるのが戦略UXで定めた目的や評価軸です。その評価軸を参照して各情報に役割を与え階層と関係性を確定させます。

たとえば、技術仕様という情報も、Webサイトの目的によって配置が変わります。導入判断に直結するサービスサイトであれば、技術仕様は主情報を補強する「従」として近接配置されます。一方、ブランド理解や全体像の把握を主目的とするWebサイトでは、技術仕様は詳細確認のための「下層」として段階的に配置されます。

従と下層の違い

主を補強する情報。同じ文脈の中に置く。主の理解を助けるため、近くに配置する。同階層、または1段下に配置される。

例)サービスページ

  • 主:サービス概要
  • 従:(評価軸によっては「下層」になる)
    料金/特徴/事例

→同一ページ内など近接に配置。

下層

詳細・補足・個別展開。必要な人だけが到達する情報。主の理解には必須ではなく、詳しく知りたい場合に参照される。

例)サービスページ

  • 主:サービス概要
  • 下層:(評価軸によっては「従」になる)
    技術仕様/詳細事例/FAQ/個別記事

→階層を下げ、導線も限定して配置する。

導線構造

ユーザーがどこから流入し、どの順序で情報に触れ、どの地点でアクションに至るかを設計することです。
どこから入り、どこへ流し、どこで決断させるか。

アクションの深度による心理変化の図
アクションの深度による心理変化の図

この流れを意図して設計することで、情報構造と意思決定のプロセスが結びつきます。
導線は単なるリンクのつながりではありません。閲覧の順序、理解の段階、判断のタイミングを含めた体験全体の流れです。

例えば、資料請求や問い合わせを主目的とするWebサイトでは、トップページからサービス概要、事例、料金といった理解に必要な情報を段階的に配置し、最終的に問い合わせや相談へ到達する導線を設計します。一方、採用を主目的とするWebサイトでは、企業の考え方や働く環境、社員の声といった、将来のイメージがわかる情報を先に提示し、自分事となれば応募や説明会予約へ進む、という流れが中心となります。

このように、どこを入口とし、どの順序で情報を提示し、どこで判断してもらうかは、戦略UXで定めた評価軸によって変わります。

機能配置

どの機能をどの位置に置き、どの文脈で利用させるかを設計します。
同じ機能であっても、配置や提示の仕方によって、ユーザーの行動や受け取り方は大きく変わります。

例えば問い合わせ機能は、サービス理解の途中に配置されれば検討の一歩として機能しますが、情報が不足した状態で先に提示されれば離脱要因になることもあります。検索機能やFAQは、問題解決を促す主機能として配置される場合と、問い合わせ前の補助として配置される場合とでは役割が異なります。

どの機能を前面に出すのか。
どの機能を補助として配置するのか。
どの段階で使わせるのか。

これらは戦略UXで定めた「目的」「評価軸」「優先順位」に従って決まります。問い合わせ獲得を主目的とするのか、既存顧客対応を優先するのか、採用応募を主軸とするのか。どの行動を最終的な到達点とするかによって、主要機能の位置、役割、接続のタイミングが決まります。

役割分担の構造

Webサイト内の各ページや接点にどの役割を持たせるかを設計します。

  • トップページは全体像を提示することが目的か、入口として特定の行動へ誘導するハブとするのが目的か。
  • 下層ページは詳細説明に徹するのか、個別の意思決定を担うのか。
  • LPは単体で完結させるのか、全体構造の中で機能させるのか。

それぞれのページや接点には、本来担うべき役割があります。これらを整理せずに個別最適でページを作り続けると、役割が重複し、導線が分断され、全体として機能しなくなります。また、Webサイトの役割はオンライン上だけで完結するものではありません。営業活動、資料送付、説明会、来店、問い合わせ対応など、オフラインの接点とどのようにつながるかによって、各ページの役割は変わります。構造UXでは、Webサイト全体を一つの構造として捉え、各ページと接点の役割を整理し、全体として機能する配置を設計します。

事業施策を俯瞰して眺め、公式サイトの位置を確認することでUXを設計できるフレームワークの図
ボーダレスマップ簡易版

WebサイトやSNSとオフラインの接点を含めて役割を整理する方法として、ボーダレスマップという考え方もあります。
私たちはこの整理手法を用い、Web・システム開発の上流設計を行っています。(Web・システム開発の上流設計支援

構造化の成果物

構造化とは、

どの情報を主軸とするのか。
どの導線を主線とするのか。
どの機能をどの位置で使わせるのか。
各ページや接点にどの役割を持たせるのか。

これらを個別の感覚ではなく、評価軸に基づいて共有できる形にする必要があります。
そのために可視化する成果物は、例えば次のようなものです。

  • Information Architecture
    主軸と従の関係が明示された情報構造
  • User Flow
    主線導線と分岐導線を示した導線
  • Function Map
    主要機能の配置と利用タイミングを示した配置
  • Content Matrix
    各ページの役割と到達目的を整理した役割一覧
  • Borderless Map
    オンラインとオフライン接点を整理した接点構造図

これらが揃ってはじめて、構造は共有可能になります。
つまり構造化とは、誰が見ても同じ前提で判断できる設計図をつくることです。
これらの設計情報の多くは最終的にワイヤーフレームへ統合され、実装と運用の判断が可能な設計図へと具体化されます。

構造UXが弱いと何が起きるか

ワイヤーフレームや設計資料にUXの意図が反映されず、実装・運用時にさまざまな問題が表面化します。

  • 戦略がページ構成に反映されない
  • デザイン設計が表層にとどまる
  • 機能が増え続け将来的に破綻する
  • ユーザー導線が分断される
  • 運用時、更新のたびに構造が揺らぐ

戦略UX(Why)で定めた評価軸が実体を持たず、結果として一貫性が失われます。

判断軸を構造に変換する構造UX - 構造UX視点 -のまとめ

構造UXとは、評価軸を実体構造へ変換する設計です。
その成果物の多くはワイヤーフレームへ統合され、実装と運用がぶれない設計図となります。

また、Webとオフライン接点を含めた全体構造の整理には、K2独自の「ボーダレスマップ」を用いて上流設計を行っています。
Web・システム開発の上流設計支援

更新は
SNSnoteでお知らせしています。

現在連載中のテーマ | 要件定義

最新回はこちら (2026.02.18更新)

現在連載中のテーマ | UXの四視点

最新回はこちら (2026.02.11更新)