「ツリーテスト」でWebサイトの使いやすさを改善しよう! | アドビUX道場 #UXDojo

by akihiro kamijo

Posted on 02-08-2021

連載

エクスペリエンスデザインの基礎知識

Webサイトを新規に構築したり、既存のサイトを改善するとき、コンテンツの整理は最大の課題のひとつです。論理的かつ直感的な情報の整理は、良いユーザー体験の実現に欠かせません。しかし、サイトでもアプリでも、カテゴリーが重複していたりラベルが分かりにくいのはよくあることです。特に公開から数年が経過したWebサイトではありがちです。もしコンテンツの発見や閲覧が困難なら、どれほど見た目が魅力的でも悪いユーザー体験を提供することとなり、コンバージョンレートは下がるでしょう。

では、コンテンツの整理状況が効果的かどうかをどのようにして検証すればよいのでしょうか?適切な構造とラベル付けがされていることをどのようにすれば確認できるでしょう?そんな時に役立つ優れた手法がツリーテストです。

この記事は、ツリーテストをはじめて試そうとしている人に向けて書かれています。

ツリーテストとは何か?

ニールセン・ノーマングループはツリーテストを評して、階層的な構造やコンテンツの見つけやすさを評価する強力な手法であると述べています。名前に「ツリー」が入っているのはなぜかといえば、その理由は、典型的なサイトやアプリが、ホームページあるいはホーム画面から枝分かれする階層化されたカテゴリーにより構成されているからです。コンテンツの階層を視覚化すると、まさにツリーのように見えます。

ツリーテストは、カテゴリーやラベルを素早く効果的にテストして、サイトやアプリの階層の分かりやすさを評価します。

ツリーテストの行い方

ツリーテストはタスクを実施するアクティビティです。参加者は与えられた構造の中から特定の要素が属する場所を見つけるよう求められます。その結果から、ユーザーがどこに情報があると期待しているかを分析し、その振る舞いに応じて構造を改善します。

カードソートとの違い

カードソートとツリーテストはどちらもコンテンツのカテゴリー化という同じ目的を持っています。ですが、それぞれ異なる角度からのアプローチであり、コンテンツ戦略の異なるタイミングで使用されます。カードソートでは、ユーザーは一連のコンテンツを与えられ、グループ化してラベル付けするよう求められます。カードソートはユーザーの思考方法を理解するのに優れたテクニックです。

しかし、カテゴリー分けする方針そのものを策定するときにはあまり役に立ちません。その理由は、ユーザーが独自にカテゴリーを想定し、その範囲内でグループ分けするからです。ユーザーが提案するカテゴリーに完全に沿った構造を設計するのは、常に可能というわけにはいきません。

2つの列に整理されたカードのスタック。

クローズドカードソート 出典: IDF

ツリーテストでは、参加者は構築済みのカテゴリー構造と向き合い、指示されたアイテムが最もありそうな場所を示します。そのため、ツリーテストは「リバースカードソート」と呼ばれることもあります。ツリーテストをカードソートのフォローとして行うと非常に有効です。現実的なシナリオの中で階層構造がどのように機能するかを評価できるからです。

ツリーテストの実施に関する注意点

ナビゲーションをデザインする前にツリーテストを行いましょう。そうすれば、情報の論理的な設計に役立ちます。伝統的なユーザビリティテストと異なり、このテストでは実際の画面が必要ありません。単純にテキストで表された構造があればよいのです。ツリーテストを行うために準備すべきものは2つあります。階層図と、テスト参加者が行うべきタスクです。ツリーテストの目的は、「ユーザーは探しているものを見つけられるか?」という問いへの答えを見つけることです。

ツリーテストはプロトタイプ構築前に実施する

ツリーテストは一般的にデザインプロセスの早期に行われます。ごく単純な形式(スケッチ、あるいはラフなワイヤーフレーム)でサイトやアプリの構造を検討し、個々のページデザインを始める準備ができたタイミングで実施するのが最適です。

完全なツリーを用意する

テストに使用するツリーは、すべてのカテゴリーとサブカテゴリーを含んだものであるべきです。ツリーの特定の箇所だけをテストしたいときでも、他の箇所を排除することにはリスクがあります。ユーザーがツリー構造全体を知っていて、カテゴリー同士の関係を知っていると仮定することになるからです。

Webサイトの構造がスプレッドシートのカラムを使って表されている。

Webサイトのハイレベルな構造 出典: nngroup

タスクを準備する

テスト参加者に完了するよう求める一連のタスクは、ツリーと同じくらい重要です。それぞれのタスクの内容は、カテゴリーに含まれている何かを見つけるように尋ねることによりカテゴリー名をテストするものであるべきです。

下の例は、化粧品のeコマースサイトのツリーに対し、ブランドカテゴリーを評価することを目的としたタスクです。

矢印でつながれた3つのカード(メニュー、ブランド、American Crew)がナビゲーションプロセスを示している。

ツリーテストのタスクの例 出典: loop11

以下は、タスクを準備するときに注意すべきいくつかの基本的な項目です。

テストは短く効率的に

ツリーテストには20分以上かけるべきではありません。テストの参加者に支持するテストの数は10個以内にしましょう。タスクを繰り返すにつれて、テスト参加者は階層構造に馴染んできます。どこに何があるかを覚えていると、結果にも影響を与えます。

専用のツールを使用する

ペンと紙を使ってツリーテストを行うことは可能ですが、おすすめは専用のオンラインサービスを使うことです。テストの実施と結果の分析が容易に行えるUserzoomTreejackはどちらも良い選択肢です。

縦に並べられたWebページのリスト。

ツリーテストの結果を視覚化し、結果の解析が容易になるUserzoom

事前にパイロットテストを行う

ツリーテストは、モデレータ有り無しどちらでも実施できます。多くの場合、コストがかからないという理由から、モデレータのいないリモートテストが好まれます。その場合、テスト参加者は指示書を受け取り、自身の環境でタスクを完了することになりますが、このやり方には大きな問題があります。モデレータのいないリモートテストは、ユーザーの振る舞いの背景にあるものを十分に理解するには適していません。推奨される手順は、大勢を相手にテストする前に、少なくとも数名を対象にモデレータ付きのパイロットテストを行うことです。それにより、重要な細部を見逃すリスクの軽減が期待できます。与える指示を調整することにより、テストからより価値ある洞察を得るためにも役立つでしょう。

モデレータが対面式で行うテストを実施するときは、参加者にどのように考えたのか話すよう求めましょう。「なぜ?」という一連の質問を投げかけることで、彼らの判断の背景にある思考を知ることができます。

データの測定

ツリーテストを完了したら、次は結果の分析です。ただし、結果の分析だけで終わりにせず、得られた洞察を参考にコンテンツの構成を見直して最適化を行い、再びツリーテストを実施して変更内容を検証します。

ExperienceUXによれば、結果を見るときは以下のような項目を調べるべきとされています。

また、タスク完了までに行われた試行回数も測定可能です。この指標は、どこのアイテムが見つけにくかったかを示します。コンテンツの構成やラベル付けに関連する問題を判断する際の根拠として利用できるでしょう。

おわりに

ツリーテストは、素早く実施できる簡単で費用のかからないコンテンツ構造の評価手法です。ユーザーがサイトやアプリのどこに何があると期待しているかを知りたいときに役に立ちます。最初から完璧なコンテンツ構造をつくり上げることは不可能です。ですから、「設計してその検証を行う」というプロセスを繰り返す準備をしておきましょう。

この記事はHow Tree Testing Can Improve Your Website Usability(著者:Nick Babich)の抄訳です

Topics: クリエイティブ, UI/UX & Web

Products: