Webサイトのリデザイン前に行いたいUXワークショップ

Sarah Jee Watson

SarahはUX /UIデザイナーです。

この記事はboagworldからの翻訳転載です。配信元または著者の許可を得て配信しています。

How to conduct a UX Workshop before a website redesign.

ユーザー中心にデザインされたWebサイトをつくるための最初のステップは、プロジェクトの一番始めの段階においてUXワークショップを実施することです。今回の記事では、UXワークショップの準備の仕方、参加者の選び方、なにを持ち込むかということを検討し、どうすればワークショップが生産的なイベントとしてうまく行くかをみていきます。

さまざまなプロジェクトに使える原則や活動は数多くありますが、今回の記事はWebサイトのリデザインに先立つUXワークショップにフォーカスします。

UXワークショップの必要性

UXワークショップはステークホルダーの協力によって成り立つものであり、組織全体からさまざまな知見をもち寄るためのものです。ワークショップのおかげで、各ステークホルダーの考えは近いものになり、顧客(ユーザー)への共感をもつことができるようになります。ステークホルダー間のコミュニケーションを向上させ、結果として役割がクリアになり、チームとしてのオーナーシップが生まれるので、共通のゴールに向かってプロジェクトを進めることができるようになります。

UXワークショップの準備

「準備に失敗していたら、失敗するために準備しているのと同じだ」 ―Benjamin Franklin

成功の秘訣とは始めることであり、UXワークショップを始める秘訣は準備をすることです。参加者が主体的に関与し、内容を理解できるようにすることを念頭に置き、なるべく最高の成果が上げられるように、前もって整えられたしっかりしたプランをつくることが必要です。

参加者の選び方

UXワークショップは、Webサイトのリデザインプロジェクトを始める前にステークホルダーたちに団結してもらい、同じ立場に立ってもらうためのまたとない機会です。リデザインプロジェクトの早い段階でステークホルダーの責任感を醸成することで、そのプロジェクトは自分たちの仕事だという意識が出来上がり、ワークショップは彼らが自分なりの意見をもつ機会でもあります。つまりは、誰にとっても有益な機会であり、よい結果が生まれる見込みが高まるのです。

最低限、プロジェクトに参加する予定の人はすべて呼びたいと思うでしょう。また、意思決定の権限をもつ人や、組織や組織の顧客に対して知見をもたらすことができるような人を含めるのも賢明です。

エンドユーザーの立場を代表できるような人を参加させることができれば特に有効です。顧客と顔を突き合わせて仕事をしている人なら、顧客の考え方を代弁するのにぴったりですし、顧客がなにを望み、必要としているのか、あるいはその課題やペインポイントについて有意義な気づきをもたらしてくれるでしょう。

可能ならば、実際のユーザーを招待することを強くお勧めします。彼らならば、ステークホルダーが抱きがちな間違った思い込みを修正してくれるでしょう。

UXワークショップに必要なもの

ワークショップを成功させるためには、しっかり準備をした上で、出席者を巻き込まなければなりません。ワークショップを始めるために必要なことには、次のようなものがあります。

  • ワークショップを開催する場所:ステークホルダーがオフサイトではなく、実際に参加する形式が望ましいです。動き回りやすいように広い部屋を用意すれば、各種のアクティビティものびのび行えるでしょう。
  • アクティビティのための道具:付箋、マーカー、大きめの紙、色のついた丸いシールなど、アクティビティをスムーズに進めるために役立ちそうなものを用意しましょう。
  • リサーチ、またはユーザーからのフィードバック:もし、ユーザーのニーズについてわかっていることがあるなら、それは使えます。ユーザーペルソナやアナリティクスのデータなど、すでに行ったリサーチがあれば、参加者と共有しましょう。
  • 助手:あなたがアクティビティを進めるのをサポートしてくれたり、メモを取ったりして運営を助けてくれるようなファシリテーターを頼めれば最高です。
  • ワークショップのプランと目的:参加者は、その日の目的をわかっていなければなりません。ワークショップの目的を、誰からも見えるような場所に掲示しておくのもよいでしょう。アクティビティの意味、期待されるアウトプット、そしてワークショップの最後に得たいと思っているものについて説明しましょう。

UXワークショップのコツとヒント

次のようなコツとヒントを覚えておくとよいです。

  • 「駐車場」をつくる:これは、ワークショップの範囲外、あるいは本題から逸れたところで生まれたアイデアや気づきを留めておく場所です。
  • レスポンスを要約する:中にはあなたの質問に対して長々と、複雑な答えで返すことを好む人もいます。そんなときには、できるだけ素早くそれを要約して、あなたがその回答を理解していることを示し、他の参加者が付いて来やすいようにしましよう。
  • スマートフォンや端末を持ち込まず、参加者にも同じようにしてもらう:こうすれば参加の度合いが深まり、集中力が高まって当事者意識が上がります。
  • 準備を徹底する:どうやってワークショップを始めるのか決めておき、参加者と共有して、拠りどころとすべきアジェンダを用意しましょう。
  • 定期的に休憩を取る:創造性と生産性を高めるために必要です。

UXワークショップの1日の流れ

クライアント次第でその内容、アクティビティはまちまちですが、UXワークショップに期待される成果はいつでもそう変わりはありません。そのことを念頭に置いて、1日を通して行うワークショップの流れの例をみてみましょう。

Webサイトのリデザイン前に行うUXワークショップの例

  • 9:30~10:00:オープニング

まずはあなたのプランを共有しましょう。参加者たちはこれまでUXワークショップに参加したことがないでしょう。誰もが忙しいのが当たり前で、注意を向けられる時間は短いのですから、まず1日のプランをしっかり共有して、なにを期待しているのか参加者にわかってもらえれば、セッションは生産的なものになるでしょう。

その日の最終目的を共有しましょう。私たちが例として使っているWeb サイトのリデザインであれば、次のようになるかと思います。

1. 組織にとって重要な3つのオーディエンスについての共感マップを作成する
2. ユーザーニーズの優先順位を決定する
3. 主要なランディングページ上の要素間での優先順位を決定する

予算の配分が許すならば、ワークショップから得られた成果物をワークショップのあとにブラッシュアップしましょう。共感マップはもっと視覚的に見やすくなるでしょうし、ユーザーニーズのリストはWebサイトに新たな情報アーキテクチャをつくることに役立つでしょう。また、重要な要素はワイヤーフレームの中に取り入れられるでしょう。

参加者の中にお互いをよく知らない人がいる場合、短いアイスブレイクを取り入れることで、気まずい時間を無くすことができ、リラックスしてもらうことができるでしょう。また、参加者全員がよく知っているわけではないようなトピックを扱おうとする場合にもこれは有効です。

  • 10:00〜11:00:アクティビティ – 成功を定義する

まず、ステークホルダーにとっての「成功」とはどのような状態なのかを理解しましょう。最初に、彼らのプロダクトまたはサービスの現状について、短い単語やフレーズを使ってポストイットに書いてもらいます。それから、将来どのような形にしたいかについて、同じように書いてもらいましょう。

現状と将来像についてポストイットを使って簡単に話し合い、ボードに張り付けていきます。最初の段階で目標やビジョンが合意できていれば、誰もがそれにフォーカスしやすくなりますし、またあなたにとっては、ワークショップの成功、ひいてはプロジェクトの成功を判断するための尺度として使えるものが得られるかもしれません。

他には、「セイルボート」と呼ばれるアプローチもあります。30分から1時間ほどかかる方法ですが、概要は以下の通りです。

1. 島の絵を描いて(出来合いのものを使っても構いません)、自分が目指す目標、あるいはビジョンをそこに書きます。たとえば、「オンライン予約の増加」などです。

2. 参加者にポストイットとマーカーを渡して、アンカー(問題)があるせいでボートが島(目標)に向かって進めていないのだと説明します。

3. 質疑応答のあと、1枚のポストイットに1つずつ、彼らの組織に存在している問題を書いてもらいます。

4. 10分後にホワイトボードにそれらの問題を貼ってもらい、ボートと問題の間に線を引いてもらいます。このとき、それぞれの問題について説明してもらうことができればなおよいです。

5. 似ている問題点をグループにまとめ、もしその問題が無かったらボートがどれだけ速く進めるのかについて話し合います。

6. 問題をリスト化し、解決できそうな問題はどれなのか考えます。これは参加者に考えてもらえばよいですが、もしそうする場合は制限時間を設けましょう。

  • 11:00〜11:15:ティーブレイク

これは秘訣でもなんでもなく、定期的に休憩を取れば生産性は上がるものです。

  • 11:15〜12:15:アクティビティ – オーディエンスを決め、優先順位を付ける

参加者をグループに分けて、彼らが思うさまざまなタイプのオーディエンスやユーザーについてプレインストーミングを行ってもらい、ポストイットに書いてもらいます。重複する部分があればまとめながら、壁に貼っていきましょう。

次に、どのユーザーグループがビジネスにとってもっとも重要な、優先すべきユーザーなのかを決めるためにドット投票を行います。

1人あたり3個から5個のシールを渡して、壁にあるユーザーグループの中でもっとも重要だと思えるものに投票してもらいます。ポストイットで表されたユーザーグループに対して投票できる数は1個以上でも構わないことを説明しておきましょう。

  • 12:15〜13:15:ランチタイム

腹が減っては戦はできません。

  • 13:15〜14:00:アクティビティ – ユーザーのニーズを見つけ出す

このアクティビティは、ユーザーにとってもっとも問題となっていることを見つけやすくするものです。参加者にはユーザーの気持ちになってもらい、なにが欲しいのか、なにを求めているのか書いてもらいます。

たとえば、「x」がいくらかかるものなのか知りたい、とか、予約をしなくてはならない、というような内容です。参加者に自分たちの答えについて説明してもらい、それを貼っていきます。似ているものがまとめ、取り上げなくてもいいようなニーズがないか話し合います。あえて反対意見を出すことも必要です。

ここで再び、もっとも重要なニーズを特定するためにドット投票で絞り込みます

理想的にはこのプロセスは、ワークショップに参加しているユーザーと一緒に行うか、ワークショップの前にユーザーを交えて重要タスク分析を行っておくべきでしょう。そうすれば、議論すべきタスクがより現実的になるからです。そうは言っても、つねにユーザーと接しているスタッフとの議論だけでも十分示唆に富んでいます。

ユーザーのニーズ、そして彼らが完了しようとしているタスクが明らかになったら、ユーザー側とビジネス側がWin-Winになるように、それをできるだけ簡単にこなせるようにすることができます。

  • 14:00〜15:00:アクティビティ – ペルソナ、共感マップの作成

共感マップは、ある特定のタイプのユーザーについて私たちが知っていることすべてを表現できるようにつくられています。ユーザーのニーズ、目的、期待、それからペインポイントを理解することで、体験のあらゆる段階において私たちがサポートしやすくなりますし、デザインにおいて賢明な判断を下すことができるようになります。

下に示したような共感マップのテンプレートを使って、前のパートで特定したそれぞれのユーザーグループについて参加者たちが知っていることを書き出してもらいましょう。

UXにフォーカスした共感マップ

  • 15:00〜15:15:ティーブレイク

一杯の紅茶から全てがうまくいくこともあります。

  • 15:15〜16:00:アクティビティ – ユーザーの注意について考える

あらゆる組織が悩んでいることについて、優先順位を付けてみましょう。このアクティビティを行えば、参加者はユーザーがプロダクトに注意を向けてくれる時間が限られていることを正しく理解してくれるでしょう。これを行うときには、ホームページやランディングページなど、特定のページを念頭に置いておく必要があります。

1. 参加者をグループに分けて、WebサイトのUIにあるべき要素をすべて書き出してもらいます。ボタンのようなものからナビゲーションへのリンク、ブランディングのための要素まで、できるだけ多く挙げてもらいましょう。もっとも多く挙げたグループにはご褒美をあげてもいいかもしれません。

2. ユーザーが注意を向けている時間は短く(8秒間)、またどんどん短くなっていることを説明します。

3. 各グループに16ポイント(2ポイントが1秒に相当)を与えます。それぞれのポイントが要素を表します。問題は、たとえばコールトゥアクション(CTA)のような、彼らがより注意を引くべきだと考えている要素は、プライバシーポリシーのようなものよりも多くのポイントを必要とするということです。

4. 各グループに、彼らが挙げた要素にポイントを割り振ってもらいます。きっと参加者たちは、現実的な優先順位そっちのけで、できるだけ多くの要素にポイントを割り振るでしょう。

5. 次に、GoogleとYahooのページを開いて、並べて表示します。そして参加者に、どちらがうまく行っているか聞いてみましょう。ほとんどの人がGoogleだと答えるはずです。

6. 参加者たちに、彼らが実はYahooのような、ユーザーの注意をあまりに多くの要素に散らしたデザインをつくったのだということを説明します。反対に、Googleはもっとも重要なエレメントに注意を集めているのです。

ユーザーが向けてくれる注意に限りがあることを示すために、GoogleとYahooを比較するのが非常に有効です。

このアクティビティを行えば、むやみに散らかすよりもシンプルにすることの方がどれだけ重要なのかよくわかり、多くの参加者にとって目からウロコが落ちるような経験になるでしょう。

  • 16:00〜16:30:フィードバックとレビュー

質疑応答を行い、次のステップについて話しましょう。もちろん次のステップはあなたが果たす役割次第ですが、多くの場合次のようになるはずです。

    • 今日のセッションを通じて得られたものを文書化し、重要な結論、そして新たな発見を記録に残す
    • Webサイトやアプリの詳細な要件を書き始める
    • インフォメーションアーキテクチャとワイヤーフレームをつくり始める

まとめ

UXワークショップのやり方や中身は、プロダクト、求める結果と成果物によって変わります。この記事においては、一貫してWebサイトのリデザインの前にワークショップを行うという前提で進めました。

ワークショップを終えたら、あなたの組織が抱える顧客についてのより深い理解が得られるでしょう。

UXワークショップは次のような点で役立ちます。

1. オーディエンスが誰なのか明確に定義する
2. ユーザーに対してWebサイトが提供すべきものが何なのか、深く理解する
3. たとえばホームページのような、サイトの中心となるページのために、どのようなワイヤーフレームを開発すればいいのかを考える出発点になる

もしWebサイトをリデザインすることを考えているなら、まずUXワークショップをやってみてください。きっとプロジェクトの形が変わりますよ。


Welcome to UX MILK

UX MILKはより良いサービスやプロダクトを作りたい人のためのメディアです。

このサイトについて