タグ

ブックマーク / www.bebit.co.jp (14)

  • iPadならではの特徴的なユーザ行動について (ユーザビリティ実践メモ)

    iPadのようなタブレット型のタッチUI端末では、PCでは見られなかった特徴的なユーザ行動が見受けられます。今回は、弊社の調査で見られたiPadにおける特徴的なユーザ行動と、デザイン上のポイントについてご紹介します。 【ポイント1】 ユーザはスクロールが苦ではない 弊社のユーザ調査にて、iPadで画面が切り替わる度にスクロールしてみようと画面をドラッグするユーザがよく見受けられました。ユーザは画面をスクロールしたがる傾向があるようです。 確かにiPad上で画面をスクロールすると、指に吸い付くようにスムーズに画面が動くため、直感的で心地よい感じがします。iPad上での快適なインタラクションは、ユーザにとってポジティブなフィードバックを与え、スクロールも苦になりにくいと考えられます。 情報は極力たくさん並べよう 調査で用いたショッピング用のアプリでは、iPadの縦1画面内におさまるだけの商品し

  • 【海外事例に学ぶ】フォーム入力におけるリアルタイムエラー表示のポイント (ユーザビリティ実践メモ)

    今回は、A List Apart掲載のルーク・ウロブレウスキ氏(※)による記事、“Inline Validation in Web Forms”をご紹介します。当記事のテーマは、フォーム入力中のリアルタイムエラー表示(インライン・バリデーション)方法の最適化についてです。 まずはフォーム入力におけるリアルタイムエラー表示がどのようなものか、以下のデモをご覧ください。 【動画】�:フォーム入力におけるリアルタイムエラー判定デモ 上記のようなリアルタイムエラー判定のできるフォームについて、ウロブレウスキ氏は21歳から49歳の22人の被験者でユーザ調査を実施しました。 すると、通常の入力フォームと比べ、入力の成功率が22%向上し、エラー率が22%減少、入力時間も42%減少したとのことです。さらに、調査結果からは次のような2つの知見が得られています。

  • コンバージョン直前のユーザがつまずきやすいポイント (ユーザビリティ実践メモ)

    コンバージョン率向上を考えた場合、エントリーフォーム最適化(EFO)など、フォーム内の改善に意識が向きがちですが、実はフォームに入る前の段階にも改善すべき点が残されている場合があります。 今回はフォームに入る前のページでよくみられる、ユーザのつまずきやすいポイントをご説明します。 ウェブサイトを訪問しているユーザにとって、個人情報の入力などの手続き行為は主目的ではありません。商品を購入したり、申し込み後にサービスを利用することが当の目的です。その目的に早く到達するため、手続き行為にはできるだけ手間をかけず、手早く終わらせようとする傾向が見られます。 ここで、注意が必要なのが手続きの途中に会員登録のステップがあるケースです。 ECサイトでは「購入」の手続きの途中で「既存/新規ユーザ」の振り分けが行われる場合がありますが、ユーザは手続きのステップとして「会員登録」が必要あることを必ずしも事前

  • ユーザを混乱させない表組みのコツ (ユーザビリティ実践メモ)

    ウェブサイト制作において、多くの情報をいかに整理してユーザに伝えるかは重要なポイントの1つです。よく使われる方法として表組みがありますが、今回は実際の事例をもとにしたケーススタディを通じて、ユーザを混乱させない表組みのコツをご紹介します。 表1はよく見かける表組みの例ですが、実際にユーザの立場に立ってこの表を使用してみると、いくつかの問題点があります。 同種の情報をユーザは区別できない 表1の問題点として、 日付という同種の情報を多く掲載しているため、ユーザには各情報が何の日付を意味しているのか区別できず、分かりにくい列数が多いために、セル内に折り返しが発生し、読みにくい ことが挙げられます。 特に、1つ目の問題点は、表が縦に長い場合にユーザを混乱させる要因の一つになります。なぜなら、画面サイズに収まりきらないほど表が縦に長い場合、下にスクロールしていくと「開催日」などの項目名が画面から消

  • プルダウンメニューのページ遷移は自動?手動? (ユーザビリティ実践メモ)

    プルダウンメニューで項目を選択して、ページ遷移(表示変化)を待っているが何も起きない。ユーザ行動観察調査ではこんな光景がよく見られます。 今回は、ページ遷移を伴うプルダウンメニューでよく見かける「ユーザのイメージと異なる挙動をする」設計について考えてみたいと思います。 プルダウンメニューで項目を選択し、次のページへ遷移するのを待っているが何も起きないプルダウンメニューで項目を選択すると、勝手に次のページへ遷移してしまい、違和感を感じた 特に日常的に使用されるサイトでは、ユーザの期待を裏切らない挙動が求められます。以下の例を参考に、ユーザ心理への配慮について考えてみたいと思います。 ページ遷移を伴うプルダウンメニューは、「Go」ボタンなどを設置し、ユーザに手動でページ遷移を行ってもらうのが一般的です。これは、ユーザが誤った項目を選択してしまった場合に、意図しないページに遷移してしまうことを防

  • 【○×】Q.ユーザが画像をざっと見て良し悪しを判断する商品の詳細ページでは、「左:画像、右:文章」、その下は「左:文章、右:画像」と、画像と文章を交互に配置したレイアウトとする方が、そうでない場合に比べて文章にも目を通してもらえる可能性が高い。○か×か?: beBit.Q

    【解説】写真画像で良し悪しを判断しようと考えているユーザの視線は、自然と画像と画像をつなぐ形で流れます。画像と文章を交互に配置することでユーザの視線が散らばり、スクロール速度も遅くなりやすいため、比較的文章にも目を通してもらいやすいレイアウトとなります。 解説詳細 例えば、セオリー通り情報が整理されたきれいなレイアウトを達成しようとすると、以下のようになります。 この場合ユーザは、気になる画像があれば横にある文章にも目を移しますが、基的にはすーっと下に向かって画像だけを眺めてスクロールするといった行動をとりがちです。 また、単調なレイアウトであるためにユーザのスクロール速度も速くなりがちです。 一方、画像と文章を交互に配置したレイアウトでは、ユーザの視線は以下のように散らばってくれる可能性が高くなります。 この場合はユーザが画像から画像に視線を移すタイミングで自然と文章が視野に飛び込んで

  • カードを使って簡単にユーザニーズを探る方法 (ユーザビリティ実践メモ)

    「サイトの画面設計やデザイン性はそれなりに良いのだが、肝心の中身、コンテンツが足りていないので強化したい。けれどどんなコンテンツがユーザから求められているのか分からない…。」 今回はそんな時に役立つ調査手法の1つとして、「カードソーティング」をご紹介します。 メリット この手法の最大のメリットは、実際に物を作る前であっても、ユーザの行動観察ができることです。 カードという刺激物を与えて、それに対してユーザがどのように行動するかを見ることができるため、「どんなものが見たいですか?」、「○○というコンテンツがあったら見たいですか?」といったインタビューよりもはるかに意味のある検証が可能です。 また、ユーザと面しているため、仕分け結果の理由をすぐに尋ねることができるのもメリットです。具体的にどのようなものを期待したのか、なぜ見たくないのかなどを尋ねられるため、その場で疑問を解消し、さらに深掘りす

  • 「お待たせしない」Webサイトでの接客 (ユーザビリティ実践メモ)

    1990年代、電話回線やISDNを使ったダイヤルアップ接続(低速・時間課金)でインターネットに接続することが一般的だった頃は、Webサイトの利用は「時間との勝負」という側面がありました。そのためWebサイトを制作する際も、htmlファイルや画像などを含めたページ当たりのサイズを小さくしてページの表示速度を高め、ユーザを待たせないことが重要視されていました。 ■人間の思考とシステムの反応速度 人間の操作に対するシステムの反応速度については、一般的に次のような関係が見られると言われています。 (参考:「Response Times: The Three Important Limits」 Useit.com(英語)、「10の累乗: ユーザーエクスペリエンスにおける時間スケール」 Jakob NielsenのAlertbox(日語)) 0.1秒:ユーザは、自分がシステムを「直接」操作していると

  • テキストメールを作成する際の注意点 (ユーザビリティ実践メモ)

    メールマガジンは新製品・サービスの案内やキャンペーン告知など、ユーザとの長期的な関係性を構築する重要なチャネルとして重要視されています。 今回はテキストメールを配信する際に注意すべき事項を3点紹介いたします。 1.「タイトル」や「リンクへの誘導文言」にユーザへのメリットを明示する 1日に何通ものメールを受信するユーザは、1つ1つのメールにかける時間を短縮するため、メールの中で目立つ「タイトル」や「リンク部分」のみを閲覧し、それ以外の部分は飛ばし読みする傾向があります。 そのためユーザに伝えたいことは、必ず「タイトル」や「リンク部分」にも盛り込むことが重要になります。 2. 1行を全角35文字以内に収める 多くのメールソフトにおいて、横幅のデフォルト設定は36~38文字となっています。それ以上に横幅が長いメールを配信すると、表示が崩れてしまいますので、メール文面において1行は全角35文字以内

  • http://www.bebit.co.jp/bbq/images/drill_2009_0907_1009.pdf

    nakanushi
    nakanushi 2009/10/30
    ユーザビリティまとめ
  • 新卒採用ページ、本当に学生視点ですか? (ユーザビリティ実践メモ)

    2011年の新卒採用活動に向けて、採用ページをリニューアルしたり、コンテンツを拡充したりする企業サイトが多くなっています。今回は、新卒採用ページを「学生視点」で作るためのポイントについて考えたいと思います。 ただその場合でも、掲載コンテンツを当に有効なものとするには、学生の目線に立っているかどうかをチェックしてみる必要があります。 例えば、職種の紹介として、以下のような例があった場合、どちらがイメージしやすいでしょうか? 例Aに関しては、その職種に関する業務知識がないと、内容をイメージすることは難しいですが、例Bについては、1日の流れをイメージできたのではないでしょうか。 学生は業務経験がなく、社会人にとっては常識的な業務知識もないことがほとんどです。そのため、業務知識がないユーザも理解できるような配慮が求められます。(上記では「タイムスケジュールにする」、「解説をつける」、「画像で補足

  • 初心者でも使えるサポートページの作り方 (ユーザビリティ実践メモ)

    お問い合わせコストを節約するため、ウェブサイトに「よくあるご質問」や「アフターサービス情報」等を豊富に掲載して、ユーザの自己解決を促すケースが多くなってきています。 一方で、インターネットに不慣れなユーザ(以下:初心者)が利用するにはハードルが高いサポートページも多く存在します。 今回は、特に初心者向けにサポート情報を提供する際のポイントをご紹介します。 サポート情報を提供する上で最も重要なことは、ユーザが目的の情報にスムーズにアクセスできるようにすることです。そこでサポートページでは、「一道で目的の情報にたどり着ける」ように導線設計をすることが重要です。 一般的には、「商品カテゴリから探す」、「型番から探す」、「よくあるご質問から探す」など、色々な探し方が出来たほうが、ユーザビリティーが高い傾向があります。しかしこの一般則は、初心者がサポートページを利用する場合には必ずしも当てはまりま

    nakanushi
    nakanushi 2009/10/14
    一本道で目的の情報にたどり着ける/導線に強弱をつけて、まず「選んでもらいたい探し方」をユーザに提案する/アイコンやイラスト、配色などを活用して、難しいという印象を和らげる
  • 成果につながるフォーム最適化 - シナリオの重要性 (ユーザビリティ実践メモ)

    また、サイトのコラムや実践メモでも、フォームの最適化については何度も述べてきました。 【ユーザビリティコラム】登録フォームのユーザビリティ 【ユーザビリティ実践メモ】フォームに関する記事一覧 フォームはユーザがアクションを行うために通過が必要な最後の砦であり、非常に重要な領域です。しかしながら、サイトはフォームが全てではありません。 あるサイトのフォームは、ユーザビリティは十分高いと思われるにもかかわらず、リスティング広告から入ってきたユーザのフォーム通過率は10%以下という状況でした。 そこで、ユーザがフォームに至るまでの過程を調べると、次のような課題が発見されました。 課題1. サイトに入ってくるユーザ全員に対して、同じ受け方を行っていた あらゆるリスティングのキーワードに対して、同じページを受けページとして設定していたのですが、実際にはキーワードによって、ユーザの状況は下記のように

  • 入力フォームのコンプライアンス文言はどう配置する? (ユーザビリティ実践メモ)

    会員登録フォームや資料請求フォームでの入力作業は、多くのユーザにとって面倒で煩わしい作業です。フォームをできるだけ「簡単そう」、「手軽そう」な印象にすることは、ユーザの心理的負担を軽減するうえで重要です。 ただ、ユーザに対して丁寧に注意文言を提示すればするほど、まとめて無視されてしまったり、「簡単そう」な印象から離れて威圧感のあるページとなってしまうなど、適切にユーザに情報を伝えるという来の意図から外れてしまいます。 今回はユーザの心理的障壁を高めることなく、コンプライアンス文言を適切に配置する方法を考えてみたいと思います。 1)注意文言をリンクにする 情報量の多い注意文言はリンクにすると必要なスペースが少なくて済むため、見た目の威圧感を低減するとともに、まとめて無視されてしまうリスクも低減します。また、必ずしも全ユーザに確認してもらう必要のない重要度の低い注意文言に関しては、まとめてペ

  • 1