<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>ユーザビリティ | マミオン有限会社-パソコン・数学研修、法人研修</title>
	<atom:link href="https://mamion.net/category/usability/feed/" rel="self" type="application/rss+xml" />
	<link>https://mamion.net</link>
	<description>大人向けのパソコンおよび数学研修を実施。対面、オンライン対応。コンテンツ提供なども</description>
	<lastBuildDate>Tue, 12 Jun 2018 04:23:29 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.4</generator>
	<item>
		<title>こう見たか！シニアの動画視聴をアイトラッキングしてみた</title>
		<link>https://mamion.net/2015/07/%e3%82%b7%e3%83%8b%e3%82%a2%e3%81%ae%e5%8b%95%e7%94%bb%e8%a6%96%e8%81%b4%e3%82%92%e3%82%a2%e3%82%a4%e3%83%88%e3%83%a9%e3%83%83%e3%82%ad%e3%83%b3%e3%82%b0/</link>
		
		<dc:creator><![CDATA[staff]]></dc:creator>
		<pubDate>Thu, 30 Jul 2015 01:03:37 +0000</pubDate>
				<category><![CDATA[アイトラッキング]]></category>
		<category><![CDATA[ユーザビリティ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=10668</guid>

					<description><![CDATA[<p>先日、とある企業のご依頼を受け、CMアイトラッキング調査を行った。 ※アイトラッキングとは、赤外線で人の視線を可視化する機械のこと。 ※パソコン上で番組や該当CMなどを見ていただく調査を行った。 今回の被験者さんは５０歳 [&#8230;]</p>
The post <a href="https://mamion.net/2015/07/%e3%82%b7%e3%83%8b%e3%82%a2%e3%81%ae%e5%8b%95%e7%94%bb%e8%a6%96%e8%81%b4%e3%82%92%e3%82%a2%e3%82%a4%e3%83%88%e3%83%a9%e3%83%83%e3%82%ad%e3%83%b3%e3%82%b0/">こう見たか！シニアの動画視聴をアイトラッキングしてみた</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p><img fetchpriority="high" decoding="async" src="//mamion.net/wp/wp-content/uploads/tv.jpg" alt="tv" width="640" height="232" class="alignnone size-full wp-image-10670" srcset="https://mamion.net/wp/wp-content/uploads/tv.jpg 640w, https://mamion.net/wp/wp-content/uploads/tv-300x109.jpg 300w" sizes="(max-width: 640px) 100vw, 640px" /></p>
<p>先日、とある企業のご依頼を受け、CMアイトラッキング調査を行った。<br />
※アイトラッキングとは、赤外線で人の視線を可視化する機械のこと。<br />
※パソコン上で番組や該当CMなどを見ていただく調査を行った。</p>
<p>今回の被験者さんは５０歳代、６０歳代の女性４名。</p>
<p>そこから得られた気付きはとても多く、改善に繋がる気付きを得ることができた。</p>
<p>今回の調査では、いくつかダミーとして健康食品のCM、テレビショッピングのCMを入れておいた。<br />
そこから得られた「シニアの動画の見方」について解説していこうと思う。<br />
（本来であれば動画をアップしたいのだが、肖像権の問題があると思うのでそこからの気付きだけでご容赦ください。）</p>
<h3>CMは意識してみるものではない。</h3>
<p>ウェブサイトが能動的に見なくてはいけない一方で、テレビは、基本受動的に見ている。<br />
特にCMについては流し見ることが多い。</p>
<p>そのため、そのCMが自分に関係がありそうか、<br />
それが直接すぐに自分に伝わってくるかで、見る意識が変わる。</p>
<p>最初に何の商品紹介か解るとその後も見続けようとするし、<br />
すぐに何のCMか理解できないとすぐに飽きてしまう。</p>
<p>動画だけではなく、ウェブサイトでも、何もかもいつもそう思っているが、<br />
人は、考えない。</p>
<p>これは決して、悪い意味ではなく、世の中にはいろいろ考えなくてはいけないことが多すぎて、CMや情報番組について、深く考えることはない、ということである。</p>
<p>その商品や買い物行動に興味を持つのは、<br />
「今見ている情報は自分に必要か、不必要か」という瞬時の判断である。</p>
<p>それでは、自分に必要なものである、と判断してもらうためにはどうすればいいか。</p>
<p>被験者の方の目線を追っていて思ったことは、<br />
情報はシンプルに。そして、情報の粒を大きくしすぎないこと。（個人サイズにすること）<br />
健康食品のCMは、その点、「食べて健康」「まずは電話」<br />
その2点のみのシンプルな情報を解りやすく説明しており、<br />
被験者の方にも「解りやすい」と思われた。</p>
<h3>人の顔を見ている・文字情報は重要</h3>
<p>アイトラッキング調査を行って、改めて実感したのは「人は、人の顔を超見る！」ということであった。</p>
<p>出演者の顔をじっと見て、手の動きや顔の向きによって目線を動かす。<br />
ということは、同時にいくつも重要なことがテロップなり、演技なりで示されると何を見ていいのか解らず混乱してしまう。</p>
<p>健康食品のCMでは、登場人物が飲み終わって正面を向いたときに<br />
その効果がテロップとして出てくる。<br />
すると、人は、人の顔を見ているがゆえに、その効果・効能の部分に絶対に目が行くのである。</p>
<p>また、テレビショッピングのCMでは、正面を向いて話している人の内容がテロップに出るのだが、<br />
その人がテロップに手を動かすことにより、<br />
耳からも、目からも「重要な」情報をしっかり認識することができていた。</p>
<p>動画では、文字と人の動きとの兼ね合いがとても重要である。</p>
<p>常々、人に考えさえないということを考えているが<br />
今回はCMという、ユーザーと距離が遠いものであったので、<br />
より、考えさせずに、寄り添うということがとても重要だと感じた。</p>
<p>また、動画だからこそ、ついつい見てしまうということもあるため、<br />
そのストーリー、目や手の動きを含めた演技力はCMの反応を左右すると思う。</p>
<p>動画の人気がシニアに根強いからこそ、動画での商品紹介などを考えている場合には、一度ユーザーの目線を確認してもいいかもしれない。</p>The post <a href="https://mamion.net/2015/07/%e3%82%b7%e3%83%8b%e3%82%a2%e3%81%ae%e5%8b%95%e7%94%bb%e8%a6%96%e8%81%b4%e3%82%92%e3%82%a2%e3%82%a4%e3%83%88%e3%83%a9%e3%83%83%e3%82%ad%e3%83%b3%e3%82%b0/">こう見たか！シニアの動画視聴をアイトラッキングしてみた</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>シニアと入力フォーム、記入申込用紙の話</title>
		<link>https://mamion.net/2015/03/%e3%82%b7%e3%83%8b%e3%82%a2%e3%81%a8%e5%85%a5%e5%8a%9b%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%80%81%e8%a8%98%e5%85%a5%e7%94%b3%e8%be%bc%e7%94%a8%e7%b4%99%e3%81%ae%e8%a9%b1/</link>
		
		<dc:creator><![CDATA[staff]]></dc:creator>
		<pubDate>Mon, 16 Mar 2015 01:16:35 +0000</pubDate>
				<category><![CDATA[シニア対応]]></category>
		<category><![CDATA[ユーザビリティ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=10564</guid>

					<description><![CDATA[<p>シニア層でなくとも、入力フォームや申込書に記入というのは面倒くさいものだ。 私自身、色々なウェブサービスに登録しているが、色々入力しなくてはいけないサービスの時には登録が面倒くさくなり、必要度合いに応じて操作をやめること [&#8230;]</p>
The post <a href="https://mamion.net/2015/03/%e3%82%b7%e3%83%8b%e3%82%a2%e3%81%a8%e5%85%a5%e5%8a%9b%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%80%81%e8%a8%98%e5%85%a5%e7%94%b3%e8%be%bc%e7%94%a8%e7%b4%99%e3%81%ae%e8%a9%b1/">シニアと入力フォーム、記入申込用紙の話</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/PH184_096-640x427.jpg" alt="PH184_096 (640x427)" width="640" height="176" class="alignnone size-full wp-image-10573" srcset="https://mamion.net/wp/wp-content/uploads/PH184_096-640x427.jpg 640w, https://mamion.net/wp/wp-content/uploads/PH184_096-640x427-300x83.jpg 300w" sizes="(max-width: 640px) 100vw, 640px" /></p>
<p>シニア層でなくとも、入力フォームや申込書に記入というのは面倒くさいものだ。</p>
<p>私自身、色々なウェブサービスに登録しているが、色々入力しなくてはいけないサービスの時には登録が面倒くさくなり、必要度合いに応じて操作をやめることがある。<br />
どうしても利用が必要であれば入力するし、必要度が高くなければ「いつ登録しよう」と思ってブックマークする。<br />
そして、そのまま忘れてしまったりもする。そういうブックマークが溜まり、年に1回処分する。</p>
<p>紙の申込書も同様だ。<br />
見た瞬間、面倒くさそうかつ、重要度が低そうな申込用紙は、明日書こう、明日書こうとそのまま〆切を迎える。（そして出さない←反省）<br />
相手にとっても必要だったら、きっと提出を促される。それまで出すのをやめてしまおう。<br />
もちろん、必要なものは提出する。もし、まちがっていたらきっと不備で返ってくる。<br />
記入があまり考えなくていいものについては、早く処理したいので、素早く書いて直ぐに返送する。</p>
<p>そういう大雑把なのは私だけかと思いきや、先日、記入式申込書のユーザーテストを行ったところ同じようなご意見がシニアから発せられた。（私もシニアの仲間入りかもしれないが）</p>
<p>「紙の申込書を書くときは基本対面じゃなくちゃやらない。間違ったら面倒だから」<br />
「ダメだったら向こうから言ってくるから別にいいよ」<br />
「ウェブで申し込み中に解らなくなったら電話が一番だよね！」<br />
「面倒くさくなったら申し込まない」</p>
<p>そういうものなのだ。<br />
もちろん、丁寧な人も多い。〆切をきちんと守る人もたくさんいる。</p>
<p>しかし、年齢を重ねるにしたがって、入力フォームや申込用紙の文字を見るのも面倒になり<br />
どんどん先延ばしにしていく、または、頑張って入力しても間違えが増える傾向があるように見える。</p>
<p>今回は、先日のユーザーテストから得られた<br />
入力フォーム・記入フォームかくあるべし、という原則についてメモをしておく。</p>
<h3>購買者の情熱を失わせない・先延ばしにさせないことを意識</h3>
<p>これは弊社有するパソコン教室内での会話だが、<br />
スタッフとお客様がとある商品について盛り上がっており、それはどこで買えるのか？という話になった。</p>
<p>「ネットで買えます」と案内したところ「amazonでも買える？」と。<br />
「多分、、私は違うところで買いましたが」とスタッフ。<br />
すると、ご年配のお客様は「新しいところで買うと、色々入力しなくちゃいけないし、面倒くさいのよね」と一言。</p>
<p>入力すること、記入することは、面倒くさい。<br />
老眼鏡を取り出さなくてはいけないし、字は小さいし。<br />
しかし、それ以上にその商品を欲しいのである。それは、情熱である。</p>
<p>つまり、入力フォームや申込用紙が目の前に存在している状態とは、そこまで情熱が保たれているということなのである。</p>
<p>だが、万が一、それが「面倒くさそうな」入力フォームだったり、申込用紙だったりした場合、そして、その情熱が「面倒くささ」によって溶けてしまった場合、「ま、今はちょっとバタバタしてるし、明日でもいいか」になり、「明後日でもいいか」「そしていつか」になってしまうのである。</p>
<p><a href="//www.amazon.co.jp/gp/product/4887595425/ref=as_li_ss_il?ie=UTF8&camp=247&creative=7399&creativeASIN=4887595425&linkCode=as2&tag=oribito-22"><img decoding="async" border="0" src="//ws-fe.amazon-adsystem.com/widgets/q?_encoding=UTF8&ASIN=4887595425&Format=_SL250_&ID=AsinImage&MarketPlace=JP&ServiceVersion=20070822&WS=1&tag=oribito-22" ></a><img decoding="async" src="//ir-jp.amazon-adsystem.com/e/ir?t=oribito-22&l=as2&o=9&a=4887595425" width="1" height="1" border="0" alt="" style="border:none !important; margin:0px !important;" /></p>
<p>だからこそ、申込用紙・入力フォームの見た目はとても重要だ。<br />
面倒くさいと思ったらすぐに後回しにされる。</p>
<p>入力が「面倒くさそう」と思われたら、そのページでの「買いたい」情熱は目減りする。<br />
もし、かご落ちが多いならば、見た目の面倒くささが無いか見直した方がいい。</p>
<p>申込用紙も、入力フォームもシンプルに、考えなくても＝自分の知っている知識の範囲内で無理なくすぐに記入できそうかどうか、そこがまず第一の関門である。</p>
<h3>自分の知識で入力・記入ができる</h3>
<p>申込用紙のユーザーテストをやっていて、驚いたのはこの部分である。<br />
周りにある説明は一切読まない。<br />
「文字の大きさが問題か」ということもあったが、そうではない。</p>
<p>人は、読まない。</p>
<p>「こういうのね、大体大丈夫」と、書き進める。<br />
内容があっている（つまり制作者の意図に沿っている）かどうかは別問題である。</p>
<p>迷ったら、その周辺を見る。<br />
たとえ、申込用紙のトップの部分にたくさん注意事項が書いてあっても、<strong>「それは自分の問題ではない」</strong>と認識する。だから、読まない。</p>
<p>そして、「こういうのはね、読まなくていいって思う。保険の約款みたいに、読んでも仕方ないことが書いてあるイメージ。」<br />
それが記入上の注意であってもだ。文字が並んであるだけで「約款」扱いになる。<br />
何度繰り返し注意書きがあっても、見なくていいと判断されたものは、目に入らない。<br />
（本当は約款は読むべきものですが。）</p>
<p>以下はその時の私が自分の手帳に書いたメモ。</p>
<blockquote><p>「大切なことは何度も言いたくなるが、何度も言われていると聞き流したり、読み流したりして伝わらないということ。いずれにせよ、相手にとって大切じゃなければ、自分にとって大切なことはまったく伝わらない。」</p></blockquote>
<p>なので、注意書きが無くとも、なるべくユーザーが持っている今までの知見（つまり、できるだけ一般的に使われている項目で）で目的が達成できることが重要なのである。特に紙の申込用紙。</p>
<p>ウェブであれば、共通の知見があまりない。<br />
そういう時はとにかく記入例は該当フォームの近くに置く。<br />
困った時はその近くしか見ない。ましてや、ページトップには戻らない。</p>
<p>ページトップを読んでから入力しないの？と思われるかもしれないが、<br />
まあ、読まれない。目を通しているかもしれないが、読んでいないし、覚えていない。</p>
<h3>不備はどこが不備なのかをしっかり連絡！そしてフォローも</h3>
<p>「困ったら　助けてもらおう　ホトトギス」</p>
<p>たいてい、困った時には誰かが助けてくれる。<br />
それは、夫だったり、子どもだったり、サポートセンターだったり、私だったり。</p>
<p>しかし、自力でやりたくなるほど「今欲しい！」があり、かつ、入力・記入に不備があった場合。</p>
<p>・ウェブであれば、まずはエラーがどこなのか解りやすくすることが必要だ。<br />
トップにまとめて書くなど論外、次のページで表示されてその場で直せないのもダメ。<br />
間違っているところがありますと表示もされず、元の画面に戻らせて<br />
「なんかおかしい、前に進まない」とユーザーから台詞が出てくるのもダメ。<br />
と、色々改善できるポイントがある。</p>
<p>・申込記入用紙の場合は、不備がその場では見つからない。<br />
そのため、最大のフォローが「解らないときに電話してもらうこと」になる。<br />
電話番号、営業時間は大きく書くことが必要。</p>
<p>「前に進まないせいで情熱を削がれた」ということだけは避けたい。</p>
<h3>制作者は覚悟する。人は間違える、間違えることを責めてはいけない。</h3>
<p>教えていて思うのが、「人は間違える」。<br />
いや、間違えるという言葉すら間違っているのかもしれない。</p>
<p>人は、制作者の思惑通りには動かない。というのが正しい。<br />
制作者にとっては間違いだが、ユーザーは「私は正しい」と思っていることが多い。<br />
だから、そこに溝が生じる。</p>
<p>制作者はユーザーがもっと考えてくれることを期待するし、<br />
ユーザーは、使った後に得られるものが欲しいだけであり、手続きや申込に情熱を感じない。<br />
（反対に、「商品が手に入れられるかなんか興味ないっ！このカートを使いこなしたいっ！」という人がいたら微妙。）</p>
<p>だから、間違えてもしょうがないのだ。<br />
そして、読まない限り、自分のルールでやろうとする人が多い限り、間違えられても仕方ないのだ。<br />
制作者は、そこを覚悟しなくちゃいけない。</p>
<p>「なんでユーザーは間違えるんだ！」「何でよく読まないんだ！」なんてゆめゆめ思ってはいけない。</p>
<p>とにかく、間違いやすいポイントを探しだし、間違いを軽減させ、ストレスを溜めこまさない入力フォームや申込用紙への改善が必要なのだ。</p>The post <a href="https://mamion.net/2015/03/%e3%82%b7%e3%83%8b%e3%82%a2%e3%81%a8%e5%85%a5%e5%8a%9b%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%80%81%e8%a8%98%e5%85%a5%e7%94%b3%e8%be%bc%e7%94%a8%e7%b4%99%e3%81%ae%e8%a9%b1/">シニアと入力フォーム、記入申込用紙の話</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>こんなにあった！シニア対応を本気で進める『皇潤』の入力フォームが使いやすい理由</title>
		<link>https://mamion.net/2014/12/%e7%9a%87%e6%bd%a4%e3%81%ae%e5%85%a5%e5%8a%9b%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%8c%e4%bd%bf%e3%81%84%e3%82%84%e3%81%99%e3%81%84%e7%90%86%e7%94%b1/</link>
		
		<dc:creator><![CDATA[stj064]]></dc:creator>
		<pubDate>Tue, 16 Dec 2014 00:09:42 +0000</pubDate>
				<category><![CDATA[シニア対応]]></category>
		<category><![CDATA[ユーザビリティ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=10456</guid>

					<description><![CDATA[<p>シニアがウェブサイトを利用する際の大きなハードルの一つが、各種「入力フォーム」です。 一般的にシニアの方ほど入力に時間がかかり、また不適切な入力によるエラー発生頻度も高くなることは、ユーザビリティ業界の権威であるニールセ [&#8230;]</p>
The post <a href="https://mamion.net/2014/12/%e7%9a%87%e6%bd%a4%e3%81%ae%e5%85%a5%e5%8a%9b%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%8c%e4%bd%bf%e3%81%84%e3%82%84%e3%81%99%e3%81%84%e7%90%86%e7%94%b1/">こんなにあった！シニア対応を本気で進める『皇潤』の入力フォームが使いやすい理由</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p>シニアがウェブサイトを利用する際の大きなハードルの一つが、各種「入力フォーム」です。</p>
<p>一般的にシニアの方ほど入力に時間がかかり、また不適切な入力によるエラー発生頻度も高くなることは、ユーザビリティ業界の権威である<a href="//www.nngroup.com/reports/senior-citizens-on-the-web/">ニールセンノーマングループのレポート</a>も統計データを用いて指摘しています。</p>
<p>シニアをターゲットとしたウェブサイトの多くはこうした状況を考慮して、入力フォームのシニア対応に力を入れているところが多いのですが、その中でも私個人から見て特に完成度が高いと感じているのが、健康食品の『皇潤』で有名な<a href="https://www.everlifegroup.jp/">エバーライフ</a>です。</p>
<p><a href="//mamion.net/wp/wp-content/uploads/141215_ever0.png"><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever0.png" alt="141215_ever0" width="480" class="alignnone size-full wp-image-10465" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever0.png 967w, https://mamion.net/wp/wp-content/uploads/141215_ever0-145x300.png 145w" sizes="(max-width: 967px) 100vw, 967px" /></a></p>
<p>今回、そのエバーライフの入力フォームで実装されている様々なシニア対応施策について、実装方法まで含めて詳しくご紹介していこうと思います。</p>
<blockquote><p>1. 各フォームがそこそこ大きく見やすい<br />
2. 必須項目表示がわかりやすい<br />
3. ふりがなが自動的に入力される<br />
4. 住所が自動的に入力される<br />
5. 電話番号欄には数字以外入力できない<br />
6. 生年月日の初期値が50歳に指定されている<br />
7. メールアドレスの補完機能がある<br />
8. エラー入力へのフィードバック内容が具体的<br />
9. 「次へ」ボタンを押すと、間違った項目だけを表示してくれる</p>
<p>補足ポイント<br />
・姓名、郵便番号のフォームを統合する<br />
・全角/半角の自動修正を行う<br />
・誤って「戻る」を押した際の確認メッセージを出す
</p></blockquote>
<p>&nbsp;</p>
<h3>1.各フォームがそこそこ大きく見やすい</h3>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever1.png" alt="141215_ever1" width="640" class="alignnone size-full wp-image-10466" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever1.png 741w, https://mamion.net/wp/wp-content/uploads/141215_ever1-300x85.png 300w" sizes="(max-width: 741px) 100vw, 741px" /><br />
こちらは一般的に見かける入力フォームより、フォームの枠、フォント共に大きめにとられています。</p>
<p>どれほど大きくしているかと言うと、具体的には、フォントサイズが140%（17px）、フォームの縦幅が28pxに指定されていました。入力フォームでは、入力した文字の目視確認作業を行う必要があるため、通常よりも大きなフォントを用いるとよいでしょう。</p>
<p>&nbsp;</p>
<h3>2.必須項目表示がわかりやすい</h3>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever2.png" alt="141215_ever2" width="415" height="266" class="alignnone size-full wp-image-10467"/><br />
必須項目の表記は、しっかりと目立つ白抜きテキストで「必須」と書かれおり、わかりやすくなっています。</p>
<p>よくある※印等では必須入力項目ということがほとんど伝わらないため、それぞれの項目ごとにテキストで「必須」と表示することは入力フォームの基本ですね。</p>
<p>&nbsp;</p>
<h3>3.ふりがなが自動的に入力される</h3>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever3.png" alt="141215_ever3" width="640" class="alignnone size-full wp-image-10468" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever3.png 734w, https://mamion.net/wp/wp-content/uploads/141215_ever3-300x84.png 300w" sizes="(max-width: 734px) 100vw, 734px" /><br />
名前欄に漢字で入力を行おうとすると、すぐ下のふりがな欄にも同時に文字が入力されていきます。</p>
<p>この後に続く住所自動入力機能とともに、キーボード入力の苦手なシニアにとっては、こうした配慮はとても嬉しいものです。</p>
<p>こちらのサイトでは、以下のJavaScriptで実装しているようです。</p>
<p><a href="//mashimonator.weblike.jp/library/2009/10/javascript-14.html">[JavaScript] フリガナを自動挿入する</a>（Development Reference）</p>
<p>またふりがなの自動入力に関するJavaScriptは、jQueryも含めて様々公開されています。</p>
<p><a href="//qiita.com/u-chida/items/6c07d558b3f06c9ed8d8">JavaScript - jquery.autoKana.jsで自動カナ入力する</a>（Qiita）</p>
<p>&nbsp;</p>
<h3>4.住所が自動的に入力される</h3>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever4-1.png" alt="141215_ever4-1" width="640" class="alignnone size-full wp-image-10469" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever4-1.png 920w, https://mamion.net/wp/wp-content/uploads/141215_ever4-1-300x161.png 300w" sizes="(max-width: 920px) 100vw, 920px" /><br />
郵便番号に数値を入力していくと、3ケタを入力した時点でこちらの画像のように右側に候補地のリストが表示されます。</p>
<p>ここでマウスを使って選択することも可能ですし、さらに続けて7ケタ全てを打ち込めば、下の住所フォームに該当の住所が自動的に入力されます。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever4-2.png" alt="141215_ever4-2" width="640" class="alignnone size-full wp-image-10470" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever4-2.png 784w, https://mamion.net/wp/wp-content/uploads/141215_ever4-2-300x120.png 300w" sizes="(max-width: 784px) 100vw, 784px" /></p>
<p>住所自動入力の　こちらのサイトでは、ajaxzip3を用いて実装しているようです。</p>
<p><a href="https://code.google.com/p/ajaxzip3/">ajaxzip3</a>（Google Project Hosting）</p>
<p>また住所の自動入力に関するJavaScriptについても、様々公開されています。</p>
<p><a href="//zipaddr.com/">郵便番号から住所を自動入力する操作性が世界一簡単なZipAddr</a>（ピエールソフト）<br />
<a href="//kachibito.net/web-design/jquery-jpostal-js.html">郵便番号を入力すると住所を自動補完してくれるjQueryプラグイン・jquery.jpostal.js</a>（かちびと.net）</p>
<p>&nbsp;</p>
<h3>5.電話番号欄には数字以外入力できない</h3>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever5.png" alt="141215_ever5" width="640" class="alignnone size-full wp-image-10471" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever5.png 766w, https://mamion.net/wp/wp-content/uploads/141215_ever5-300x93.png 300w" sizes="(max-width: 766px) 100vw, 766px" /><br />
電話番号欄には、エラー防止のためにアルファベットやハイフンが入力できないようになっています。</p>
<p>本来ハイフンの必要有無については入力例を見れば判別できるはずですが、特にシニアはキーを打つ際に手元に集中してしまい、完全に入力し終わるまで指示に気付かないことが多々あります。そんなとき、この機能が威力を発揮しそうです。</p>
<p>実装はやはりJavaScriptで以下の要領で行っているようです。</p>
<p><a href="https://gist.github.com/lequinharay/4335202">フォームの入力値を数値のみに制限するjavascript</a>（GitHub）</p>
<p>&nbsp;</p>
<h3>6.生年月日の初期値が50歳に指定されている</h3>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever6.png" alt="141215_ever6" width="640" class="alignnone size-full wp-image-10472" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever6.png 662w, https://mamion.net/wp/wp-content/uploads/141215_ever6-300x197.png 300w" sizes="(max-width: 662px) 100vw, 662px" /><br />
プルダウンの選択肢を開いた際の小さなスクロールは、シニアにとって操作が難しいものの一つです。生年月日なので選択肢が多いのは仕方がありませんが、他のサイトの極端な例では、初期値が「明治元年」になっているものもありました…。</p>
<p>こちらのサイトでは、商品のターゲットに近い50歳の生年月日を初期値として指定しているおかげで、スクロールを行わなくても自分の生年月日を選択しやすくなっています。</p>
<p>これは選択肢のoptionタグ内に「selected="selected"」と指定することですぐ実装が可能です。ターゲット層に合わせてプルダウンの初期値を調整してあげる施策は費用対効果が高いため、過去にも様々なサイトで言及されていますね。</p>
<p><a href="//www.bebit.co.jp/memo/2007/09/post_79.html">プルダウンメニューの初期値</a>（ユーザビリティ実践メモ）</p>
<p>&nbsp;</p>
<h3>7.メールアドレスの補完機能がある</h3>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever7.png" alt="141215_ever7" width="619" height="117" class="alignnone size-full wp-image-10474" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever7.png 619w, https://mamion.net/wp/wp-content/uploads/141215_ever7-300x56.png 300w" sizes="(max-width: 619px) 100vw, 619px" /><br />
メールアドレスを入力する際、@以降に「y」と打つだけで、yahoo.co.jpが候補として出現します。他にgmail.com、hotomail.com、docomo.ne.jpなども補完候補となっており、タイプミスの多いシニアにとっては効果がありそうです。</p>
<p>ここでは入力補完ライブラリsuggest.jsをカスタマイズして実装しているようです。<br />
<a href="//blog.digital-squad.net/article/112273688.html">Javascriptによるオートコンプリート(入力補完)suggest.js</a>（WEBデザイン Tips）</p>
<p>メールアドレスの補完機能については、他にもいくつか方法が紹介されていますので参考まで。</p>
<p><a href="//hack.aipo.com/archives/1218/">メールアドレス入力フォームにドメインのサジェスト機能をつける（2）</a>（Hack）<br />
<a href="//webkaru.net/jquery-plugin/email-autocomplete/">メールアドレスのドメイン部分を入力補完 - Email Autocomplete</a>（jQueryプラグインまとめ）</p>
<p>&nbsp;</p>
<h3>8.エラー入力へのフィードバック内容が具体的</h3>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever8.png" alt="141215_ever8" width="665" height="216" class="alignnone size-full wp-image-10473" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever8.png 665w, https://mamion.net/wp/wp-content/uploads/141215_ever8-300x97.png 300w" sizes="(max-width: 665px) 100vw, 665px" /><br />
入力内容に不備があった際、フォーカスが外れたタイミングでエラーに対する指摘が表示されます。</p>
<p>このサイトで特徴的なのが、その条件分岐の多さ。例えばメールアドレスの場合は、@マークの有無はもちろん、ピリオドとカンマの違いまでチェックする構造になっていました。</p>
<p>ただ「正しくありません」「無効です」と知らせるだけでは、ほとんどのシニアは修正することはできないと思ってよいでしょう。何が違うのか、どうすれば修正できるのか、できるだけ詳しく伝えようとする姿勢がよく見えます。</p>
<p>エラーのチェックは、基本的にJavaScriptをonblurのタイミングで動かして行っており、特別なEFOのパッケージは使っていないように見えます。</p>
<p>&nbsp;</p>
<h3>9.「次へ」ボタンを押すと、間違った項目だけを表示してくれる</h3>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_ever9.png" alt="141215_ever9" width="640" class="alignnone size-full wp-image-10475" srcset="https://mamion.net/wp/wp-content/uploads/141215_ever9.png 960w, https://mamion.net/wp/wp-content/uploads/141215_ever9-300x189.png 300w" sizes="(max-width: 960px) 100vw, 960px" /><br />
シニアの場合、フォームのどこでエラーが発生しているのか、見つけるのは一苦労です。</p>
<p>こちらのサイトでは、入力を完了して「次へ」ボタンを押すと、エラーのあった項目のみ残して表示し、修正をうながしてくれます。これなら迷わずにすみますね。</p>
<p>ちなみに上記画像の例では、「グアム」とカタカナで入力してあったものを、すでにひらがなに修正してくれています。</p>
<p>&nbsp;</p>
<h3>さらに改善するための3つのポイント</h3>
<p>ここまでご紹介してきたように、エバーライフの入力フォームは「執拗」とも言えるほど、細かいシニア対応施策を丁寧に揃えてきているのがわかります。正直、ここまで多くをしっかりと盛り込んでいるサイトは、私が知る限りでは他にありません。</p>
<p>いま現在の状態でもかなりレベルは高いのですが、さらにこのフォームをよくするために、残されている改善の余地を考えてみたいと思います。</p>
<p>&nbsp;</p>
<h4>姓名、郵便番号のフォームを統合する</h4>
<p>特にシニアの方々は文字入力の際に下を向いてしまうため、例えばフォームが苗字と名前で分かれていると、前者の方にフルネームを入れてしまい後からそのことに気づくのです。これは郵便番号や電話番号でも同じ傾向が見られます。</p>
<p>この対策として、<a href="//kaigo.homes.co.jp/">HOME'S介護</a>のサイトでは、フォームを統合して1つにしています。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_homes.png" alt="141215_homes" width="640" class="alignnone size-full wp-image-10476" srcset="https://mamion.net/wp/wp-content/uploads/141215_homes.png 718w, https://mamion.net/wp/wp-content/uploads/141215_homes-300x99.png 300w" sizes="(max-width: 718px) 100vw, 718px" /><br />
データベースの構成上難しいところも多いかもしれませんが、HOME'S介護では間にスペースを空けるよう指示することで、苗字と名前の区別ができるよう工夫もしていますね。</p>
<p>&nbsp;</p>
<h4>全角/半角の自動修正を行う</h4>
<p>エバーライフの入力フォームで一番残念なことは、半角指定の項目に全角入力した際に、それが自動的に修正されることなくエラーと判定されてしまうことです。</p>
<p>多くのシニアにとって、英数文字の全角と半角は区別がつきづらいもの。最近は、この全半角の処理を自動的に行ってくれるところが増えてきました。また<a href="//www.japanet.co.jp/shopping/">ジャパネットたかた</a>のフォームでは、全角モードのままでも強制的に半角で出力させるワザを使って対応しています。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_takata.png" alt="141215_takata" width="640" class="alignnone size-full wp-image-10477" srcset="https://mamion.net/wp/wp-content/uploads/141215_takata.png 697w, https://mamion.net/wp/wp-content/uploads/141215_takata-300x66.png 300w" sizes="(max-width: 697px) 100vw, 697px" /></p>
<p>&nbsp;</p>
<h4>誤って「戻る」を押した際の確認メッセージを出す</h4>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/141215_homes2.png" alt="141215_homes2" width="546" height="383" class="alignnone size-full wp-image-10481" srcset="https://mamion.net/wp/wp-content/uploads/141215_homes2.png 546w, https://mamion.net/wp/wp-content/uploads/141215_homes2-300x210.png 300w" sizes="(max-width: 546px) 100vw, 546px" /><br />
シニアのフォーム入力操作を観察していると、誤ってページから離脱してしまい、再びフォームのページに戻ったら最初から全部やりなおし…という悲しいシーンによく遭遇します。フォームからフォーカスが外れた状態なのに気付かず、文字を修正しようとしてbackspaceキーを押してしまうのです。</p>
<p>こうした悲劇を防ぐためには、上記のHOME'S介護のように確認メッセージを出す方法がよいでしょう。実装方法も簡単なので、費用対効果が高い対策ですね。</p>
<p><a href="//www.18th-technote.com/beforeunload-change">[jQuery] ページを離れる際に確認メッセージを出す方法</a>（18th Tech Note）</p>
<p>&nbsp;</p>
<h3>入力フォームのシニア対応は、ユーザー全員に効果あり！</h3>
<p>ここまで、エバーライフの入力フォームで実装されている様々なシニア対応施策（+α）を見てきました。</p>
<blockquote><p>1. 各フォームがそこそこ大きく見やすい<br />
2. 必須項目表示がわかりやすい<br />
3. ふりがなが自動的に入力される<br />
4. 住所が自動的に入力される<br />
5. 電話番号欄には数字以外入力できない<br />
6. 生年月日の初期値が50歳に指定されている<br />
7. メールアドレスの補完機能がある<br />
8. エラー入力へのフィードバック内容が具体的<br />
9. 「次へ」ボタンを押すと、間違った項目だけを表示してくれる</p>
<p>追加ポイント<br />
・姓名、郵便番号のフォームを統合する<br />
・全角/半角の自動修正を行う<br />
・誤って「戻る」を押した際の確認メッセージを出す
</p></blockquote>
<p>入力フォームの改善は結果がダイレクトに出やすいため、サイトのシニア対応の取っ掛かりとしておすすめです。</p>
<p>また既にお気づきの方もいらっしゃると思いますが、今回ご紹介したポイントは、シニアに限らず、どの年代のユーザーにも一定の効果が期待できます。</p>
<p>今回、ポイントのいくつかは実装方法まで含めて紹介していますので、「シニア対応、どこからやればよいのやら…」という方は、まずは費用対効果の高そうなものから優先的に取り組んでみてはいかがでしょうか。</p>
<p>&nbsp;</p>The post <a href="https://mamion.net/2014/12/%e7%9a%87%e6%bd%a4%e3%81%ae%e5%85%a5%e5%8a%9b%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%8c%e4%bd%bf%e3%81%84%e3%82%84%e3%81%99%e3%81%84%e7%90%86%e7%94%b1/">こんなにあった！シニア対応を本気で進める『皇潤』の入力フォームが使いやすい理由</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>「マウス録画」ツールで普段のユーザー行動をこっそり観察してみよう！</title>
		<link>https://mamion.net/2014/09/%e3%83%9e%e3%82%a6%e3%82%b9%e9%8c%b2%e7%94%bb%e3%83%84%e3%83%bc%e3%83%ab%e3%81%a7%e6%99%ae%e6%ae%b5%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e8%a1%8c%e5%8b%95%e3%82%92%e8%a6%b3%e5%af%9f/</link>
		
		<dc:creator><![CDATA[stj064]]></dc:creator>
		<pubDate>Tue, 09 Sep 2014 02:01:35 +0000</pubDate>
				<category><![CDATA[ユーザビリティ]]></category>
		<category><![CDATA[ユーザーテストのコツ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=10208</guid>

					<description><![CDATA[<p>皆さんご存知の通り、ウェブサイトのユーザビリティ評価において、「ユーザーテスト」は非常に優れた手法です。 しかし、弱点もいくつかあります。 その一つが、「実験室環境」、つまり作られた環境と突然与えられたタスクでテストが行 [&#8230;]</p>
The post <a href="https://mamion.net/2014/09/%e3%83%9e%e3%82%a6%e3%82%b9%e9%8c%b2%e7%94%bb%e3%83%84%e3%83%bc%e3%83%ab%e3%81%a7%e6%99%ae%e6%ae%b5%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e8%a1%8c%e5%8b%95%e3%82%92%e8%a6%b3%e5%af%9f/">「マウス録画」ツールで普段のユーザー行動をこっそり観察してみよう！</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p>皆さんご存知の通り、ウェブサイトのユーザビリティ評価において、「ユーザーテスト」は非常に優れた手法です。</p>
<p>しかし、弱点もいくつかあります。</p>
<p>その一つが、「実験室環境」、つまり作られた環境と突然与えられたタスクでテストが行われることで、ユーザーが普段と違った行動をとってしまう可能性が排除できないことです。</p>
<p>もちろんこれを防ぐために、できるだけ実際の利用シーンに即した自然なタスクを用意したり、「リモートテスト」で自宅の慣れた環境でテストしてもらうこともできますが、やはり一部の限界は感じますね…。</p>
<p>今回は、こうしたユーザーテストの積年の課題に対して有効な対策として、改めて「マウス録画」ツールの活用についてご紹介したいと思います。</p>
<p>&nbsp;</p>
<h3>「マウス録画」が使えるサービスはこの2つ</h3>
<p>「マウス録画」ツールとは、自社のサイトに特定の「JavaScriptタグ」を埋め込むことで、来訪者がサイトをどのように利用しているのか、録画ができてしまうというものです。</p>
<p>日本で展開している代表的なサービスは、以下の2つです。</p>
<h4>Ghostrec（ゴーストレック）</h4>
<p><img decoding="async" class="alignnone size-full wp-image-10329" style="border: solid 1px #999999;" src="//mamion.net/wp/wp-content/uploads/140828_1.png" alt="140828_1" width="480" srcset="https://mamion.net/wp/wp-content/uploads/140828_1.png 1007w, https://mamion.net/wp/wp-content/uploads/140828_1-300x223.png 300w" sizes="(max-width: 1007px) 100vw, 1007px" /></p>
<p>こちらのサービス自体は海外で開発されてしばらく経つのですが、昨年末に日本の会社が販売ライセンスだけではなく、開発の権利も買い取ってしまいましたので、既に日本のツールと言ってよいでしょう。</p>
<p>以下のページの「クイックユーザビリティ調査」メニューから動作デモを体験できますが、ユーザー行動を観察するには十分な解像度、フレームレートの動画が得られます。</p>
<p><a href="//www.ghostrec.jp/jp/demo/">デモンストレーション選択</a>（GhostRec.jp）</p>
<p>また通常のマウス録画機能に加え、下の画像のように特定のユーザーにタスクを提示して「リモートユーザーテスト」ツールとして活用することも可能です。マウスの軌跡を基にしたヒートマップの抽出にも対応しているので、ある程度の人数にテストURLを一斉配信すれば、かなり制度の高いアウトプットが得られそうです。</p>
<p><img decoding="async" class="alignnone size-full wp-image-10335" style="border: solid 1px #999999;" src="//mamion.net/wp/wp-content/uploads/140828_3.png" alt="140828_3" width="480" srcset="https://mamion.net/wp/wp-content/uploads/140828_3.png 1007w, https://mamion.net/wp/wp-content/uploads/140828_3-300x223.png 300w" sizes="(max-width: 1007px) 100vw, 1007px" /><br />
<img decoding="async" class="alignnone size-full wp-image-10336" style="border: solid 1px #999999;" src="//mamion.net/wp/wp-content/uploads/140828_4.png" alt="140828_4" width="480" srcset="https://mamion.net/wp/wp-content/uploads/140828_4.png 1007w, https://mamion.net/wp/wp-content/uploads/140828_4-300x223.png 300w" sizes="(max-width: 1007px) 100vw, 1007px" /></p>
<p>ちなみに課金形態はPV課金なので、必要な時に必要なだけデータを抽出できる点も使いやすいのではと思います。</p>
<p>&nbsp;</p>
<h4><a href="//www.ctale.jp/">ClickTale（クリックテール）</a></h4>
<p><img decoding="async" class="alignnone size-full wp-image-10333" style="border: solid 1px #999999;" src="//mamion.net/wp/wp-content/uploads/140828_2.png" alt="140828_2" width="480" srcset="https://mamion.net/wp/wp-content/uploads/140828_2.png 1007w, https://mamion.net/wp/wp-content/uploads/140828_2-300x223.png 300w" sizes="(max-width: 1007px) 100vw, 1007px" /></p>
<p>こちらも開発は海外で、日本の会社が代理店として販売、導入支援を行っています。</p>
<p>既に導入している会社も多いのですが、どちらかというと、マウスの軌跡やスクロール行動から算出する「ヒートマップ」機能がウリで、マウス録画機能はあまりプッシュされていないようです。</p>
<p>料金形体は非公開のようなので、各自問い合わせてみてください。</p>
<p>&nbsp;</p>
<p>GhostRecとClickTaleを比較すると、本質的な機能自体にはそれほど差はないように感じます。しかし、どちらかというとタスク提示機能がある前者は「ユーザーテストの延長」、ヒートマップ機能を強調する後者は「アクセス解析の延長」という印象を受けます。</p>
<p>&nbsp;</p>
<h3>「マウス録画」は自然なタスクを観察できる</h3>
<p>「マウス録画」された動画を観察するのは、実験室環境で与えられたタスクを観察する従来のユーザーテストとはまた違った緊張感があります。まるで他人のデスクトップをのぞいているようで、結構ドキドキするものです。</p>
<p>ここで観察できる行動は、誰にも指示されずに使っているため、本当にリアルで生々しいものばかりです。</p>
<p>・1ページだけ見て直帰してしまう人<br />
・ファーストビューから少しもスクロールしない人<br />
・文字が読みにくかったのか、画面を拡大している人<br />
・入力フォームで発生したエラーに気付かない人　等々</p>
<p>通常のユーザーテストでは、ユーザーの皆さんから多少の「心遣い」を感じたり、「やらなくてはならないからやった」という声を聞いたりするのですが、自然なタスクにおいてはそんなことは全く関係なし。役に立たないと感じたサイトへの反応は、本当に遠慮がなく殺伐としています。</p>
<p>私が初めてマウス録画の動画を目にしたとき、「ウェブサイトというのは制作者が思ったよりも『ぞんざい』に扱われているんだなぁ」と改めて感じさせられました。</p>
<p>でも、これが本当の「リアルな使われ方」なんですね。</p>
<p>&nbsp;</p>
<h3>アクセス解析とユーザーテストの間を埋める！</h3>
<p>ここで「マウス録画」機能のメリットとデメリットを、一旦まとめてみます。</p>
<h4>メリット</h4>
<p>・自然なタスク下で気遣いのないユーザー行動が観察できる<br />
・アクセス解析に現れにくい「ページ内」の行動がわかる<br />
・実際のブラウザ表示領域がわかる<br />
・スマホやタブレットにも対応し、PCとの違いがわかる<br />
・比較的テスト数が稼ぎやすい</p>
<h4>デメリット</h4>
<p>・行動は観察できるが、感情や考えていることがわからない<br />
・見つかった問題点に対して深堀りができない<br />
・こちらが想定している使い方が見られるとは限らない<br />
・見たい行動をしている人以外のPVも加算されてしまう</p>
<p>ここで他のユーザー行動を把握するための手法と、その特徴を比較してみましょう。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140909_3.png" alt="140909_3" width="660" height="364" class="alignnone size-full wp-image-10352" srcset="https://mamion.net/wp/wp-content/uploads/140909_3.png 660w, https://mamion.net/wp/wp-content/uploads/140909_3-300x165.png 300w" sizes="(max-width: 660px) 100vw, 660px" /></p>
<p>こうして見ると「マウス録画」は、「アクセス解析」と「ユーザーテスト」の中間のようなツールと位置づけることができるでしょう。アクセス解析だけでは物足りない定性的なページ内行動部分を補完し、また前項で挙げたユーザーテストの弱点である「自然でリアルなタスク」という部分も埋めてくれます。</p>
<p>またどちらかといえばページ内の分析が得意なので、リンク要素の多いトップページや、入力操作の多いフォームページなどで活躍してくれるのではないでしょうか。</p>
<p>一方で、行動を確認するのは得意でも、それがなぜ発生したのか深堀りしていくことは苦手なツールなので、そこは他の手法でカバーしてあげる必要がありますね。</p>
<p>&nbsp;</p>
<p>サイトの実態を正確に把握するためには、「多面的に評価すること」が重要です。</p>
<p>そのためには、各手法の特徴をしっかりと把握した上で、それらを必要に応じてうまく取捨選択し、組み合わせて用いるとよいでしょう。</p>
<p>「マウス録画」は比較的低コストで実施できる手法ですので、皆さんもぜひ積極的に活用してみてはいかがでしょうか？</p>
<p>&nbsp;</p>The post <a href="https://mamion.net/2014/09/%e3%83%9e%e3%82%a6%e3%82%b9%e9%8c%b2%e7%94%bb%e3%83%84%e3%83%bc%e3%83%ab%e3%81%a7%e6%99%ae%e6%ae%b5%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e8%a1%8c%e5%8b%95%e3%82%92%e8%a6%b3%e5%af%9f/">「マウス録画」ツールで普段のユーザー行動をこっそり観察してみよう！</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>グローバルメニューを使わないシニアのための『地味ナビ』改善ポイント</title>
		<link>https://mamion.net/2014/04/%e5%9c%b0%e5%91%b3%e3%83%8a%e3%83%93%e6%94%b9%e5%96%84%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88/</link>
		
		<dc:creator><![CDATA[stj064]]></dc:creator>
		<pubDate>Tue, 22 Apr 2014 02:31:29 +0000</pubDate>
				<category><![CDATA[シニア対応]]></category>
		<category><![CDATA[ユーザビリティ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=9989</guid>

					<description><![CDATA[<p>シニアのユーザーテストを観察していると、トップページの多くの領域を占拠する「大型バナー」や、気合いを入れてデザインされた「グローバルメニュー」が全く機能していないシーンによく遭遇します。 こうしたユーザーは、代わりに次の [&#8230;]</p>
The post <a href="https://mamion.net/2014/04/%e5%9c%b0%e5%91%b3%e3%83%8a%e3%83%93%e6%94%b9%e5%96%84%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88/">グローバルメニューを使わないシニアのための『地味ナビ』改善ポイント</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p>シニアのユーザーテストを観察していると、トップページの多くの領域を占拠する「大型バナー」や、気合いを入れてデザインされた「グローバルメニュー」が全く機能していないシーンによく遭遇します。</p>
<p>こうしたユーザーは、代わりに次のような"地味"な機能を好んで使っているのです。</p>
<blockquote><p>・サイトマップ<br />
・サイト内検索<br />
・よくある質問</p></blockquote>
<p>これは、ITリテラシが少し高めの"そこそこ使える"シニアユーザーで特に顕著に見られる行動です。普段からウェブサイトを利用しているうちに、「何かわからないことがあるときには、ここを見ればいいんだ」と学習してきたようです。</p>
<p>しかしウェブ制作側としては、こうした地味な機能には、あまり制作リソースをかけていないのではないでしょうか？</p>
<p>今回はこれら3つの機能を『地味ナビ三兄弟』と命名し、ウェブが"そこそこ使える"シニア向けに最低限対応しておきたい施策についてまとめてみます。</p>
<p>&nbsp;</p>
<h3>「サイトマップ」への導線はヘッダー内に設置する</h3>
<p>シニアユーザーに「サイトマップ」が好まれる理由として、以下の点が考えられます。</p>
<blockquote><p>・余計な装飾がないので見やすい<br />
・すべてのコンテンツが一覧できる
</p></blockquote>
<p>グローバルメニューは、ラベルに相当気を遣わないと、その下層にどんなコンテンツが含まれているのかパッとわかりにくいという欠点があります。多くのシニアユーザーは、ラベルから内容を類推する精度が高くありませんし、コンテンツを探して何度もページを行き来することを非常に嫌います。</p>
<p>そのため、下層コンテンツまで一覧で確認できるサイトマップは「わかりやすい」とされ、そこで探している情報をうまく見つけた経験を積むほど利用率が高くなるのです。</p>
<p>&nbsp;</p>
<p>こうして頼りにされるサイトマップですが、サイトによってはリンクをヘッダーに置いていなかったり、最近ではフッターがサイトマップ代わりになっているサイトも増えてきています。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140421_1.png" alt="140421_1" width="640" class="alignnone size-full wp-image-9997" style="border:1px solid #999999;" srcset="https://mamion.net/wp/wp-content/uploads/140421_1.png 948w, https://mamion.net/wp/wp-content/uploads/140421_1-300x192.png 300w" sizes="(max-width: 948px) 100vw, 948px" /></p>
<p>しかし「<a href="//mamion.net/2013/10/%E5%AE%9F%E4%BE%8B%E3%81%A7%E7%B4%8D%E5%BE%97%EF%BC%81%E3%82%B7%E3%83%8B%E3%82%A2%E3%81%8C%E4%BD%BF%E3%81%88%E3%81%AA%E3%81%84%E3%82%B5%E3%82%A4%E3%83%88%E3%81%AE%E4%BE%8B/">シニアはスクロールしない</a>」の格言通り、なにか情報を探す際にページ下部まできっちりチェックするというシニアは少ないので、サイトマップへの導線はできる限りヘッダー内のすぐ見つかる位置に確保することをおすすめします。</p>
<p>&nbsp;</p>
<h3>「サイト内検索結果」を読みやすくする</h3>
<p>いろいろなページを行ったり来たりしながら情報を探す行動は、物理的な操作の負荷に加え、認知的な負荷もかかります。こうした作業にうんざりしているシニアは、ナビゲーション代わりとして「サイト内検索」を積極的に利用する傾向があります。</p>
<p>しかし検索結果の見せ方に配慮が足りないと、自分の探しているページを見つけるのに非常に苦労してしまいます。</p>
<p>サイト内検索結果を見やすくするためには、以下の点に気をつけたいところです。</p>
<blockquote><p>・内容が想像しやすいページタイトルをつける<br />
・タイトル、説明文ともに読みやすい文字の大きさと行間を確保する<br />
・キーワードをハイライトする</p></blockquote>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140421_2.png" alt="140421_2" width="640" class="alignnone size-full wp-image-10000" style="border:1px solid #999999;" srcset="https://mamion.net/wp/wp-content/uploads/140421_2.png 940w, https://mamion.net/wp/wp-content/uploads/140421_2-300x198.png 300w" sizes="(max-width: 940px) 100vw, 940px" /></p>
<p>キヤノンのサイトは全体としてタブレット対応が進んでいるせいもあり、サイト内検索結果はかなりの余裕を持ってレイアウトされています。これだけ文字が大きく、行間や余白も確保されていると、シニアでもストレスなく"ナビゲーション代わりに"利用することができます。</p>
<p>&nbsp;</p>
<h3>「サイト内検索フォーム」にはサジェスト機能をつける</h3>
<p>サイト内に該当する情報があるのにも関わらず、検索キーワードの打ち間違いに気づかない、余分なワードを続けて入れてしまう等の問題により、検索結果がゼロ件になってしまうシーンをよく見かけます。</p>
<p>しかも、ユーザー自身はなぜそうなったのかを理解できないため、情報はそこには載っていないのだと感じて離脱してしまいます。</p>
<p>こうした表記揺れやキーワードの想起を助けるために、サイト内検索においても「サジェスト機能」「もしかして機能」は非常に有効です。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/130712_4.png" width="461" height="182" class="alignnone" style="border:1px solid #999999;"/></p>
<p>ちなみにシニアのユーザーテストを実施していると、途中でサジェスト機能に気が付いて、喜んでキーワードをクリックする様子を本当によく目にします。サジェスト機能の利用は、シニアの間でも一般的な行動になってきているように感じます。</p>
<p>&nbsp;</p>
<h3>ナビゲーションとしての「よくある質問」</h3>
<p>サイトマップの代わりに、「よくある質問」を頼りにするシニアも多くいます。</p>
<p>「よくある質問」は、通常はサービスの内容についての質問が掲載されるページですが、サイトの利用方法に関する疑問があるときにも、こちらが参照されてしまうことがあります。</p>
<p>こうしたサイト内コンテンツへのナビゲーションとしての役割を考えると、以下のような点に配慮したいところです。</p>
<blockquote><p>・サイト内主要コンテンツへ誘導する回答を増やす<br />
・サイトマップと同じように一覧性の高いレイアウトにする<br />
・回答数が多い場合、検索機能を用意しておく</p></blockquote>
<p>また当然ですが、「よくある質問」を「FAQ」と書くのは避けましょう。シニアユーザーの多いサイトでは、アルファベット用語を使わないのは鉄則です。</p>
<p>&nbsp;</p>
<h3>『地味ナビ』の改修は、費用対効果を見込みやすい</h3>
<p>今回注目した『地味ナビ三兄弟』の面々ですが、普段のアクセス解析においても、各種の数値を追うようにしてみてはいかがでしょうか。</p>
<p>もしこうしたページへのアクセスが増加傾向にあったら、新規のユーザーにはサイト構成やグローバルメニューがわかりづらいのかもしれません。またそこでの滞在時間が長ければ、情報を探すのに苦労しているのかもしれません。</p>
<p>『地味ナビ』の改修は、サイト全体の構成やグローバルメニュー等の改修に比べて手が付けやすく、費用対効果を見込みやすい部分です。</p>
<p>"そこそこ使える"シニアユーザーを逃したくなければ、ぜひ今回ご紹介したポイントを確認してみてください。</p>
<p>&nbsp;</p>The post <a href="https://mamion.net/2014/04/%e5%9c%b0%e5%91%b3%e3%83%8a%e3%83%93%e6%94%b9%e5%96%84%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88/">グローバルメニューを使わないシニアのための『地味ナビ』改善ポイント</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>全てのECサイトがユーザーテストで確認しておくべきポイントⅢ：重要事項説明</title>
		<link>https://mamion.net/2014/02/ec%e3%82%b5%e3%82%a4%e3%83%88%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e3%83%86%e3%82%b9%e3%83%88%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88%e2%85%a2%e9%87%8d%e8%a6%81%e4%ba%8b%e9%a0%85/</link>
		
		<dc:creator><![CDATA[stj064]]></dc:creator>
		<pubDate>Mon, 24 Feb 2014 00:57:51 +0000</pubDate>
				<category><![CDATA[コンバージョン改善]]></category>
		<category><![CDATA[ユーザビリティ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=9725</guid>

					<description><![CDATA[<p>前回までの「支払いプロセス」、「商品説明」に引き続き、海外のユーザビリティ関連記事をご紹介します。 3 Things Every Ecommerce Business Should User Test（Usabilla. [&#8230;]</p>
The post <a href="https://mamion.net/2014/02/ec%e3%82%b5%e3%82%a4%e3%83%88%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e3%83%86%e3%82%b9%e3%83%88%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88%e2%85%a2%e9%87%8d%e8%a6%81%e4%ba%8b%e9%a0%85/">全てのECサイトがユーザーテストで確認しておくべきポイントⅢ：重要事項説明</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p>前回までの「<a href="//mamion.net/2014/01/ec%E3%82%B5%E3%82%A4%E3%83%88%E3%81%AE%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BC%E3%83%86%E3%82%B9%E3%83%88%E3%83%9D%E3%82%A4%E3%83%B3%E3%83%88%E2%85%A0%E6%94%AF%E6%89%95%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9/">支払いプロセス</a>」、「<a href="//mamion.net/2014/02/ec%E3%82%B5%E3%82%A4%E3%83%88%E3%81%AE%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BC%E3%83%86%E3%82%B9%E3%83%88%E3%83%9D%E3%82%A4%E3%83%B3%E3%83%88%E2%85%A1%E5%95%86%E5%93%81%E8%AA%AC%E6%98%8E/">商品説明</a>」に引き続き、海外のユーザビリティ関連記事をご紹介します。</p>
<p><a href="//blog.usabilla.com/3-things-every-ecommerce-business-user-test/">3 Things Every Ecommerce Business Should User Test</a>（Usabilla.com）</p>
<p>こちらの記事では、ECサイトのコンバージョン率や売上をアップさせるために、サイトオーナーが特に確認しておくべき3つのポイントが紹介されています。今回はポイントその3、「重要事項説明」についての内容です。</p>
<p>＜以下、翻訳して引用＞</p>
<p>&nbsp;</p>
<h3>3. 重要事項説明の設置</h3>
<p>あなたのサイトの訪問者は、とある情報を求めています。それは買い物客の不安をしずめ、商品について納得した上で購入することを助けてくれます。</p>
<p>こちらは、あなたのサイトで簡単に見つけられるようにしておくべき情報のリストです。</p>
<p>・ショッピング運営ポリシー<br />
・返品交換ポリシー<br />
・よくある質問<br />
・お問い合わせ窓口情報（電話番号を含む）<br />
・プライバシーポリシー</p>
<p>もしあなたのサイトでこれらの情報がナビゲーションから外されてしまっているのなら、見つけやすくなるように、今すぐ対応すべきです。</p>
<p>多くの顧客は、「配送情報」や「返品ポリシー」についての情報が明示されていると、より気持ちよく買い物ができるものです。そのため、最低限こうした情報は見つけやすくしておきましょう。</p>
<p>消費者は、注文を失敗したのかと心配にならないよう、商品が届くまでにどのくらい待てばよいのか知りたいと思っています。また届いた商品が広告と違っていたり、ニーズと合わなかったりしたときでも、簡単に返品ができるかどうか確認しておきたいのです。</p>
<p>もしあなたがこうした2つの情報を明示していない場合、顧客をサイトから遠ざけ、そんな心配をする必要のない実店舗に行くように追いやっているようなものです。</p>
<p>&nbsp;</p>
<p>また、「お問い合わせ情報」を見つけやすくしておくことも大事です。顧客が注文方法や商品について困ったことがあったときに、助けてくれる人がいるということがわかります。</p>
<p>e-consultancyの調査によると、「お問い合わせ情報」をはっきり掲載しているサイトを信頼すると回答した人が、【46%】以上に上るとのことです。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/130220_1.png" alt="130220_1" width="570" height="248" class="alignnone size-full wp-image-9727" srcset="https://mamion.net/wp/wp-content/uploads/130220_1.png 570w, https://mamion.net/wp/wp-content/uploads/130220_1-300x130.png 300w" sizes="(max-width: 570px) 100vw, 570px" /><br />
<small>（画像参照：<a href="//econsultancy.com/blog/7941-which-e-commerce-trustmarks-are-most-effective">eConsultancy</a>）</small></p>
<p>&nbsp;</p>
<p>1つ、先ほどのリストに含めていなかった重要な情報が、信頼性バッジです。</p>
<p>信頼性バッジとは、"認証マーク"や"TRUSTe"のようなもので、コンバージョンを促進します。こうしたバッジは、あなたのサイトが安全に取引できることを伝えてくれます。それにより、顧客はクレジットカード情報や配送先情報を安心して入力できるのです。</p>
<p>"House of Kids"というサイトで行われたABテストの例では、サイトに信頼性バッジを設置すると、コンバージョン率が【32%】もアップしました！</p>
<p>こちらが信頼性バッジを設置した際のイメージです。バッジがはっきりと掲載されていることがわかりますね。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/130220_2.jpg" alt="130220_2" width="570" height="99" class="alignnone size-full wp-image-9728" srcset="https://mamion.net/wp/wp-content/uploads/130220_2.jpg 570w, https://mamion.net/wp/wp-content/uploads/130220_2-300x52.jpg 300w" sizes="(max-width: 570px) 100vw, 570px" /><br />
<small>（画像参照：<a href="//visualwebsiteoptimizer.com/split-testing-blog/do-trust-badges-on-websites-work-oh-yes-32-increase-in-conversions/">Visual Website Optimizer</a>）</small></p>
<p>"House of Kids"では、UXの改善とコンバージョン率の向上を狙って、トップバナー内に信頼性バッジを表示しています。</p>
<p>そしてこちらが結果です。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/130220_3.jpg" alt="130220_3" width="570" height="113" class="alignnone size-full wp-image-9729" srcset="https://mamion.net/wp/wp-content/uploads/130220_3.jpg 570w, https://mamion.net/wp/wp-content/uploads/130220_3-300x59.jpg 300w" sizes="(max-width: 570px) 100vw, 570px" /><br />
<small>（画像参照：<a href="//visualwebsiteoptimizer.com/split-testing-blog/do-trust-badges-on-websites-work-oh-yes-32-increase-in-conversions/">Visual Website Optimizer</a>）</small></p>
<p>信頼性バッジを設置した結果、サイトのコンバージョンは【32.3%】改善しました！</p>
<p>こうした結果は、珍しいものではありません。もしあなたが商品を見せるためのスペースを消費してしまうことを心配して信頼性バッジを使うかどうか迷っているのなら、ぜひ"House of Kids"のようにABテストをしてみてください。</p>
<p>またユーザーテストを行う際は、以下のような質問をするのもよいでしょう。</p>
<p>・信頼性バッジに気付きましたか？<br />
・信頼性バッジがあることで、気持ちよく購入することができましたか？</p>
<p>&nbsp;</p>
<p>配送情報や返品ポリシーなどの重要事項、お問い合わせ情報、信頼性バッジなどを明示すれば、余分な費用をかけることなく、コンバージョン率を改善することが可能です。これは素敵ですね！</p>
<p>＜翻訳引用ここまで＞</p>
<p>&nbsp;</p>
<h3>補足と感想</h3>
<p>今回出てきたポイントは、「配送情報」「返品ポリシー」「お問い合わせ」「信頼性を示すバッジ」の4つです。</p>
<p>確かに自分がネットで買い物をするときも、こうした情報を確認することが多いです。同じ商品が同じような価格で売られている場合は、もちろん早く届く可能性が高いショップで購入しますし、また旅行やチケットの申込みの際は、確かにキャンセルポリシーなどを入念にチェックしていますね。</p>
<p>&nbsp;</p>
<p>ただ少し残念なのは、こうした情報をまとめて「買い物ガイド」と表記しているサイトが多いことです。これだと、初めてネットで買い物をする人のためのガイドコンテンツのように見えてしまい、ここに配送情報や返品ポリシーが含まれていることがパッと伝わりません。</p>
<p>またこうした情報は、商品やメニュー、プロモーションバナーなどによって、サイドバー下部などの目立たない位置に追いやられてしまっている様子もよく見かけます。アイトラッキングの結果を見ていると、サイドバーを確認するユーザーの割合というのは意外と低く、ここには重要な情報を置くべきではないと感じています。</p>
<p>-----</p>
<p>今回ご紹介した記事ですが、特にECサイトを運営している方にとっては、サイト改善のポイントが簡潔にまとめられていて参考になったのではと思います。</p>
<p>ユーザーテストを適切に行うことで、コンバージョン率は必ず改善できます。</p>
<p>マミオンでは、今回ご紹介したポイントを踏まえた上で、ユーザーテストのコーディネートやアドバイス等をいたします。まずはリモートテスト等の低コストのものからでもよいので、ぜひトライしてみましょう！</p>
<p>&nbsp;</p>The post <a href="https://mamion.net/2014/02/ec%e3%82%b5%e3%82%a4%e3%83%88%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e3%83%86%e3%82%b9%e3%83%88%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88%e2%85%a2%e9%87%8d%e8%a6%81%e4%ba%8b%e9%a0%85/">全てのECサイトがユーザーテストで確認しておくべきポイントⅢ：重要事項説明</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>全てのECサイトがユーザーテストで確認しておくべきポイントⅡ：商品説明</title>
		<link>https://mamion.net/2014/02/ec%e3%82%b5%e3%82%a4%e3%83%88%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e3%83%86%e3%82%b9%e3%83%88%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88%e2%85%a1%e5%95%86%e5%93%81%e8%aa%ac%e6%98%8e/</link>
		
		<dc:creator><![CDATA[stj064]]></dc:creator>
		<pubDate>Mon, 03 Feb 2014 01:22:37 +0000</pubDate>
				<category><![CDATA[コンバージョン改善]]></category>
		<category><![CDATA[ユーザビリティ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=9698</guid>

					<description><![CDATA[<p>前回の「支払いプロセス」に引き続き、海外のユーザビリティ関連記事をご紹介します。 3 Things Every Ecommerce Business Should User Test（Usabilla.com） こちらの [&#8230;]</p>
The post <a href="https://mamion.net/2014/02/ec%e3%82%b5%e3%82%a4%e3%83%88%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e3%83%86%e3%82%b9%e3%83%88%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88%e2%85%a1%e5%95%86%e5%93%81%e8%aa%ac%e6%98%8e/">全てのECサイトがユーザーテストで確認しておくべきポイントⅡ：商品説明</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p>前回の<a href="//mamion.net/2014/01/ec%E3%82%B5%E3%82%A4%E3%83%88%E3%81%AE%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BC%E3%83%86%E3%82%B9%E3%83%88%E3%83%9D%E3%82%A4%E3%83%B3%E3%83%88%E2%85%A0%E6%94%AF%E6%89%95%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9/">「支払いプロセス」</a>に引き続き、海外のユーザビリティ関連記事をご紹介します。</p>
<p><a href="//blog.usabilla.com/3-things-every-ecommerce-business-user-test/">3 Things Every Ecommerce Business Should User Test</a>（Usabilla.com）</p>
<p>こちらの記事では、ECサイトのコンバージョン率や売上をアップさせるために、サイトオーナーが特に確認しておくべき3つのポイントが紹介されています。今回はポイントその2、「商品の説明」についての内容です。</p>
<p>＜以下、翻訳して引用＞</p>
<p>&nbsp;</p>
<h3>2.商品の説明</h3>
<p>ECサイトは、実店舗を持つ小売と比べて不利な立場にあります。顧客は商品を触ったり、試着したりすることができません。</p>
<p>これはつまり、「商品の詳細説明」がとても重要だということです。彼らは画像やテキスト、動画などを通してそれらの情報を集めなければいけません。</p>
<p>&nbsp;</p>
<p>こちらはメガネ販売サイトの<a href="//www.warbyparker.com/">Warby Parker</a>の例です。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140203_1.png" alt="140203_1" width="570" height="341" class="alignnone size-full wp-image-9700" srcset="https://mamion.net/wp/wp-content/uploads/140203_1.png 570w, https://mamion.net/wp/wp-content/uploads/140203_1-300x179.png 300w" sizes="(max-width: 570px) 100vw, 570px" /></p>
<p>このページであなたが最初に目にするのは、大きくて美しい、様々な方向から撮影された4枚の写真です。</p>
<p>この写真のすぐ下には、メガネのスペックが書かれています。これは自分の顔によくフィットするメガネを探している人にとって、非常に重要な情報です。彼らは実際にメガネをかけてみることはできませんが、そこにあるサイズ情報が代わりに役立ちます。</p>
<p>スペックの下には、実際の人間がメガネをかけた様子をマウスで様々な角度に動かしながら確認できる画像が用意されています。</p>
<p>さらにWarby Parkerでは、自分の顔写真をアップロードすることで、自分がメガネをかけたときにどう見えるのかバーチャルで確認することができます。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140203_2.png" alt="140203_2" width="570" height="363" class="alignnone size-full wp-image-9701" srcset="https://mamion.net/wp/wp-content/uploads/140203_2.png 570w, https://mamion.net/wp/wp-content/uploads/140203_2-300x191.png 300w" sizes="(max-width: 570px) 100vw, 570px" /></p>
<p>ページの最後には、レンズやフレームの技術的な説明が掲載されています。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140203_3.png" alt="140203_3" width="570" height="322" class="alignnone size-full wp-image-9702" srcset="https://mamion.net/wp/wp-content/uploads/140203_3.png 570w, https://mamion.net/wp/wp-content/uploads/140203_3-300x169.png 300w" sizes="(max-width: 570px) 100vw, 570px" /></p>
<p>多くの顧客はメガネの「スタイル」や「機能」に関心が高いことから、商品詳細ページにこうした情報を記載することは重要です。</p>
<p>もしあなたのオンラインストアが開業して間もないとしても、顧客からの問い合わせ内容からよいヒントが得られるはずです。そうした情報は、ページ内で目立つように表示しなければなりません。</p>
<p>&nbsp;</p>
<p>商品詳細ページのレイアウトをテストしてみることは重要です。例えばこのWarby Parkerの商品詳細ページは多くの情報を掲載していますが、うまくレイアウトされているため、圧迫感やごちゃごちゃした印象を受けることがありません。</p>
<p>もしかしたらユーザーテストに加え、「ABテスト」や「多変量テスト」を行ってみるもの、より多くのコンバージョンを獲得するレイアウトを見つけるのに有効かもしれません。</p>
<p>そしてユーザーテストを行う際は、以下のポイントを特に確認すべきです。<br />
・商品について不明な点を残していないか<br />
・商品の写真は購入を決めるのに十分か<br />
・購入ボタンはすぐに見つけることができるか<br />
・他に必要な情報や、削除すべき情報はないか</p>
<p>商品詳細ページのユーザーテストは、その商品をカートに入れる人を増やしてくれるでしょう。<a href="//mamion.net/2014/01/ec%E3%82%B5%E3%82%A4%E3%83%88%E3%81%AE%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BC%E3%83%86%E3%82%B9%E3%83%88%E3%83%9D%E3%82%A4%E3%83%B3%E3%83%88%E2%85%A0%E6%94%AF%E6%89%95%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9/">前回</a>でしっかりテストをして支払いプロセスが改善されていれば、売上アップは間違いなしですね！</p>
<p>＜翻訳引用ここまで＞</p>
<p>&nbsp;</p>
<h3>補足と感想</h3>
<p>先日、私自身もネットで家電を購入する機会があったのですが、まさしくこの状況が当てはまりました。実物を確認できない分、ECサイトやメーカーサイトの商品ページを穴のあくほど見たのですが、掲載されている情報が足りないと感じました。</p>
<p>結局、型番でGoogle画像検索をして様々な角度からの写真を確認したり、ブログ検索で購入者の生の声を確認するなどして、やっと購入に踏み切れたのです。</p>
<p>&nbsp;</p>
<p>ユーザーテストを行うと、とかく「使いにくくないか」「操作ミスをしていないか」という部分にフォーカスしてしまいがちです。</p>
<p>しかし今回の記事で述べられているように、掲載するコンテンツ自体を念入りに検証し、ユーザーの頭の中にある「不安」「不信」「悩み」などを解消していくことも、コンバージョンや売上のアップには非常に有効なアプローチです。</p>
<p>対面で行うユーザーテストは、そのユーザーが「どう感じているのか」「なにを考えているか」をダイレクトに知ることができる点が、大きな強みだと感じています。</p>
<p>&nbsp;</p>
<p>次回は、「3. 重要な情報の配置」についてご紹介します。</p>
<p>&nbsp;</p>The post <a href="https://mamion.net/2014/02/ec%e3%82%b5%e3%82%a4%e3%83%88%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e3%83%86%e3%82%b9%e3%83%88%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88%e2%85%a1%e5%95%86%e5%93%81%e8%aa%ac%e6%98%8e/">全てのECサイトがユーザーテストで確認しておくべきポイントⅡ：商品説明</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>全てのECサイトがユーザーテストで確認しておくべきポイントⅠ：支払いプロセス</title>
		<link>https://mamion.net/2014/01/ec%e3%82%b5%e3%82%a4%e3%83%88%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e3%83%86%e3%82%b9%e3%83%88%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88%e2%85%a0%e6%94%af%e6%89%95%e3%83%97%e3%83%ad%e3%82%bb%e3%82%b9/</link>
		
		<dc:creator><![CDATA[stj064]]></dc:creator>
		<pubDate>Mon, 27 Jan 2014 01:44:59 +0000</pubDate>
				<category><![CDATA[コンバージョン改善]]></category>
		<category><![CDATA[ユーザビリティ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=9608</guid>

					<description><![CDATA[<p>今回は、海外のユーザビリティ関連記事をご紹介します。 3 Things Every Ecommerce Business Should User Test（Usabilla.com） こちらの記事では、ECサイトのコンバ [&#8230;]</p>
The post <a href="https://mamion.net/2014/01/ec%e3%82%b5%e3%82%a4%e3%83%88%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e3%83%86%e3%82%b9%e3%83%88%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88%e2%85%a0%e6%94%af%e6%89%95%e3%83%97%e3%83%ad%e3%82%bb%e3%82%b9/">全てのECサイトがユーザーテストで確認しておくべきポイントⅠ：支払いプロセス</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p>今回は、海外のユーザビリティ関連記事をご紹介します。</p>
<p><a href="//blog.usabilla.com/3-things-every-ecommerce-business-user-test/">3 Things Every Ecommerce Business Should User Test</a>（Usabilla.com）</p>
<p>こちらの記事では、ECサイトのコンバージョン率や売上をアップさせるために、サイトオーナーが特に確認しておくべき3つのポイントが紹介されています。今回から3回に分けて、その内容を1つずつ翻訳し、コメントとともにご紹介していきたいと思います。（掲載元承認済み）</p>
<p>＜以下、翻訳して引用＞</p>
<p>&nbsp;</p>
<h3>1.支払いプロセス</h3>
<p>あなたのECサイトにおける一連の支払いプロセスは、最も優先順位の高いところにあるべきです。支払いプロセスが素早く簡単に済ませられれば、あなたの顧客はハッピーになり、売上も上がるでしょう。あなたは<strong>「カート放棄率（カゴ落ち率）」</strong>が【66%】以上もあるということをご存知ですか？</p>
<p>こちらのグラフは、人々がカートを放棄してしまう14項目の理由です。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140127_1.png" alt="140127_1" width="660" height="500" class="alignnone size-full wp-image-9673" style="border:1px solid #999999;" srcset="https://mamion.net/wp/wp-content/uploads/140127_1.png 660w, https://mamion.net/wp/wp-content/uploads/140127_1-300x227.png 300w" sizes="(max-width: 660px) 100vw, 660px" /><br />
<small>画像参照：<a href="//www.shopify.com/blog/8484093-why-online-retailers-are-losing-67-45-of-sales-and-what-to-do-about-it">Shopify</a></small></p>
<p>上記14項目のうちの8つは、適切なユーザーテストを行うことで解決することができます。<br />
・予想外の代金がかかることがわかった<br />
・サイトのナビゲーションが複雑すぎる<br />
・サイトがクラッシュした<br />
・支払いプロセスが長すぎる<br />
・過剰なセキュリティチェック<br />
・セキュリティの心配<br />
・時間切れ（セッションタイムアウト）<br />
・外国の通貨で表示されている</p>
<p>訪問者の声を聞き、彼らのニーズにしっかりと目を向ければ、これらの問題の多くは簡単に潰すことができます。ではユーザーテストを通して、彼らにどうやって確認すればよいのでしょうか？</p>
<p>私たちは彼らがクレジットカードでの支払いを拒否されることまでは防ぐことはできませんが、スムースな支払いプロセスを用意することは可能です。</p>
<p>根本的な問題にたどりつくために、次にあげる質問をユーザーテストの際に聞いてみましょう。<br />
・最終的にかかる代金は、あなたが事前に予想していたものでしたか？<br />
・このサイトは、重いと感じませんでしたか？<br />
・支払いプロセスは長いと思いませんでしたか？<br />
・個人情報を入力する際は安全安心だと思いましたか？<br />
・サイトがクラッシュしたり時間切れになったりしませんでしたか？<br />
・支払い通貨は期待していた通りでしたか？</p>
<p>こちらの画像は、よく最適化された支払いプロセスの例です。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140127_2.jpg" alt="140127_2" width="570" height="317" class="alignnone size-full wp-image-9674" srcset="https://mamion.net/wp/wp-content/uploads/140127_2.jpg 570w, https://mamion.net/wp/wp-content/uploads/140127_2-300x166.jpg 300w" sizes="(max-width: 570px) 100vw, 570px" /><br />
<small><a href="//www.crocs.com/">クロックス</a>の支払いページは、良い点がたくさんあります。ステップ数が書いてあったり、ライブチャットが用意されていたり。サイトの読み込みも早く、クラッシュもしませんでした。</small></p>
<p>社内でユーザビリティを確認する場合、自社の社員でテストしてしまうと、客観的な視点を持つことが難しくなります。例えば、サイトの動きが遅かった場合でも、同僚である彼は気を遣って、遅いと感じることは無かったと答えるかもしれません。</p>
<p>逆にあなたのサイトのユーザーや、初めてサイトを使う人たちに尋ねるようにすれば、より妥当で偏見のない意見をもらえるでしょう。これが支払いプロセスを効果的に改善するために必要な、客観的なフィードバックを得るよりよい方法なのです。</p>
<p>支払いプロセスのユーザビリティを改善することで、あなたはカート放棄率を下げ、コンバージョン率を上げることができます。</p>
<p>＜翻訳引用ここまで＞</p>
<p>&nbsp;</p>
<h3>補足と感想</h3>
<p>今回の記事では、ショッピングカートの放棄率が【66%】と報じられていました。あらためて、かなり高い印象を受けますすね…。ちなみに2008年の別の調査でも、【59%】という数値が出ているようです。</p>
<p><a href="//web-tan.forum.impressrd.jp/e/2010/01/07/7125">コンバージョン率2.8%、カート放棄率59% - この平均データをどう活用するのか？</a>（Web担当者Forum）</p>
<blockquote><p>・コンバージョン率（総注文数/総訪問数）は2.8％<br />
・カート放棄率は59％<br />
・入口ページの直帰率は28％</p>
<p align="right"><small>出所：<a href="//web-tan.forum.impressrd.jp/e/2010/01/07/7125">Web担当者Forum</a></small></p>
</blockquote>
<p>この放棄原因のうち、ユーザーテストで簡単につぶせる項目が半分以上あるというのは、とてもわかりやすく効果を説明しているなと感じました。各項目は当たり前といえば当たり前なものなのですが、実際に回答した人がこれだけいるということは、実は多くのサイト制作者側が「対応した気になっている」だけなのかもしれません。</p>
<p>&nbsp;</p>
<p>またユーザーテストを行う際は、社内の人間ではどうしても遠慮がちになるので、客観的な意見を聞くためには外部の人でテストすることが欠かせないという点にも、非常に強く共感しました。またサイトを作った人は、そのサイトを知り過ぎてしまっているため、どう頑張っても初心者の気持ちになるというのは難しいんですよね。</p>
<p>もちろん社内の人間であっても、全くやらないよりはマシです。しかし、マミオンにご依頼をいただいて実際のユーザーでテストを行った場合、その予想外の行動や発言に驚かれる方はかなり多く、最後には「やっておいて本当によかった」という声をほぼ確実にいただいています。</p>
<p>あなたのサイトの支払いプロセスは、こうした客観的な意見を基にして、自信を持って対応していると言えるでしょうか…？</p>
<p>&nbsp;</p>
<p>次回は、「2. 商品の説明」についてご紹介します。</p>
<p>&nbsp;</p>The post <a href="https://mamion.net/2014/01/ec%e3%82%b5%e3%82%a4%e3%83%88%e3%81%ae%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e3%83%86%e3%82%b9%e3%83%88%e3%83%9d%e3%82%a4%e3%83%b3%e3%83%88%e2%85%a0%e6%94%af%e6%89%95%e3%83%97%e3%83%ad%e3%82%bb%e3%82%b9/">全てのECサイトがユーザーテストで確認しておくべきポイントⅠ：支払いプロセス</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>ユーザーテスト動画の分析に大活躍！『WMP Keys』プラグインでホットキーを設定しよう</title>
		<link>https://mamion.net/2014/01/wmp-keys%e3%83%97%e3%83%a9%e3%82%b0%e3%82%a4%e3%83%b3%e3%81%a7%e3%83%9b%e3%83%83%e3%83%88%e3%82%ad%e3%83%bc%e3%82%92%e8%a8%ad%e5%ae%9a%e3%81%99%e3%82%8b/</link>
		
		<dc:creator><![CDATA[stj064]]></dc:creator>
		<pubDate>Tue, 14 Jan 2014 02:53:47 +0000</pubDate>
				<category><![CDATA[ユーザビリティ]]></category>
		<category><![CDATA[ユーザーテストのコツ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=9611</guid>

					<description><![CDATA[<p>「ユーザー調査」を業とするマミオンでは、インタビューの音声データや、ユーザーテスト動画の分析を毎日のように行っています。 今回は、そうした作業における小さなストレスを軽減し、分析のスピードアップに貢献してくれるソフトを2 [&#8230;]</p>
The post <a href="https://mamion.net/2014/01/wmp-keys%e3%83%97%e3%83%a9%e3%82%b0%e3%82%a4%e3%83%b3%e3%81%a7%e3%83%9b%e3%83%83%e3%83%88%e3%82%ad%e3%83%bc%e3%82%92%e8%a8%ad%e5%ae%9a%e3%81%99%e3%82%8b/">ユーザーテスト動画の分析に大活躍！『WMP Keys』プラグインでホットキーを設定しよう</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p>「ユーザー調査」を業とするマミオンでは、インタビューの音声データや、ユーザーテスト動画の分析を毎日のように行っています。</p>
<p>今回は、そうした作業における小さなストレスを軽減し、分析のスピードアップに貢献してくれるソフトを2つご紹介したいと思います。</p>
<p>&nbsp;</p>
<h3>テープ起こし作業に欠かせない「Okoshiyasu2」</h3>
<p><img decoding="async" src="//pc.nikkeibp.co.jp/article/special/20090105/1010999/3_spx291.jpg" width="291" height="249" class="alignnone" /></p>
<p>私がインタビュー調査のテープ起こしの際に愛用しているのが、「Okoshiyasu2」という無料のソフトウェアです。こちらは、調査業務に携わっている方の間では、すでにポピュラーかもしれません。</p>
<p><a href="//pc.nikkeibp.co.jp/article/special/20090105/1010999/">議事録の作成に必須。テープ起こしソフト「Okoshiyasu2」</a>（PC Online）</p>
<blockquote><p>MP3の場合、Windows Media PlayerやiTunesが関連づけられているため、これらのソフトを使って議事録を作成しているユーザーが多い。しかし、これらのソフトは音楽を聞くのには向いていても、議事録の作成には向かない。数秒だけ戻りたいとか、再生速度を遅くしたいといった、議事録の作成に必要な機能は持ってはいないのだ。</p>
<p>実は、こんなときに非常に便利なソフトがある。今回紹介する「Okoshiyasu2」だ。テープ起こしに特化したソフトで、“あればいいなぁ”という機能が満載。まさに“かゆいところに手が届く”ソフトだ。</p>
<p align="right"><small>出所：<a href="//pc.nikkeibp.co.jp/article/special/20090105/1010999/">PC Online</a></small></p>
</blockquote>
<p>私がこのソフトウェアで一番気に入っているところが、「ホットキー」機能です。</p>
<p>PCで音声の再生とテキストの打ち込みを同時に行う場合、いちいち再生/停止操作のためにアクティブウィンドウを切り替えるのは非常に面倒でストレスが溜まります。そんなとき、非アクティブの音声再生ソフトに命令が出せる「ホットキー」機能が設定されていれば、キーボードから手を離さなくても済むので大変便利です。</p>
<blockquote><p>もうひとつ便利な機能が、再生・停止や巻き戻し、早送りなどの操作を自分の好きなキー操作に割り当てられる「ホットキー」機能だ。</p>
<p>ワープロソフトなどで再生内容を記録していく際、音声再生ソフトで巻き戻しなどを実行すると、アクティブウィンドウをいちいち切り替えなければ操作できず、非常に面倒だ。そういうときにホットキーで操作が実行できる。</p>
<p align="right"><small>出所：<a href="//pc.nikkeibp.co.jp/article/special/20090105/1010999/">PC Online</a></small></p>
</blockquote>
<p>&nbsp;</p>
<h3>動画再生ソフトにホットキーを設定するプラグインがあった！</h3>
<p><a href="//asanoken.jugem.jp/?eid=1652">「プロトコル分析」</a>に代表されるように、ユーザーテスト（ユーザビリティテスト）を行ったあとの分析においても、まずは録画したテスト動画からユーザーの行動や発言などを時系列に沿って細かく書き出すことから始まります。</p>
<p>上述した「ホットキー」機能は、こうした動画の分析時にも非常に重宝します。しかし残念なことに、現時点で「Okoshiyasu2」は動画ファイルには対応しておらず、また今後もアップデートは見込めないようです…。</p>
<p>&nbsp;</p>
<p>そこで最近見つけた解決策が、以下でご紹介する「WMP Keys」というWindows Media Player（以下WMP）用のプラグインです。</p>
<p><a href="//www.forest.impress.co.jp/docs/review/20091216_336267.html">「Windows Media Player」にホットキーを割り当てるプラグイン「WMP Keys」</a>（窓の杜）</p>
<p>こちらをインストールすれば、動画においても念願の「ホットキー」が使えるようになり、分析作業の効率が飛躍的に高まります。WMPはWindowsでの標準的な動画再生ソフトなので、それをそのまま使い続けられるのも嬉しい点ですね。</p>
<p>プラグインを利用するためには、下の画像のように、インストール後にWMPのメニューから機能を有効にする必要があります。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140110_1.png" alt="140110_1" width="640" class="alignnone size-full wp-image-9615" srcset="https://mamion.net/wp/wp-content/uploads/140110_1.png 907w, https://mamion.net/wp/wp-content/uploads/140110_1-300x243.png 300w" sizes="(max-width: 907px) 100vw, 907px" /></p>
<p>またホットキーは、プロパティから自分で好きなように設定をすることができます。私は、片手で押しやすく、他のソフトと競合しない「Ctrl + 無変換」を再生/一時停止に、「Ctrl + Shift + 無変換」を5秒巻き戻しに当てて使っています。</p>
<p><img decoding="async" src="//mamion.net/wp/wp-content/uploads/140110_2.png" alt="140110_2" width="372" height="370" class="alignnone size-full wp-image-9616" srcset="https://mamion.net/wp/wp-content/uploads/140110_2.png 372w, https://mamion.net/wp/wp-content/uploads/140110_2-150x150.png 150w, https://mamion.net/wp/wp-content/uploads/140110_2-300x298.png 300w" sizes="(max-width: 372px) 100vw, 372px" /></p>
<p>&nbsp;</p>
<h3>今後も増えていく、テスト動画を「自ら分析する」機会</h3>
<p><a href="//mamion.net/2012/10/%E3%80%8C%E3%83%AA%E3%83%A2%E3%83%BC%E3%83%88%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BC%E3%83%86%E3%82%B9%E3%83%88%E3%80%8D%E5%9B%BD%E5%86%85%E5%A4%96%E3%81%AE10%E5%80%8B%E3%82%92%E3%81%BE%E3%81%A8%E3%82%81/">安価なユーザーテスト手段</a>も普及してきたこともあり、現在では多くの企業においてユーザーテスト動画を分析する機会も増えてきたのではないでしょうか？</p>
<p>こうした動画から一つ一つ行動を抽出していく作業は、非常に地味で時間がかかります。しかし、ファクトに基づいた効果的な改善アプローチを考える上で絶対に欠かせないステップであり、またこれを繰り返していくうちに、ユーザーの行動が肌感覚でわかるようになってきます。</p>
<p>皆さんも、ぜひ上述の2つのソフトを使って、ユーザーの声やテスト動画をたくさん分析してみてください。また今回見つけられなかったのですが、Macで同様の機能を持つソフトをご存じの方がいらっしゃれば、<a href="https://www.mamion.net/contact/index.html">お問い合わせ</a>や<a href="https://www.facebook.com/mamion.jp">Facebookページ</a>から教えていただけると嬉しいです！</p>
<p>&nbsp;</p>The post <a href="https://mamion.net/2014/01/wmp-keys%e3%83%97%e3%83%a9%e3%82%b0%e3%82%a4%e3%83%b3%e3%81%a7%e3%83%9b%e3%83%83%e3%83%88%e3%82%ad%e3%83%bc%e3%82%92%e8%a8%ad%e5%ae%9a%e3%81%99%e3%82%8b/">ユーザーテスト動画の分析に大活躍！『WMP Keys』プラグインでホットキーを設定しよう</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
		<item>
		<title>シニア行動とウェブユーザビリティ</title>
		<link>https://mamion.net/2013/12/%e3%82%b7%e3%83%8b%e3%82%a2%e8%a1%8c%e5%8b%95%e3%81%a8%e3%82%a6%e3%82%a7%e3%83%96%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/</link>
		
		<dc:creator><![CDATA[staff]]></dc:creator>
		<pubDate>Mon, 09 Dec 2013 02:57:29 +0000</pubDate>
				<category><![CDATA[シニア対応]]></category>
		<category><![CDATA[ユーザビリティ]]></category>
		<guid isPermaLink="false">http://mamion.net/?p=9531</guid>

					<description><![CDATA[<p>毎日インターネットをしているシニア女性（64歳）。 先日、うまくお花を送れないと相談され お届け先などを入力している操作シーンを見ていた。 以下は入力画面で間違えたところである。（クリックで拡大できます） シニア層が、な [&#8230;]</p>
The post <a href="https://mamion.net/2013/12/%e3%82%b7%e3%83%8b%e3%82%a2%e8%a1%8c%e5%8b%95%e3%81%a8%e3%82%a6%e3%82%a7%e3%83%96%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/">シニア行動とウェブユーザビリティ</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></description>
										<content:encoded><![CDATA[<p>毎日インターネットをしているシニア女性（64歳）。</p>
<p>先日、うまくお花を送れないと相談され<br />
お届け先などを入力している操作シーンを見ていた。</p>
<p>以下は入力画面で間違えたところである。（クリックで拡大できます）<br />
<a href="//mamion.net/wp/wp-content/uploads/hibiya.gif"><img decoding="async" src="//mamion.net/wp/wp-content/uploads/hibiya.gif" alt="日比谷花壇" width="494" height="750" class="alignnone size-medium wp-image-9532" /></a><br />
シニア層が、なぜ操作を間違えるのか、時折わからなくなる。<br />
今回もこのブログを書くために、そのサイトにもう一度アクセスしたが<br />
どこで間違えるのか、なぜ間違えたのか<br />
記録メモを見なければ解らないほどであった。</p>
<p>彼女は日々ネットを楽しみ、お買い物も慣れている。<br />
だから、ネットに不慣れである、とはいえない。</p>
<p>では、なぜ間違えるのか？私を呼ぶのか？<br />
その間違いは、「シニア行動」によって起きるのではないだろうか、と考えた。</p>
<h3>シニア行動とは何か</h3>
<p>その理由が知りたくて、参考になればとこの本を読んだ。<br />
<iframe src="//rcm-fe.amazon-adsystem.com/e/cm?lt1=_blank&bc1=000000&IS1=1&nou=1&bg1=FFFFFF&fc1=000000&lc1=0000FF&t=oribito-22&o=9&p=8&l=as4&m=amazon&f=ifr&ref=ss_til&asins=4334036600" style="width:120px;height:240px;" scrolling="no" marginwidth="0" marginheight="0" frameborder="0"></iframe><br />
（この本についてはまたいつか機会があれば改めて書きたいと思う。）</p>
<p>シニア行動とユーザビリティの関係を引用する。</p>
<blockquote><p>-第2章　なぜ能力が衰えても自信があるのか　P56--（）内は補足<br />
一定の時間で区切った場合には、（老人は）処理できる情報量が少なくなります。若いころは限られたリソースを効率的に使って、同時に複数の情報を処理ていたのが、老人になるとそれが困難になるのです。<br />
そのため、さまざまな情報を同時に処理しなければならない運転においては、自分が運転するというそのことだけにリソースを使ってしまい、周囲の車や歩行者に注意を払うだけの余裕が残っていないのです。</p>
</blockquote>
<p>64歳シニア女性は、見た目も言動も若々しい。そして、ネットに慣れている。<br />
しかし、シニア行動によって間違いを起こしてしまったということが解る。</p>
<h3>情報処理能力が少なくなるというシニア行動</h3>
<p>これは上記間違え一覧から「シニア行動」によるものをピックアップしたものである。<br />
<a href="//mamion.net/wp/wp-content/uploads/detail_04.gif"><img decoding="async" src="//mamion.net/wp/wp-content/uploads/detail_04.gif" alt="detail_04" width="600" height="150" class="alignnone size-medium wp-image-9533" /></a><br />
(クリックで拡大)</p>
<p>贈り主という文字を読んでいるにもかかわらず<br />
「贈り先」と思い込んで、贈り先の住所の名前・住所を入力している。<br />
→過去の経験を利用</p>
<p>「ご注文者様と同じ」というところを何気なく・意図なく押して<br />
入力した文字が変わった時に、現状を把握するための<br />
処理しなくてはいけない情報量が一気に流入するため、パニックになってしまう。<br />
→情報処理能力の低下</p>
<p>若い人だと、「ああ、そういうことか」とすぐに想像し、理解できるが<br />
一瞬にして情報が流入したため、状況を判断できない。<br />
そのため「できない」という失敗体験につながってしまい、<br />
以後近寄ることを避けられてしまう。</p>
<h3>イレギュラーは「情報過多」になる</h3>
<p>「いつものやり方と違うこと」は、年を取ればとるほど苦手になる。<br />
いつも通りであれば、情報の量も少なく処理はストレスではない。</p>
<p>しかし、「いつもと違うこと」というのは<br />
若いころには「新鮮」「驚き」「ワクワク」だったことが<br />
「少し面倒なこと」に代わる。</p>
<p>「前と同じがいい」<br />
「以前の方が使いやすかった」という声が<br />
リニューアル後に出やすいのも<br />
新しいことという「情報」が過多で<br />
ユーザーにストレスを与えているのだ。</p>
<p>こちらも「過多な情報」で状況判断ができなくなり、ストップしている状態である。<br />
<a href="//mamion.net/wp/wp-content/uploads/detail_07.gif"><img decoding="async" src="//mamion.net/wp/wp-content/uploads/detail_07.gif" alt="detail_07" width="600" height="110" class="alignnone size-medium wp-image-9534" /></a><br />
（クリックで拡大）</p>
<p>今まで、いろいろなものに入力してきたのが<br />
自分の経験してきたものと異なり、尚且つ対応の仕方が経験則になく<br />
情報過多のような状況になり、判断不能に陥った。</p>
<p>彼女としては、クリックして消えるのは理解できる。<br />
だが、ほかのところをクリックするとその文字がまた入力されてしまう。<br />
その入力された状態で送られたらどうしよう、と思ったわけだ。</p>
<h3>操作に慣れてても加齢の影響が華麗に…</h3>
<p>先日、若い人とご高齢者はどう違うんだろう、<br />
どのように違ってくるんだろうと、考えていた。</p>
<p>小さいころ、石ころが宝石に見えていたのに<br />
大人になると、石ころは石ころにしか見えなくなる。</p>
<p>新しいことに出会えてワクワクしやすい子どもと<br />
新しいことに出会うと、ちょっと腰が引けてしまう大人。<br />
「若い人にはついていけない」というセリフが出てくる。</p>
<p>「前の方がよかった」という「使えていた時」への固執。<br />
「あの頃使えてたんだよ」という自己肯定感。<br />
（これも老化現象の一種らしい）</p>
<p>経験則にないもの、考えなくてはいけないことは、<br />
判断不能になりやすい。</p>
<p>もし、シニア層にウェブサイトを使ってほしいと思うなら<br />
「シニア行動対策」は避けては通れないことを認識しなくちゃいけない。</p>
<p>（加齢に華麗は、言いたかっただけである。）</p>The post <a href="https://mamion.net/2013/12/%e3%82%b7%e3%83%8b%e3%82%a2%e8%a1%8c%e5%8b%95%e3%81%a8%e3%82%a6%e3%82%a7%e3%83%96%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%93%e3%83%aa%e3%83%86%e3%82%a3/">シニア行動とウェブユーザビリティ</a> first appeared on <a href="https://mamion.net">マミオン有限会社-パソコン・数学研修、法人研修</a>.]]></content:encoded>
					
		
		
			</item>
	</channel>
</rss>
