カードを使って簡単にユーザニーズを探る方法 (ユーザビリティ実践メモ)
「サイトの画面設計やデザイン性はそれなりに良いのだが、肝心の中身、コンテンツが足りていないので強化したい。けれどどんなコンテンツがユーザから求められているのか分からない…。」 今回はそんな時に役立つ調査手法の1つとして、「カードソーティング」をご紹介します。 メリット この手法の最大のメリットは、実際に物を作る前であっても、ユーザの行動観察ができることです。 カードという刺激物を与えて、それに対してユーザがどのように行動するかを見ることができるため、「どんなものが見たいですか？」、「○○というコンテンツがあったら見たいですか？」といったインタビューよりもはるかに意味のある検証が可能です。 また、ユーザと面しているため、仕分け結果の理由をすぐに尋ねることができるのもメリットです。具体的にどのようなものを期待したのか、なぜ見たくないのかなどを尋ねられるため、その場で疑問を解消し、さらに深掘りす
beBit.Q Twitterでユーザビリティクイズに挑戦！
【変則○×】Q. ユーザビリティの原則の1つとして「ページ内リンクの使用は避けるべき」と言われている。ページ内リンクがあるとユーザがサイト内のどこにいるかを見失いやすいからである。この原則はどんなケースにおいても守るべき。○か×か。×の場合、例外となるケースも示せ。
結果をただ比較するABテストよりも (ユーザビリティ実践メモ)
サイトページやクリエイティブ変更の効果を測定する手法であるABテストは、広告・サイト運営にひろく取り入れられています。 ですが、ただ結果を比較して「Aの方がよかった」「Bの方がよかった」と言っているだけでは、次につながりにくくもったいない状態です。 仮説検証のインプットとしてABテストを利用することで、ABテストは長期的改善につながる手法となります。 下図のような、A：作り手の写真 と B:お菓子の写真とでABテストを実施する場合、テストの計画段階と分析段階で仮説検証を意識することで、得られるインプットがどう変わるか考えてみます。 ＜テスト1：ただ比較する場合＞ ■テストの計画段階 「お菓子のサイトでは、作り手やお菓子の写真を使用しているところが多いな。どちらが売上げがよくなるだろう」 ■分析段階 「お菓子の方がよかったから、お菓子をメインビジュアルで採用しよう」 単純なクリエイティブのテ
初心者でも使えるサポートページの作り方 (ユーザビリティ実践メモ)
お問い合わせコストを節約するため、ウェブサイトに「よくあるご質問」や「アフターサービス情報」等を豊富に掲載して、ユーザの自己解決を促すケースが多くなってきています。 一方で、インターネットに不慣れなユーザ（以下：初心者）が利用するにはハードルが高いサポートページも多く存在します。 今回は、特に初心者向けにサポート情報を提供する際のポイントをご紹介します。 サポート情報を提供する上で最も重要なことは、ユーザが目的の情報にスムーズにアクセスできるようにすることです。そこでサポートページでは、「一本道で目的の情報にたどり着ける」ように導線設計をすることが重要です。 一般的には、「商品カテゴリから探す」、「型番から探す」、「よくあるご質問から探す」など、色々な探し方が出来たほうが、ユーザビリティーが高い傾向があります。しかしこの一般則は、初心者がサポートページを利用する場合には必ずしも当てはまりま
テキストと画像、どのように使い分けていますか？ (ユーザビリティ実践メモ)
ウェブサイトは、テキスト、画像、動画など様々な要素で構成されています。皆さんはそれらをどのように使い分けているでしょうか？今回は、ユーザがサイトを訪問する際の目的意識の強弱による使い分けのヒントをご紹介します。 弊社ではユーザ行動観察調査にアイトラッキングを用い、サイト利用時の視線の動きを調査していますが、そこで頻繁に見られる興味深い現象をご紹介しましょう。 あるメーカーサイトを題材として行った調査では、特定の情報を求めて訪問するケース（以下、探索モード）と、サイトのファンなど定期的にサイトを訪問しており、特に強い目的がないケース（以下、回遊モード）でユーザの目線の動きに明確な違いが見られました。（下図参照） 探索モード（図の左側）では、主にテキストリンクを中心に目的のコンテンツへのリンクを探す傾向があるのに対して、回遊モード（図の右側）では、バナーなどの画像を中心に見ていく傾向が強いこと
情報を確実に伝える「近接」テクニック (ユーザビリティ実践メモ)
ウェブサイトに十分な情報を載せているのに、なぜかユーザに正しく情報が伝わらない、そんなケースは多いのではないでしょうか。今回は、実際の事例をもとに、「情報の関連性」を使ったテクニックをご紹介します。 今回取り上げるサイトでは、ウェブや電話では契約の新規申し込みはできないにも関わらず、「契約までの流れが理解されず、申し込みの電話がきてしまう」という課題がありました。対策として、お問い合わせページ内に「契約までの流れ」を記載していました（図1)が、ユーザは全く気付かず電話をしてしまう状況でした。 皆さんなら、どのような改善案を考えますか？（制約条件として、「商品説明」ページなどは修正ができないものとします） ユーザは「探している情報」しか目に入らない ありがちな対策として、「契約までの流れを画面上部に配置し、とにかく情報を見せる」という案があります（図2）。しかしこの案は、あまり効果的とは言え
ネットブックやスマートフォン利用者に配慮したサイト作り (ユーザビリティ実践メモ)
最近ネットブックとスマートフォンの利用者が増えているように感じます。 電子情報技術産業協会の調査結果によると、第一四半期国内PC出荷数の2割弱はネットブックとなっています。 スマートフォンの国内出荷台数を正確に知ることは難しいですが、docomoのGoogle携帯HT-03Aが流通し始めた点や、7月の日本の携帯売上でソフトバンクのiPhone３GSが1位になった点から考えるに、今後ますます利用者が増えると予想されます。 私たちとしては、このような状況下でPC向けサイトを制作する際に、ユーザビリティの観点から注意すべき点が大きく3点あると考えます。 近年、家庭用PCのスペックや回線環境が整い、Flashなどを用いたリッチなコンテンツも快適に利用してもらえる可能性が高くなっていますが、一方でネットブックやスマートフォンの多くはそれほど快適なスペック、回線環境が整っているとはいえません。 たとえ
入力フォームのコンプライアンス文言はどう配置する？ (ユーザビリティ実践メモ)
会員登録フォームや資料請求フォームでの入力作業は、多くのユーザにとって面倒で煩わしい作業です。フォームをできるだけ「簡単そう」、「手軽そう」な印象にすることは、ユーザの心理的負担を軽減するうえで重要です。 ただ、ユーザに対して丁寧に注意文言を提示すればするほど、まとめて無視されてしまったり、「簡単そう」な印象から離れて威圧感のあるページとなってしまうなど、適切にユーザに情報を伝えるという本来の意図から外れてしまいます。 今回はユーザの心理的障壁を高めることなく、コンプライアンス文言を適切に配置する方法を考えてみたいと思います。 1）注意文言をリンクにする 情報量の多い注意文言はリンクにすると必要なスペースが少なくて済むため、見た目の威圧感を低減するとともに、まとめて無視されてしまうリスクも低減します。また、必ずしも全ユーザに確認してもらう必要のない重要度の低い注意文言に関しては、まとめてペ
「システム視点」で機能を作っていませんか？ (ユーザビリティ実践メモ)
不動産情報サイトや転職情報サイトなど、多くの情報を掲載しているサイトでは、ユーザが複数の条件を指定して検索する、という機能が非常に重要になっています。 そのサイトで紹介している各情報の属性は、 個人、法人のいずれも募集している 個人だけ募集している 法人だけ募集している の三通りがあります。 それを反映して、サイトでの検索条件指定画面では、次のような項目となっています。 さて、この検索機能をユーザの視点から見てみましょう。 この情報検索サイトのターゲットユーザは、大きく個人ユーザか法人ユーザのどちらかです。 例えば個人ユーザであれば、「個人を募集している情報を見たい」というニーズを持っているわけです。 それでは、個人ユーザが上記のプルダウンを見たときには、何を選べばいいのでしょうか？ 「個人・法人」？ それとも「個人」？ 弊社で実施したユーザ行動観察調査では、ユーザが「自分は個人だから」と
【携帯サイト】もう1ページ先に進んでもらうための６つのテクニック (ユーザビリティ実践メモ)
せっかくコンテンツを作っても、リンクがユーザにクリックされず、内容を見てもらえない、という悩みをお持ちのWEBマスターの方は多いのではないでしょうか。 今回は、携帯サイトでユーザを次ページに導くためのテクニックをご紹介します。 筆者がユーザビリティテスト（ユーザ行動観察調査）を通して得た実感として、携帯サイトの方がパソコンサイトよりも次ページへの誘導が難しいという印象があります。ある携帯の有料会員制サイトでは、「ユーザはいつも利用しているリンク以外はほとんどクリックしない」というユーザ行動が見られました。 理由として、携帯サイトは 読み込みが遅い隙間時間に利用される場合が多く、利用時間が短いパケット代がかかる などが考えられます。 そのため、携帯サイトでユーザを次ページに誘導するためには、パソコンサイト以上に誘導方法を意識する必要があります。以下、ユーザビリティテスト（ユーザ行動観察調査）
サイト間連携時に陥りがちなミス (ユーザビリティ実践メモ)
自社内の組織の構造をウェブサイトに反映させている企業は少なくないのではないでしょうか？今回の実践メモではそうしたサイトを利用したユーザの反応と、対処方法をご紹介します。 サイト利用中の行動を観察していると、ユーザが衣料品サイトにログインをしようとしたところ、唐突に食料品サイトでのログインを求められたため、フォームに何を入力してよいのかを理解できず困惑する様子が確認されました。 フォーム上部の文言で食料品サイトのID・パスワードの入力が必要な点を説明することで、上記のような状況を一定程度回避することが可能だと考えられます。しかし、問題発生の真の原因は、同一企業のサイトであれば何を入力すべきかをユーザはなんとなく理解できるであろうという企業側の期待です。 当然のことながら、ユーザはサイト運営企業のシステム事情などは知りません。 そのため、サイト間の連携をとる際には、提供者側が分かりきっている内
【海外事例に学ぶ】 リッチ化するフッター (ユーザビリティ実践メモ)
これまで当サイトでも、いくつかの記事でフッターについて扱ってきました。最近、海外のサイトを見ていると、フッターについて新しい取り組みが見られます。 今回は、海外サイトの動向をサンプルとし、フッターにおける新たな取り組みのメリットをご紹介します。 Geek Trends: 15 Footers with great usability ( pop upon magazine ) 6 Things To Include for a User Friendly Footer ( UXBooth ) Modern Sitemap and Footer ( WebDesignerWall ) Footers (76 examples) ( Smiley Cat Elements of Design ) 例えばTIGERS （http://www.tigers.org.au）のフッター(下図)では、革
FLASHユーザビリティ3原則 (ユーザビリティ実践メモ)
FLASHによるWebコンテンツは、ビジュアルでの表現力が高く、最近はサイト全体をFLASHで構築する例もかなり多くなってきました。しかし、通常のHTMLと比べてインターフェース作成の自由度が高いため、非常に使いにくいサイトになってしまう可能性もあります。 今回は、FLASHコンテンツを設計する上で気をつけたいユーザビリティ上の3つの原則をご紹介します。 ユーザがウェブサイトを利用する上で最も頻繁に利用するブラウザの機能が「戻る」です。 弊社で実施したユーザ行動観察調査では、FLASHコンテンツの場合でも一つ前の表示画面へと戻そうとする場合、ブラウザの「戻る」ボタンを押すケースが非常に多く見られます。これは、FLASH画面内に「戻る」ボタンが設置されていても同様でした。 この問題への対策として、「表示画面ごとにURLを設定する」ことが効果的です。ブラウザはURLでページを管理しているので、
Webページの情報を共有してもらうための３つのポイント (ユーザビリティ実践メモ)
複数の人が関わるシナリオを意識しよう Webサイトを訪れたユーザが、商品・サービスの購入など何らかの意志決定を行う際、自分ひとりだけの判断で決めず、他の人と相談してから決めるという場合は、実はかなり多いものです。 弊社のユーザ行動観察調査では、以下のような例が見られました。 幹事役の数名が、各自で会場候補を検索各自が自分の選んだいくつかの候補を持ち寄り、どの会場にするか相談決定 【例2．企業におけるIT製品の導入】 部門の担当者が、おおまかな要求仕様を決め、メーカーサイトや販売店サイトを検索性能や価格などを一覧できる比較表を作り、IT管理者などに相談（IT管理者がWebサイトを閲覧する場合もあります）絞り込んだ候補について決裁文書を作り、上司に相談決定 【例3．住宅ローンの借り換え】 妻が金融機関サイトや比較サイトで情報収集夫に相談して候補を絞り込む絞り込んだ金融機関の店舗を夫婦で訪れ、担
紙媒体との連携は大丈夫？ (ユーザビリティ実践メモ)
サイトへの集客のためにパンフレットを使っている、あるいはカタログ通販とECサイトを平行して運営し、注文をハガキ・電話よりもECサイト側で受けたいとお考えの方も多いかと思います。 そこで、今回は、どのようにすれば紙媒体からウェブへの誘導がうまくいくのかを考えてみたいと思います。 ある通販会社のカタログでは、カタログ内の「ご注文の仕方」のページや表紙からしかウェブへの誘導がなされていませんでした。 しかし、ユーザはそのようなページを見ることはあまりありませんし、わざわざカタログの表紙を調べてサイトを使うという行動も、ウェブを使おうという意思がある人でなければ行いません。 実際に、ユーザ行動観察調査であるカタログを見せたときに、「そのカタログのPC向けのウェブサイトはあるだろうと思っていたが、携帯サイトがあることは知らなかった」というようなユーザもいました。 サイトにユーザを引き込みたい、あるい
ECサイトで好まれる納期表現 (ユーザビリティ実践メモ)
オンラインで商品を販売するサイトでは、商品のお届け日がユーザのサイト利用に大きな影響を与えることがあります。 特に実際には素早く届けられる商品にも関わらず、お届け日の表現の仕方によっては、ユーザに正しく納期が伝わらず、ユーザが購入を断念するケースがよく見受けられます。 そこでどのような納期表現がユーザに好まれるのかを20人のユーザビリティテスト（ユーザ行動観察調査）を通じて検証しました。同じ納期を複数の表現で提示した場合、ユーザに好まれた順は以下のような結果となりました。 上記結果を踏まえ、納期表現のガイドラインは以下のようになります。 【納期表現の要件】 ・発送日ではなく、到着日の目処がつくこと(ベストは到着日が明記してあること) ・ユーザの慣れ親しんだ言葉を使うこと（「○営業日」よりも、「○日後」「今週中」など） ・極力納期が短く感じられるよう、ぱっと見の数字が小さい方を使う(「7日後
「ちら見せ」は逆効果？ (ユーザビリティ実践メモ)
コンテンツへの興味を喚起するためにその内容を一部露出させる、いわゆる「ちら見せ」施策を実施しているサイトも多いかと思います。今回は、その「ちら見せ」施策が逆効果となるケースについて考えます。 ところが、弊社でそのサイトのユーザ行動観察調査を行うと、ユーザはクチコミの最初の数行を数件読んだだけで満足し、会員登録することなくサイトを離脱する、という行動が頻発しました。 これでは逆効果です。 一般的に、クチコミや体験談を調べているユーザは、対象物・対象分野についての知識が少なく(時には不安も感じており)、「概要を把握したい」と思っています。そのため、クチコミを数件見渡して雰囲気を掴むとそれで満足してしまうのです。 このように「ちら見せ」が機能しづらい場合、どのようにすれば良いでしょうか。 有効な方法の一つは、ユーザに会員登録のメリットを体験してもらうことです。例えば、仮登録のような中間ステップを
その表現、ユーザに分かりやすいですか？ (ユーザビリティ実践メモ)
ユーザにとって分かりやすい文言・説明はウェブコンテンツ制作の基本です。 専門用語は思った以上にユーザに理解されていませんし、会社固有の名称・モデル名なども説明がなければユーザには何のことか分かりません。 最も個別製品ページへ進みたいと思うページはどれでしょうか。 例Aのように専門的な説明文章の場合はどうでしょうか。 専門用語が多く、各製品の違いを簡単には理解できません。 例Bでは、製品モデル名や型番のリンクのみを展開しています。 これではそれぞれの製品の違いが分からず、どの製品を見るべきかユーザはわからないため、ここで離脱してしまう可能性があります。 例Cが最も個別製品を選択しやすいのではないでしょうか。 価格、形、馬力といった大まかな情報があるため、各製品の違いが端的に分かり、詳細を確認するステップに進みやすくなります。 製品一覧ページに限らず、ユーザ（製品やサービスに詳しくない人）にと
左ナビと右ナビはどっちが良い？ (ユーザビリティ実践メモ)
ウェブサイトを設計する際に、ナビゲーションメニューを左右のどちらに設置するかで悩んだ経験はありませんか？ 弊社でウェブサイトを設計する際には、「コンテンツ」と「ナビゲーションによる誘導」のいずれが大事かによって設置位置を判断しています。 ■ナビゲーションによる誘導が重要な場合はナビゲーションを左に 例えばアマゾンなどの巨大ECサイトではナビゲーションによる誘導が重要であるため、ナビゲーションが画面から切れてしまうことのないよう、左側にナビゲーション設置しています。 上記のほかの考え方として、ユーザがそのサイトと同時に利用する競合サイトと同じ位置にナビゲーションを設置する、という考え方もあります（ユーザの慣れや先入観に配慮する）。 ナビゲーション設置時には「コンテンツ」と「誘導」のいずれが大事なのかによって設置位置を調整するようにしましょう。
フォームにおける「進む」ボタンと「戻る」ボタン。どのように配置する？ (ユーザビリティ実践メモ)
これまで実践メモではフォームを設計する際に注意すべき点をいくつかご紹介してきました。 フォーム設計についての記事一覧 今回はフォームによく出現する「進む（次へ）ボタン」と「戻るボタン」を配置する際に気をつける点を纏めました。 ウェブサイトにおいては「進む（次へ）」ボタンなど前進するものを右側に、「戻る」ボタンなど後退するものを左側に置くことが一般的になっています。 ユーザは多くのサイトを利用している中でこの配置に慣れていますので、配置が逆になっていると次へ進むつもりがうっかり「戻るボタン」を押してしまうことになりかねません。最悪の場合、これまで入力したものがクリアされてしまい、入力を一からやり直すはめになります。 そういう訳ですから、フォームのボタンを配置する際は「進む（次へ）」ボタンを右側に、 「戻る」ボタンを左側へと一般的な慣習に従う方がユーザに対して親切と言えるでしょう。 2.「
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
