確認画面で与える安心感 今回は確認画面よりも前に、同様の工夫が必要となるケースについて紹介します。 家電など比較的高価な商品を扱うECサイトやメーカー直販サイトでは、ユーザは一度の訪問で購入にまで至るとは限りません。 ある家電ECサイトでのユーザ調査において、ユーザは一通り商品情報を見て候補の商品を選択した後、価格をメモしてサイトを離脱し、比較のために他サイトを訪れる様子が多く観察されました。 この時のユーザ行動には 買い物かごまで行かない キャンペーン割引や購入特典をあまり意識しない という特徴が見られました。 はじめから他サイトと比較することを目的にサイトを訪れているため、商品の内容と価格を「だいたい」把握した段階でサイトから離脱してしまったのです。 この家電ECサイトではキャンペーン割引を用意しており、買い物かごに商品を入れたところでキャンペーン割引額が表示されるようになっていました

資料請求や申し込みフォームにおけるユーザの離脱を防ぐ方法はこれまでにもご紹介してきましたが、今回は「さらに一歩」改善するためのテクニックをご紹介いたします。 例えばECサイトのフォームでは支払い方法や配送方法など、ユーザに様々なオプションを選ばせることがよくあります。選択肢が多いことは利便性にも繋がりますが、一方でそれが離脱の原因になっている可能性もあります。 ユーザはフォームが縦に長かったり入力欄が多く見えると、「入力が面倒そう」と思い離脱の可能性が増えます。 以下は改善例です。支払い方法を選択するラジオボタンをクリックしてみてください。 選択したオプションに関連した情報だけを出す、言い換えると「要らないものは隠してしまう」のです。 クレジット決済をしたいと思っているユーザには、銀行振り込みや代金引換の注意書きは不要ですから、余計な情報を隠すことでフォームが簡単に見え、離脱を減らすことが

サイトを訪問したユーザに対して「キャンペーンの告知」や「新製品の訴求」、「おすすめサービスの宣伝」のように、サイト訪問目的と違う何かを伝えたいということはよくあるのではないでしょうか。 そういった場合に利用できるのが、完了画面やログアウト画面で訴求したいものを表示するという方法です。 目的遂行後に表示される完了ページやログアウト画面では、ユーザに「次は■■■■をする」といった明確な意思がないことが多く、サイトが訴求したいものを受け入れてくれることがあります。 以下は弊社が行ったユーザー行動観察調査で見られたユーザの行動例です。 あるECサイトでは新しく販売した製品をユーザに認知して欲しいという希望があり、トップページなど多くの画面で新製品を訴求していました。ただし、ユーザは自分が欲しいものの買い物に一生懸命なため、新製品の訴求に一向に気付きません。 そこで試してみたのが購入完了ページでの新

今読んでいる「Marketing Management」にこんな文章がある。 Customers buy benefits, not products. The benefits a customer receives from a firm's offering, less the costs he or she must bear to receive those benefits, determined the offer's value to the customer. 消費者が買うのは「商品」ではなく、「その商品を通して得られるもの」から「それを得るために払わなければならないさまざななコスト」を差し引いた「利益」である、という話。 ここで強く認識しておくべきなのは、その「コスト」とは単なる商品の購入のために支払うお金だけではなく、その商品を得るためにする労力（例：買い物に行く時間

ユーザから頻繁に問い合わせを受ける質問に対応するため、多くのサイトでは、「Q&A」や「よくあるご質問」といったFAQ（Frequently Asked Questions）コンテンツを用意しています。 今回はFAQを効果的に活用する見せ方について考えていきます。 FAQはユーザが持つ疑問の解決につながりますが、ユーザはサイトを利用するなかで、FAQをそれほど意識して探しにはいかないことに注意が必要です。 では、FAQはページのどこに配置するのがよいでしょうか。 ヘッダーエリアか、左右のナビゲーションにFAQのリンクが配置されているパターンを思い浮かべる方が多いでしょう。（図１） ユーザは、コンテンツエリアを中心に見ていくため、意識的に探さないとFAQがあることに気付きません。 サイトの共通要素として、問い合わせなどと同様、どのページにも同じ位置に配置すべきですが、それに加えて、コンテンツを

入力フォームについて、最近ではAjaxを用いることで、「送信」ボタンをクリックする前にエラーチェックをする手法が使われるようになっています。 今回はリアルタイムでフォームのエラーチェックを行う場合の注意点について考えてみます。 あまり良くない例：Remember the Milkの登録画面 http://www.rememberthemilk.com/signup/ ユーザ名を入力する欄では、入力と同時にエラーチェックが行われるため、多くの場合1文字目からエラーが表示されます。 2文字目を入力すると即座にエラーメッセージが更新されます。 ユーザが当初から自分のユーザ名として考えていた「bebittaro」を入力し終えると、利用可能である旨のメッセージが表示されます。 上記は入力に対しリアルタイムでフィードバックを返すことで誤入力を避けようという工夫ですが、ユーザが入力を終える前にエラー表示

アメリカのIT関連調査会社フォレスター・リサーチの調査結果(※1)によると、「ウェブサイトの失敗項目で最も多いものは、文字の可読性である」ということが指摘されています。確かに文字の可読性はユーザビリティの基本事項ですが、実際のところ、可読性はユーザ行動にどの程度影響を与えるのでしょうか？実例を交えてご紹介します。 弊社でユーザビリティテスト（ユーザ行動観察調査）を実施したところ、図1のパターンでは、ユーザは1ページ目の画面を一瞥しただけで閲覧をやめてしまいました。コンテンツの冒頭を読んでから判断したのではなく、全く読みもしなかったのです。その理由として、ほとんどのユーザが「なんとなく暗い感じがして、読む気がしないから」と回答しました。 背景色そのものにも原因はあったでしょう。しかし、ユーザに敢えてコンテンツを読んでもらったところ、「内容はとても面白い、商品に魅力を感じた」との回答が得られた

不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 いや、実際には使いますよ。 でも、わかって使わないと、ツールに騙される危険性がすごく高いと思います。あのアイトラッキングってツールは。 ヴィジュアライゼーションに騙されてるだけで、ログ解析だけでユーザーの意識や行動の意味がわかるって言ってるのと同じですから。 いや、ログ解析のほうがずいぶんマシです。そこそこのサイトであれば十分に統計的に意味のあるデータがとれますから。でも、多くて数十人しか対象にしないユーザビリティテストではそうした方向での分析じゃ意味がないと思います。 そうではなくて、目の動きっていったい何に関係あるの？ということを、他の行動分析と比較しながら、その関係性を読み解いていくことにこそ、アイトラッキングを使う意味はあるのだと思っています。 アイトラッキングをユ

『DESIGN IT! magazine』について 「DESIGN IT! magazine」は、ビジネスを革新し、よりよい社会を実現するために「情報技術（IT）」とITを取り巻く「情報環境」とをデザインしていく、あらたな潮流を作るための媒体、すなわち「デザインからIT を考えるビジネスマガジン」です。 Webサイトや業務システムのUI（ユーザーインタフェース）デザインの事例や考え方はもとより、国内外の役立つ情報とノウハウを伝えていきます。また、DESIGN IT! の共通テーマである「ストラテジー（S）、デザインマネジメント（DM）、ユーザビリティ（U）、インタラクション（Ix）、情報アーキテクチャ（IA）、コンテンツマネジメント（CM）」を機軸に据えながら、最新の実践例や実務情報を交えてご紹介して参ります。 発行：株式会社リックテレコム ICT出版部 監修：DESIGN IT!, LL

はてなスタッフのはてなのサービス全般に関する日記です。 人力検索はてなの告知については、人力検索はてなの日記にて行っています。 使い方に関するご質問、不具合報告やご要望は、お問い合わせ窓口で承ります。 使い方のコツなどを知りたい時は、人力検索はてなの「はてなの使い方」カテゴリーをご利用ください。 ※コメント欄へのご質問には対応できない場合がございますのでご了承ください。 2016年6月2日をもって「はてなクラブ」のサービス提供を終了いたします はてなでは、新しいサービスや新機能、新しいデザインなど開発中のサービスをユーザー様にご利用いただき、直接ご意見ご感想をお聞かせいただくためのサービスとして、「はてなクラブ」を提供しておりました。 こちらを、2016年6月2日をもって、サービスの提供を終了させていただきます。これまで、サービス改善にご協力いただき誠にありがとうございました。 また、はて

不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 『ペルソナ作って、それからどうするの？』の第1章では、「デザインって何なのでしか？」という問題の整理をスタート地点にして、「ウェブの制作とデザイン」、「創造性とデザインの方法」、「ユーザーの行動とデザイン」、「ウェブサイトをデザインする際の境界線問題」と話を進め、現在のウェブデザインの問題点と課題を整理・指摘しています。 それを受けた第2章は「ペルソナ／シナリオ法とウェブデザイン」と題して、＜「誰のためのデザインなのか？」という疑問に対して「誰のどんな問題を解決するのか」を明示するデザイン手法がペルソナ／シナリオ法＞を紹介するとともに、「ユーザビリティとペルソナ」、「ユーザーエクスペリエンスとペルソナ」、「ペルソナを用いてインタラクション･デザインを考える」など、ペルソナ／

上記の映像は、本研究会の構成員である静岡県立大学の石川准教授にご協力いただき、本研究会報告書（製本版）の添付CD-ROMに収録されているものです。 （平成18年1月17日掲載分） ＜視覚障害者（弱視）のホームページ利用方法（4分40秒）＞ （伊敷 政英 氏） ○動画（ブロードバンド用）　　○動画（ナローバンド用） ＜肢体不自由者のホームページ利用方法（5分15秒）＞ （平野 忠雄 氏） ○動画（ブロードバンド用）　　○動画（ナローバンド用）

CSS Nite Vol.3に寄せられたご質問のなかから、最も興味深い質問として、shuburnさまのお書きになった以下のご質問を選ばせていただきました。 今、Web標準の次のステージを考えています。現在、Web標準に準拠した日本のWebサイトはまだ多くはありませんが、大手ポータルサイトが準拠し出したら急激に普及しそうです。2006年は本当の意味でWeb標準元年になるのかも知れません。 Q：そこで木達さんに質問ですが、Web標準が当たり前な世の中になった時の戦略として何かお考えでしょうか？ 世の中のWebサイトがすべてXHTMLで書かれるようになったとき、もはや「Web標準」が売りにならなくなる前に我々は何処へ向かって行くのでしょうか。。 SEO（検索エンジン最適化）を例に考えてみますと、その主要な施策のなかには、一昔前であれば「適切なマークアップ」という項目が必ずといってよいほど含まれて

ユーザビリティの国際規格であるISO 13407（Human-centred design processes for interactive systems、日本語では「インタラクティブシステムのための人間中心設計プロセス」）というのがあります。＠IT情報マネジメント用語事典: 人間中心設計＠IT情報マネジメント用語事典: ユーザビリティで、現在、それが見直されてますが、そのサブ・コミッティ・チェアのTom Stewart曰く、 「近年、"ユーザーエクスペリエンス"という言い方が一般的に使われるようになってきたけど、"ユーザビリティ"と定義されていた概念に近いし、それ使ってもいいじゃん！（かなり意訳）」 ということで、新しい ISO 13407 は "usability" の代わりに "user experience" を使うらしい。Usability or user experienc