<?xml version="1.0" encoding="utf-8" ?>
<feed version="0.3"
	xml:lang="ja"
	xmlns="http://purl.org/atom/ns#"
	xmlns:dc="http://purl.org/dc/elements/1.1/">
	<title>へたれwebディレクターの覚え書き</title>
	<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/" />
	<modified>2010-08-13T12:55:51+00:00</modified>
	<tagline><![CDATA[インターネットの使い勝手を良くするために思いついたことの記録です]]></tagline>
	<generator url="http://serenebach.net/">Serene Bach</generator>
	<entry>
		<title>twitter疲れ、Facebook疲れの人にお勧めしたい『threadsy』</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=251" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=251</id>
		<issued>2010-06-15T22:55:06+09:00</issued>
		<modified>2010-06-15T13:55:06Z</modified>
		<summary> “タイムライン疲れ”してますか？ タイムライン形式のいわゆる「ミニブログ」「リアルタイムウェブ」と呼ばれるサービスが増えています。Twi...</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>使い勝手 &gt; 使いやすい</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[<h3> “タイムライン疲れ”してますか？ </h3><br />
タイムライン形式のいわゆる「ミニブログ」「リアルタイムウェブ」と呼ばれるサービスが増えています。Twitter、Facebook、アメーバなう、Mixiボイスなどがそれにあたります。<br />
<br />
使い始めた最初のうちはフォローの数が増えてくるとうれしいですし、タイムライン（以下『TL』と表記）を追うのが楽しいですが、追うべき情報は日々増える一方。いつしか、TLを追うことが義務っぽくなってきます。Twitter疲れというやつです。 <br />
（ここではTwitterに限らないので『タイムライン疲れ』と呼ぶことにします）<br />
<br />
そんなタイムライン疲れな方にぜひ一度使っていただきたい『Threadsy』というサービスをご紹介します。<br />
<br />
<br />
<h3>threadsyとは </h3><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://threadsy.files.wordpress.com/2010/05/beta_1wholeapp_noted1.png" class="pict" alt="画面1・Threadsyの画面（公式ブログの画像を利用しています）" title="画面1・Threadsyの画面（公式ブログの画像を利用しています）" width="1520" height="980"><img src="http://threadsy.files.wordpress.com/2010/05/beta_1wholeapp_noted1.png" class="pict" alt="画面1・Threadsyの画面（公式ブログの画像を利用しています）" title="画面1・Threadsyの画面（公式ブログの画像を利用しています）" width="304" height="196" /></a><br />
Threadsyとは複数サービスのTLをひとまとめに表示する『フィードアグリゲータ』と呼ばれるサービスで、以下のような特徴を持っています。<br />
<ul><li>Twitter、Facebook、Gmailなど、複数サービスの情報を一つのTLにまとめることができる</li><li>マルチポスト（複数サービスに動じ投稿）可能</li><li>「自分宛の情報のみのTL」「全情報がマージされたTL」の2ペイン方式（これがかなり便利）</li><li>「自分宛の情報のみのTL」は既読・未読処理対応</li><li>強力な検索機能</li><li>いいね！もリツイートも、Threadsy上で行える</li><li>もちろんプレビューも豊富。Flickr、Youtube、Twitpicなどなど複数サービスに対応。</li><li>Meebo、Facebook、AIMチャットのクライアントにもなる</li><li>日本語でレスするとたまに文字化けする（汗）</li></ul><br />
<br />
<h3>なぜThreadsyがいいのか？ ほかのフィードアグリゲータの問題点 </h3><br />
フィードアグリゲータサービスはほかにいくつか存在します。いくつか使って見ましたが、以下のような理由で使い続けるにいたりませんでした。<br />
<br />
<h4> 情報過多問題が解決していない </h4><br />
タイムライン疲れの理由の一つ「単純に情報が多すぎる」は、ただ情報を一つにまとめたところで解決しません。見やすくはなっても情報の量は変わっていないからです。<br />
<br />
情報過多問題を対策するために、Twitterだけ、Facebookだけといったように表示するサービスを絞り込む機能を提供している場合もありますが、それはただ振り出しに戻っただけです。<em>せっかく複数サービスの情報をまとめたのに、問題を解決する方法が「サービスごとに再びわける」というのではあまりに脳がありません</em>。<br />
<br />
<h4> 価値の異なる情報を同列に扱っている </h4><br />
TLに表示される情報は、自分にとってすべて同じ価値ではありません。自分のつぶやきにつけられたレスやじっくり書かれた友だちの日記が、「朝だ、起きた」というつぶやきと同じ価値なはずがありません。<br />
<br />
それでも情報が少ないうちは目で追いながら価値を選別できましたが、情報が多くなってくるとそれもかないません。<br />
<br />
<br />
<h3>そこでThreadsy</h3><br />
Threadsyでは、「自分に宛てられた情報」と「すべての情報」をペイン分けして表示します。<br />
右ペインには、すべての情報が単純に時系列で並べられます。<br />
<em>左ペイン（下の画面で枠囲い部分）には、Facebookでの発言に対してのコメント、自分のTwitterでのつぶやきへのリツイート、自分宛のメール、自分のFrickrの写真につけられたコメントなど、「自分に対しての誰かからのアクション（と思われるもの）」だけが抽出されます</em>。<br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/10061502_mythreadsy.png" class="pict" alt="画面2・私のThreadsy画面（モザイクをかけています）" title="画面2・私のThreadsy画面（モザイクをかけています）" width="640" height="471"><img src="http://www.studio-no9.com/sb/img/thm141_10061502_mythreadsy.png" class="pict" alt="画面2・私のThreadsy画面（モザイクをかけています）" title="画面2・私のThreadsy画面（モザイクをかけています）" width="320" height="235" /></a><br />
<br />
私は、自分宛の情報は常にチェックして、そうではない情報は寝る前になんとなく流し読む（ぜんぶ読まなくてもいい）という使い方をしています。<br />
<br />
<em>自分の読むべき情報が絞られるのでタイムライン疲れになりません</em>し、右ペインがあるおかげで「なんとなく情報が流れる」Twitter本来の楽しさを失うこともありません。<br />
<br />
<br />
<h3>まとめ</h3><br />
Webから受け取る情報はこれからもどんどん増えていくでしょう。<br />
情報をどのように整理するのか、がサービスの差別化要因になっていくと思います。<br />
「ファインダビリティ」「情報アーキテクチャ」といった分野は重要になっていくでしょう。<br />
<br />
Threadsyがその完成系なわけではありませんが、現時点では優れた例の一つといえます。ぜひお試しください。<br />
<br />
<br />
<h3>関連リンク</h3><br />
<a href="http://www.threadsy.com/" target="_blank" title="外部サイト『Threadsy』を別ウィンドウで開きます">http://www.threadsy.com/</a>]]></content>
	</entry>
	<entry>
		<title>「URLなどが途中で折り返しされず表示枠をはみ出てしまう」問題を解決するCSSが紹介されていたので試してみた</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=250" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=250</id>
		<issued>2010-06-05T21:35:47+09:00</issued>
		<modified>2010-06-05T12:35:47Z</modified>
		<summary>海外のサイトで『Wrapping Long URLs and Text Content with CSS』という、長いURLやテキストの途中でも、枠をはみ出すことなく折り返すCSSを紹介する記事を見...</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>Web &gt; CSS</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[海外のサイトで『<a target="_blank" href="http://perishablepress.com/press/2010/06/01/wrapping-content/" title="外部サイト『Perishable Press』の「Wrapping Long URLs and Text Content with CSS』ページを別ウィンドウで開きます">Wrapping Long URLs and Text Content with CSS</a>』という、長いURLやテキストの途中でも、枠をはみ出すことなく折り返すCSSを紹介する記事を見つけたので、実際のサービスで使えるの？という視点で試してみました。<br />
<br />
<br />
<h3>「URLなどが途中で折り返しされず表示枠をはみ出てしまう」問題とは？</h3><br />
ちょっと前に『<a href="http://www.studio-no9.com/sb/sb.cgi?eid=236" title="このブログの『Firefox3.1（3.5）では半角文字の途中でも改行できる』に遷移します">Firefox3.1（3.5）では半角文字の途中でも改行できる</a>』でも書きましたが、 ブラウザによっては、記号を含まない半角文字列やURLを途中で折り返すことなく、表示枠をはみ出して表示してしまうことがあります。<br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/09040504_mixifriend.png" class="pict" alt="画像1・半角文字列で文字が折り返されない例" title="画像1・半角文字列で文字が折り返されない例" width="324" height="271"><img src="http://www.studio-no9.com/sb/img/thm119_09040504_mixifriend.png" class="pict" alt="画像1・半角文字列で文字が折り返されない例" title="画像1・半角文字列で文字が折り返されない例" width="162" height="135" /></a><br />
<br />
対策として、文中に強制的に改行を入れたり、&lt;wbr&gt;タグを挿入したりしているサービスもあります。しかしこれは、コードが冗長になってしまいエレガントではないという問題が発生しますし、なにより構造化言語であるhtmlの趣旨に反してしまっています。<br />
<br />
また、&lt;wbr&gt;を単純に一定文字数ごとに挿入することで句読点が行頭に来てしまい、可読性を損なってしまう場合もあるようです。（どうせやるなら、せめて禁則処理ぐらいすればいいのに、と思ったりもします）<br />
<br />
<br />
個人的には「ちゃんと折り返されないのは、ブラウザがそう解釈してるんだから仕方ないじゃん」と思います。<br />
しかし企業が提供するサービスではそうも言ってはいられず、「ユーザーの名前やIDはすべて表示しなければならない」などの厳格なレギュレーションが規定されていることがあり、対応しないといけないもののようです。<br />
<br />
<br />
<h3>表示確認</h3><br />
ということで、前述のCSSが、この問題の救いの神になるのかどうか試してみました。<br />
より実際の使い方に近い動作にするため、<br />
<ul><li>preタグ以外のタグでも動作するか（今回はddタグで試しています）</li><li>文中に空白スペースが含まれている場合はどうか</li><li>日本語の場合はどうか</li><li>リンクが挿入されている場合はどうか</li></ul><br />
を各種ブラウザで確認してみました。<br />
<br />
ブラウザで動作を確認したい場合やコードを確認したい場合は<a href="http://studio-no9.com/sb/sample/wraptest/index.html" target="_blank" title="サンプルページを別ウィンドウで開きます">こちらをどうぞ</a>。<br />
<br />
<br />
<h4>safari4（mac）</h4><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/20100605_safari4wrap.png" class="pict" alt="画像2・safari4（mac）での表示" title="画像2・safari4（mac）での表示" width="247" height="730"><img src="http://www.studio-no9.com/sb/img/thm133_20100605_safari4wrap.png" class="pict" alt="画像2・safari4（mac）での表示" title="画像2・safari4（mac）での表示" width="108" height="320" /></a><br />
<br />
<h4>Firefox3.6（mac）</h4><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/20100605_ff36wrap.png" class="pict" alt="画像3・Firefox3.6（mac）での表示" title="画像3・Firefox3.6（mac）での表示" width="248" height="886"><img src="http://www.studio-no9.com/sb/img/thm134_20100605_ff36wrap.png" class="pict" alt="画像3・Firefox3.6（mac）での表示" title="画像3・Firefox3.6（mac）での表示" width="89" height="320" /></a><br />
<br />
<h4>Google Chrome5（mac）</h4><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/20100605_gcromewrap.png" class="pict" alt="画像4・Google Chrome5（mac）での表示" title="画像4・Google Chrome5（mac）での表示" width="248" height="869"><img src="http://www.studio-no9.com/sb/img/thm135_20100605_gcromewrap.png" class="pict" alt="画像4・Google Chrome5（mac）での表示" title="画像4・Google Chrome5（mac）での表示" width="91" height="320" /></a><br />
<br />
<h4>IE8（win）</h4><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/20100605_ie8wrap.png" class="pict" alt="画像5・IE8（win）での表示" title="画像5・IE8（win）での表示" width="248" height="669"><img src="http://www.studio-no9.com/sb/img/thm136_20100605_ie8wrap.png" class="pict" alt="画像5・IE8（win）での表示" title="画像5・IE8（win）での表示" width="118" height="320" /></a><br />
<br />
<h4>IE7（win）</h4><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/20100605_ie7wrap.png" class="pict" alt="画像6・IE7（win）での表示" title="画像6・IE7（win）での表示" width="248" height="666"><img src="http://www.studio-no9.com/sb/img/thm137_20100605_ie7wrap.png" class="pict" alt="画像6・IE7（win）での表示" title="画像6・IE7（win）での表示" width="119" height="320" /></a><br />
<br />
<h4>IE6（win）</h4><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/20100605_ie6wrap.png" class="pict" alt="画像7・IE6（win）での表示" title="画像7・IE6（win）での表示" width="248" height="666"><img src="http://www.studio-no9.com/sb/img/thm138_20100605_ie6wrap.png" class="pict" alt="画像7・IE6（win）での表示" title="画像7・IE6（win）での表示" width="119" height="320" /></a><br />
<br />
<h4>Opera10.5（mac）</h4><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/20100605_opera1053wrap.png" class="pict" alt="画像8・Opera10.5（mac）での画像" title="画像8・Opera10.5（mac）での画像" width="249" height="767"><img src="http://www.studio-no9.com/sb/img/thm139_20100605_opera1053wrap.png" class="pict" alt="画像8・Opera10.5（mac）での画像" title="画像8・Opera10.5（mac）での画像" width="103" height="320" /></a><br />
<br />
<h4>Opera9.27（mac）</h4><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/20100605_opera927wrap.png" class="pict" alt="画像9・Opera9.27（mac）での画像" title="画像9・Opera9.27（mac）での画像" width="369" height="716"><img src="http://www.studio-no9.com/sb/img/thm140_20100605_opera927wrap.png" class="pict" alt="画像9・Opera9.27（mac）での画像" title="画像9・Opera9.27（mac）での画像" width="164" height="320" /></a><br />
<br />
<br />
<h3>まとめ</h3><br />
結論ですが、<strong>このCSS、使ってもいいけど、別に無理に使う必要はないんじゃないの？</strong>となります。ここまで長々と書いておいてなんですが…。<br />
<br />
表示結果を見て、最初は「すばらしい！」と思ったのですが、<em>今回のこの表示結果って<a href="http://www.studio-no9.com/sb/sb.cgi?eid=236" title="このブログの『Firefox3.1（3.5）では半角文字の途中でも改行できる』に遷移します">前回のword-wrapを利用したとき</a>と同じ</em>なんですよね。<br />
ならば、word-wrapを使った方がCSSが簡潔になるので、そちらのほうが良いと思います。<br />
（word-wrapとwhite-spaceってどう使い分けるんだろう…？ 折り返しルールの制御ならやはり“wrap”ってついてるほうなんでしょうか）<br />
<br />
word-wrapプロパティに限ってはIE6も先行対応してたりします。Firefox3.0は未対応ですが、これは特に問題にならないでしょう。<br />
<br />
<br />
ちなみに下記のようなささやかな問題もありますので、念のために書いておきますね。<br />
<ul><li>半角スペースなどの特殊記号が含まれるとどうしてもそこで折り返されてしまう</li><ul><li>“word-wrap: break-word;”を指定しなければいいのかな？と思ったが、なにも変化はなかった</li><li>しかし実際のサービスで、これが問題になることはほとんどないと思われる</li></ul><li>IE以外のブラウザで過去のバージョンだとうまく折り返されない場合がある</li><ul><li>しかしIE以外のブラウザを使っている人のほとんどはブラウザを最新バージョンにしているであろうし、シェアも低いので考慮しなくて良いと思われる</li></ul></ul><br />
<br />
<br />
なにかの参考になれば幸いです。]]></content>
	</entry>
	<entry>
		<title>Adobe CS5はCS4と比較して実質値上げしている気がする</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=249" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=249</id>
		<issued>2010-04-12T23:42:58+09:00</issued>
		<modified>2010-04-12T14:42:58Z</modified>
		<summary>単なる愚痴です。Adobe CS5が発表されましたが、これだけ世はデフレで円高も進んだのに、実質値上げされていることに驚き、そしてがっかりしま...</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>日常生活</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[
<p>
単なる愚痴です。
</p>

<p>
Adobe CS5が発表されましたが、これだけ世はデフレで円高も進んだのに、実質値上げされていることに驚き、そしてがっかりしました。
</p>

<p>
私はいまだにSTUDIO-8ユーザーなのですが、これをWEB PREMIUMにアップグレードするときの価格を、CS4発表当時のそれと比較してみましょう。<br />
（数字の端数はテキトーにカットしています）
</p>


<style type="text/css">
<!--
table {
	background-color:#FFFFFF;
	border-collapse:separate;
	border-spacing:1px;
	margin-bottom:1em;
	font-size: 0.75em;
}
td {
	line-height:1.35;
	padding:0.35em 2ex;
}
tr {
	background-color:#F0F1F1;
}
th {
	background-color:#999999;
	color:#FFFFFF;
	text-shadow:1px 1px 0 #333333;
}
-->
</style>
<h4>表1・STUDIO-8からWeb PREMIUMへのアップグレード価格</h4><table>
<thead>
<tr>
<th>発表日</th>
<th>アップグレード価格（US）</th>
<th>同（JP）</th>
<th>製品発表当時の<br/>円ドル為替レート</th>
<th>アドビジャパン内<br/>為替レート？</th>
</tr>
</thead>
<tbody>
	<tr>
		<td>CS4<br/>（2008/09/23）</td>
		<td>$799</td>
		<td><em>123,900円</em></td>
		<td>$1 = 約106.1円</td>
		<td>$1 = <em>約155.0円</em></td>
	</tr>
	<tr>
		<td>CS5<br/>（2010/04/12）</td>
		<td>$799</td>
		<td><em>134,400円</em></td>
		<td>$1 = 約93.3円</td>
		<td>$1 = <em>約167.7円</em></td>
	</tr>
	</tbody>
</table>
（正確な価格表は
<a href="http://www.adobe.com/jp/products/creativesuite/web/upgrade/" target="_blank" title="外部サイト『Adobe store』の該当ページを別ウィンドウで開きます">Adobeのサイト</a>でご確認ください）

<p>
<br />
しかも<em>CS4発売当時は、キャンペーン価格として発売から半年は92,400円でアップグレードできました</em>。それと比較してしまうと。。。
</p>

<p>

</p>

<p>
「日本人は金払いがいいぜ！」って感じなんでしょうか。
</p>
]]></content>
	</entry>
	<entry>
		<title>サイトのUI検討にAIDA・AIDMAモデルが使えそうな気がしたので試してみる</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=248" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=248</id>
		<issued>2010-02-14T01:32:07+09:00</issued>
		<modified>2010-02-13T16:32:07Z</modified>
		<summary>マーケティングのフレームワークに「AIDAモデル」「AIDMAモデル」というのがあります。おおざっぱに言うと、商品に気づいてから購入にいたるま...</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>Web &gt; UI / design</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[マーケティングのフレームワークに「AIDAモデル」「AIDMAモデル」というのがあります。<br />
おおざっぱに言うと、商品に気づいてから購入にいたるまでのプロセスを、<ol><li>Attention（注目）</li><li>Interest（関心）</li><li>Desire（欲求）</li><li>Memory（記憶）, Motive（動機）</li><li>Action（行動）</li></ol><br />
に分けた消費行動の法則で、AIDAやAISASなども使われることもあります。（詳しくは<a target="_blank" href="http://ja.wikipedia.org/wiki/AIDMA" title="外部サイト『Wikipedia』の「AIDMA」ページを別ウィンドウで開きます">Wikipedia</a>などをご確認ください）<br />
<br />
<br />
このAIDA・AIDAMAモデルがUI検討にも使えるのではないか？と思い立ち、そのやり方を考えてみます。<br />
<br />
<br />
例として、以下のような状況に置かれたときの改善案をAIDAモデルで検討する、というのをやってみます。<br />
<br />
<div class="panel">あなたはファッション関連のケータイ用ブログを運営しています。そのブログは、訪問者数は多いのですが、離脱率が高いという問題を抱えています。<br />
<br />
アクセスログを解析したところ、検索サイト経由でブログのエントリーを読んでくれた人の多くは、ほかのエントリーを見ることなく離脱していることがわかりました。<br />
離脱率を下げるためには、ほかのエントリーに遷移するリンクをクリックしてもらうことが必要そうです。<br />
<br />
では、訪問者に、ほかのエントリーを読むためのリンクをクリックしてもらうために、どのような工夫をすればいいでしょうか？<br />
</div><br />
<br />
<br />
<h3>エントリーを読んだ人が他の記事を読むための条件をAIDAモデルで考える</h3><br />
クリックして欲しいリンクがある。このような状況のとき、<br />
「リンクをもっと目立たせればいいのでは」<br />
といった短絡的な判断になりがちです。<br />
<br />
これをAIDAモデルを使うとどのようになるのか、こういうふうに検討していくというのはどうだろうか、というのをステップごとに記してみます。<br />
<br />
<br />
<h4>ステップ1・AIDAに、訪問者が満たされるべき欲求を当てはめる</h4><br />
まずは、あるエントリーを見た訪問者が、ほかのエントリーへのリンクをクリックするために満たされなければならない欲求を、AIDAに当てはめてみました。<br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/2010021401.png" class="pict" alt="図1・満たされなければならない欲求をAIDAに当てはめた図" title="図1・満たされなければならない欲求をAIDAに当てはめた図" width="800" height="600"><img src="http://www.studio-no9.com/sb/img/thm128_2010021401.png" class="pict" alt="図1・満たされなければならない欲求をAIDAに当てはめた図" title="図1・満たされなければならない欲求をAIDAに当てはめた図" width="320" height="240" /></a><br />
<ul><li>Attention：このブログにほかのエントリーが存在することに気づいてもらう</li><li>Interest： ほかのエントリーも、訪問者が興味のあるファッション関連のものだと思ってもらう</li><li> Desire：これまで条件にプラス、このブログのほかのエントリーが、ユーザーが期待してるレベルに達していると思ってもらう</li><li>Action：このブログのほかのエントリーへたどるためのボタン（リンク）をクリックできる状態にある</li></ul><br />
<br />
 <br />
<h4>ステップ2・欲求を満たすための条件を洗い出す</h4><br />
欲求を当てはめることにより、欲求を満たすための条件が見えてきました。<br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/2010021402.png" class="pict" alt="図2・欲求を満たすための条件" title="図2・欲求を満たすための条件" width="800" height="600"><img src="http://www.studio-no9.com/sb/img/thm129_2010021402.png" class="pict" alt="図2・欲求を満たすための条件" title="図2・欲求を満たすための条件" width="320" height="240" /></a><br />
<br />
たとえば、InterestとDesireを満たすためには、訪問者に「ほかのエントリーも読む価値がありそうだ」と思ってもらわなければならない、ということがわかります（図の条件①）。<br />
<br />
さらに、「面白そうだ」と思ってもらっているときに、そのリンクを提供してあげる必要もありそうです（条件②）。<br />
<br />
<br />
特に条件①は重要です。ほかのエントリーも面白そうだと思ってもらうには、「いま読んだエントリーは自分が読みたいジャンルと一致」していてかつ「いま読んだエントリーが面白いと思った」という条件が満たされていなければなりません。<br />
<br />
しかしすべての訪問者が、この条件を満たしているとは限りません。ここで、<em>「条件を満たしていない訪問者のことも考える必要がある」ことに気づけました</em>。<br />
<br />
では条件を満たしていない訪問者とはどのような状態にあり、それに対してどのような施策を打たなければならないでしょうか。<br />
<br />
<br />
<h4>ステップ3・訪問者の状態ごとに条件を再度洗い出す</h4><br />
訪問者の状態のパターンを洗い出してみます。<br />
ここでは簡略的に、「ファッションに興味があるかどうか」「いま読んだエントリーに満足したかどうか」で分けてみました。<br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/2010021403.png" class="pict" alt="図3・訪問者の状態を加えた図" title="図3・訪問者の状態を加えた図" width="800" height="600"><img src="http://www.studio-no9.com/sb/img/thm130_2010021403.png" class="pict" alt="図3・訪問者の状態を加えた図" title="図3・訪問者の状態を加えた図" width="320" height="240" /></a><br />
実際のサービス検討では、「どこからこのページにたどり着いたか」「目的があって探しているのかどうか」などなどなど、もっと細分化するべきかと思います。<br />
<br />
<br />
状態ごとに改めて欲求を満たす方法を検討することことで、さらに新たな条件が見えてきました。<br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/2010021404.png" class="pict" alt="図4・新たな条件を加えた図" title="図4・新たな条件を加えた図" width="800" height="600"><img src="http://www.studio-no9.com/sb/img/thm131_2010021404.png" class="pict" alt="図4・新たな条件を加えた図" title="図4・新たな条件を加えた図" width="320" height="240" /></a><br />
一つは「状態２・ファッションに興味はあるがエントリーに不満足」の訪問者に対してDesire欲求を満たすためには、なんらかの工夫が必要であること（条件③）。<br />
<br />
<br />
この時点で、<em>訪問者の状態によって表示するリンク（機能）は違っていてもいいのでは、と思えてきました</em>。単純なほかのエントリーへのリンクは、いま読んだエントリーに満足した訪問者にしかクリックする気になってくれないことがわかったからです。<br />
<br />
訪問者の状態に適したリンクを出し分けるのが効果的であるとするなら訪問者ごとに有効なリンクを表示させるために、<br />
「エントリーを読んだことによる訪問者満足度をなんらかの方法で把握する必要がある」<br />
という条件を加える必要もありそうに思います。(条件④）。<br />
<br />
<br />
（条件５は今回はパス）<br />
<br />
<br />
<h4>ステップ4・それぞれの条件を検討</h4><br />
ここまでで、ほかのエントリーへのリンクをクリックしてもらうために必要な条件がいくつ洗い出せました。<br />
<br />
ではその条件を満たすための案を検討<br />
サンプル代わりにベタな検討案を書いておきます。<br />
<br />
<ul><li>条件１の対応</li><ul><li>「前の記事」のようなリンクではなく、エントリータイトルを表示させることにより、リンク先の記事も同じジャンルである（もしくは違うジャンルであること）をクリックする前にわからせる</li><li>記事カテゴリごとになるべく同じカテゴリーの記事を紹介する</li><li>いま読んだ記事と似ている記事を表示する</li></ul><li>条件２の対応</li><ul><li>適切な位置にリンクを表示させる</li></ul><li>条件３の対応</li><ul><li>単純な送りリンクに加え、目立つ場所に人気の記事一覧を掲載する。</li><ul><li>その際、ブックマーク登録数を表示することで、公平な評価であるというイメージも伝える。</li></ul></ul><li>条件４の対応</li><ul><li>エントリー本文を（一定以上の長さなら）分割して表示する。</li><li>1ページ目には、ほかのエントリーを読んでもらうことをあきらめてて、別のリンク（機能）を提供する</li><ul><li>たとえば、このエントリーにたどり着いたのが検索からなら、改めて検索結果をこのブログ内に表示させ、そこに広告を表示して稼ぐ、など</li></ul><li>2ページ目以降が表示されたなら、「いまこの訪問者はこのエントリーを面白いと思って読んでいる状態（面白いと思わなければ1ページ目で離脱しようとするはず）」と仮定し、それ用のリンクを表示させる</li></ul></ul><br />
<br />
<br />
<h3>AIDAモデルによってたどり着いた検討結果</h4><br />
「訪問者の離脱率を下げる」という目的のために、「エントリーを複数ページに分割して表示する」という、一見なんの関連もなさそうな、もしかしたら逆効果と思われるようなUI案にたどり着きました。<br />
<br />
今回は個人で試しにやってみただけなので、たどり着いた結果が正しいかどうかはわかりません。<br />
しかしあとで大手ブログのケータイ版などを見たところ、しっかりと一つのエントリーでも分割されたページごとにリンクの出し分けがされているものがありました。<br />
あながち荒唐無稽な策ではないようです。<br />
<br />
<br />
<h3>まとめ：認知的ウォークスルーにも似てますね</h3><br />
ここまで書いていて、このやり方って「認知的ウォークスルー」に似ているな、と思いました。<br />
<br />
違いは、認知的ウォークスルーがアクション需要に対しての供給視点で、AIDA・AIDAMAモデルはアクションへの需要視点である、と言えるかもしれません。<br />
<br />
私自身がまだ認知的ウォークスルーもAIDA・AIDAMAモデル方式も完全に理解実践できてるわけではありませんので、今後、双方を比較しながら何度かやってみて、それぞれに合った場面を見つけたいと思っています。]]></content>
	</entry>
	<entry>
		<title>ヤフーで除夜の鐘が鳴らせる</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=247" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=247</id>
		<issued>2009-12-31T15:23:12+09:00</issued>
		<modified>2009-12-31T06:23:12Z</modified>
		<summary>ヤフートップページの鐘が、クリックで鳴らせます。108回鳴らすと何が起きるんでしょうか。。。</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>日常生活</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[
<p>
<a href="http://www.yahoo.co.jp" target="_blank">ヤフートップページ</a>の鐘が、クリックで鳴らせます。
</p>

<p>
108回鳴らすと何が起きるんでしょうか。。。
</p>

<p>
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/img127_file.png" class="pict" alt="画像1・Yahoo！のトップ画像" title="画像1・Yahoo！のトップ画像" width="640" height="107"><img src="http://www.studio-no9.com/sb/img/thm127_file.png" class="pict" alt="画像1・Yahoo！のトップ画像" title="画像1・Yahoo！のトップ画像" width="320" height="53" /></a>
</p>
]]></content>
	</entry>
	<entry>
		<title>ユーザーは自分の行動をメリットだけで判断していない</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=246" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=246</id>
		<issued>2009-12-09T22:33:56+09:00</issued>
		<modified>2009-12-09T13:33:56Z</modified>
		<summary>せっかくサービスを作ったら閲覧だけでなく、あたりまえですが投稿などもしてもらいたいものです。サービス上でユーザーにアクションをして...</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>Web &gt; UI / design</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[せっかくサービスを作ったら閲覧だけでなく、あたりまえですが投稿などもしてもらいたいものです。<br />
<br />
サービス上でユーザーにアクションをしてもらうために、「このアクションをしてください、するとこんな素敵な出来事が！」とメリットを伝えるのはよくあるやり方だと思います。<br />
<br />
たとえばCGM系サービスを運営していて、「ユーザーにコメント投稿してほしいな」と思ったなら、<br />
「あなたがコメントを投稿すると、そのコメントがほかの人に読まれ、そこからコミュニケーションが広がっていきます」<br />
などでしょうか。<br />
<br />
<br />
しかしユーザーは、自分がアクションするかどうを、メリットだけをみて決めているわけではないと思います。<br />
<br />
コメントをしようと思ったときにメリットとは逆の、<br />
「このコメントをすると、誰かに迷惑かけないだろうか？」<br />
「自分に対してよくないことが起きないだろうか？」<br />
ということも考えているのではないでしょうか。<br />
<br />
<br />
<h3>アクションしてもらうために必要な「許しのデザイン」</h3><br />
アクションしてもらうためには、これらの不安を払拭する必要があります。そのための機能やデザインのことを僕は「許しのデザイン」と呼んでいます。<br />
<br />
「許しのデザイン」の例として、たいして意味のないコメントを投稿しても大丈夫だよね、と思わせる工夫されているサービスを挙げてみます。<br />
<br />
<br />
<h4>Twitterの場合</h4><br />
Twitterでは、投稿された発言（つぶやき）がたとえfollowの発言であっても見落として平気、という世界観がうまく構築されています。その世界観が、「邪魔なら無視されるだけだから、だからガンガン発言して大丈夫」と思うために役立っています。<br />
<br />
<br />
<h4>Facebookの場合</h4><br />
たくさん発言しても迷惑にならないよう表示方法が工夫されています。<br />
連続して発言すると、発言のうちのいくつかが、クリックしないと表示されないようになります。<br />
<br />
また、最近追加された「ニュースフィード」では重要そうな発言を上位にピックアップして表示するようになっているようです。（まだまだ不完全ですが）<br />
<br />
<br />
<h3> ソーシャル系サービスほど許しのデザインは重要</h3><br />
少し前まで、サービスは自分ひとりで使うものでした。ですからアクションに対する不安は自分に対してだけであり、最悪「まぁなにかあっても自分が困るだけだし」で解決、ということもありました。<br />
<br />
しかしいま主流のソーシャル系サービスは人との繋がりが前提です。「他人に迷惑かけちゃうのでは」という心配が新たに発生します。<br />
<br />
一人のアクションが多人数に影響するソーシャル系サービス全盛の時代。許しのデザインの重要性は増してきている気がします。]]></content>
	</entry>
	<entry>
		<title>『Google 日本語入力』になにか釈然としないものを感じる理由</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=245" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=245</id>
		<issued>2009-12-04T00:30:25+09:00</issued>
		<modified>2009-12-03T15:30:25Z</modified>
		<summary>なんか納得いかないなぁ、と言うだけのエントリーです。「Google 日本語入力」が賞賛を浴びているようですが、個人的にはなにか釈然としないも...</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>日常生活</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[なんか納得いかないなぁ、と言うだけのエントリーです。<br />
<br />
<br />
「<a href="http://www.google.com/intl/ja/ime/" target="_blank">Google 日本語入力</a>」が賞賛を浴びているようですが、個人的にはなにか釈然としないものを感じています。<br />
<br />
今回もGoogleが得意としている<br />
<ol><li>なんらかの方法でデータを集め</li><li>そのデータを整理加工し</li><li>新たな価値を生み出して提供する</li></ol><br />
というサービスのように一見思えます。<br />
<br />
しかし今回は、「このサービスはGoogleが生み出しました」と言うために必要な“新たな価値”がないように思うのです。<br />
<br />
<br />
<br />
ネット上の文章を収集して正しい変換辞書を作るには、正しい日本語で書かれている文章がネット上に存在しているという条件があるはずです。<br />
<br />
その正しい日本語を書くには、IMEの存在なくしては難しかったでしょう。<br />
<br />
「Google 日本語入力」がしたことは、<em>他社有料IMEが生成した情報を収集して、それをIMEに戻して、付加価値をつけただけ</em>のように思えます。<br />
<br />
<strong>あくまで付加価値であり、新たな価値は生まれていない</strong>のです。これを「Googleの新サービスですよ」と言われても納得しづらいです。<br />
<br />
なんというか、直接データを吸い出すと叱られちゃうから「インターネット」というクッションを一枚挟んでみました、ってのと何が違うの？という感じすらします。<br />
<br />
<br />
<br />
これによって、ATOKなど、これまで地道な研究により改良を重ねてきたIMEが淘汰されてしまったとしたら、それはとても悲しいことです。<br />
<br />
<br />
ということで、仮に「Google 日本語入力」が法に反していないとしても、私としてはやはり釈然としないのです。]]></content>
	</entry>
	<entry>
		<title>ソーシャルブックマークをパーソナルナレッジデータベースとして利用できていますか？</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=244" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=244</id>
		<issued>2009-09-02T23:04:19+09:00</issued>
		<modified>2009-09-02T14:04:19Z</modified>
		<summary>わたしはソーシャルブックマーク（以下『SBM』）に『はてなブックマーク』を利用しています。はてぶに登録するまでのフローはだいたい以下の...</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>日常生活</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/09090201_hatenabookmark.png" class="pict" alt="画面1・はてなブックマークの画面" title="画面1・はてなブックマークの画面" width="640" height="425"><img src="http://www.studio-no9.com/sb/img/thm124_09090201_hatenabookmark.png" class="pict" alt="画面1・はてなブックマークの画面" title="画面1・はてなブックマークの画面" width="320" height="213" /></a><br />
わたしはソーシャルブックマーク（以下『SBM』）に『<a target="_blank" href="http://b.hatena.ne.jp/">はてなブックマーク</a>』を利用しています。<br />
<br />
はてぶに登録するまでのフローはだいたい以下のようなものです。<br />
<ol><li>『<a target="_blank" href="http://www.checkpad.jp/">check*pad</a>』に「あとで読む」リストを作成し、気になるサイトがあれば<a target="_blank" href="http://www.akiyan.com/cc_checkpadbookmarklet" title="外部サイト『akiyan.com』の「蓄々check*pad Bookmarklet」ページを別ウィンドウで開きます">ブックマークレット</a>を使って放り込む</li><li>時間ができたときに「あとで読む」リストに登録されたサイトの内容を確認。今後も役に立ちそうだと思ったらはてなブックマークに登録する</li><li>必要なときに登録したブックマークから情報を得る</li></ol><br />
<br />
<br />
このように登録するのはスムーズに問題なく行えています。<br />
しかし登録したブックマークをイマイチ有効活用できていないような気がしています。<br />
<br />
ブックマーク数は増えていますが、その登録した情報をパーソナルナレッジデータベースとして使い切れていない気がするのです。<br />
<br />
<br />
<h3>はてなブックマークをパーソナルナレッジデータベースとして利用する際の問題点</h3><br />
はてぶをパーソナルナレッジデータベースとして利用できていない理由は、以下だと思います。<br />
<ul><li>古い情報と新しい情報が一緒になってしまう</li><ul><li>技術情報などは常に進化するので、それを残しておいてもナレッジデータベースとしての価値を汚すだけのものになる場合があります。これを整理するのは面倒です。<br />
また、単純にソートすれば済むというわけでもありません。</li></ul><br />
<li>SBMに登録した情報を使おうとしても、もしかしたら改めてGoogleなどで検索したほうが最新の良い情報が見つかるのではないか？と思ってしまう</li><ul><li>結局Googleを使ってしまうのなら、SBMに登録する必要あったの？となります。</li></ul><br />
<li>登録したブックマークから必要な情報を再取得するのが難しい</li><ul><li>SBMに保存される情報はURL、タグ、そして数行のコメントくらいです。本文は保存されません（例外もあります）。<br />
そのブックマークにどんな情報があったかを思い出すために、それら少ない情報から記憶を呼び起こすか、さもなくば登録した膨大なブックマークのURLを再度アクセスして探さなければなりません。<br />
サイトの内容の一部を覚えていたとしても、それを元に検索できるわけでもありません。</li></ul><br />
<li>webサイト外からの得た情報とマージするのが難しい</li><ul><li>有用な情報のすべてがwebから得られるわけではありません。人から聞いた話しや街で見かけたものに情報価値があることはよくあります。<br />
職業がweb関連以外の人ならなおさらでしょう。</li></ul></ul><br />
<br />
<br />
今回は、これらの問題を解決しつつあるサービスをチェックしてみます。<br />
<br />
<br />
<h3>はてなブックマークプラス</h3><br />
はてなブックマークは「ソーシャル」の部分がクローズアップされがちですが、今回の『<a target="_blank" href="http://b.hatena.ne.jp/guide/plus">はてなブックマークプラス</a>』のリリースでは、ブックマーク自体の機能を強化することで個人のためのパーソナルナレッジデータベースとして使ってもらうことをかなり意識しているのではないかと思われます。<br />
<br />
これによりビジネスツールとして一般企業への導入を目指しているのかもしれません<span style="font-size:x-small">（がぜんぜん違うかもしれません）</span>。<br />
<br />
<br />
ナレッジデータベースの視点で見ると、本文テキストの全文検索が利用できるようになったのが大きな進化だと思います。<br />
（ちなみに全文検索機能はYahoo!ブックマークも対応しているのですが、多分利用者ですら気づいていないと思います）<br />
<br />
また、その全文検索機能は、Googleなどの検索サイトと同時に表示できるようになりました。（firefoxのみの機能？）<br />
<br />
<br />
欠点は有料なこと、サービス自体がとても重くなる時間帯があることでしょうか。<br />
<br />
<br />
<h3>evernote</h3><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/09090202_evernote.png" class="pict" alt="画面2・windows用evernoteの画面" title="画面2・windows用evernoteの画面" width="640" height="624"><img src="http://www.studio-no9.com/sb/img/thm125_09090202_evernote.png" class="pict" alt="画面2・windows用evernoteの画面" title="画面2・windows用evernoteの画面" width="320" height="312" /></a><br />
『<a target="_blank" href="http://www.evernote.com/">evernote</a>』はSBMではないですが、ナレッジデータベースとして利用できるのではないかと思い使ってみています。<br />
<br />
<br />
SBMより便利な点としては、URLではなく、データ自体を保存するタイプだと言う点です。これによりサイト中の必要な部分だけの登録もできます。<br />
<br />
また、webサイト以外の情報も可能です。今は英語だけですが、デジカメで撮影した画像を登録すると画像中のテキストを抽出して検索対象にすることも可能です。iPhoneならこのあたりの連携がよりスムーズに行えるようです。<br />
パーソナルwikiと同じような使い方ながら、wikiより格段に便利だと思います。<br />
<br />
<br />
とはいえこちらもパーフェクトなわけではなく、WIndows用クライアントの出来がそれほど良くないこと、１アイテムごとにコメントを記入したいができないこと、そしてなにより日本語で使えないことがネックになっています。<br />
<br />
<br />
<h3>Googleのパーソナライズ検索</h3><br />
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/09090203_googlepersonalsearch.png" class="pict" alt="画面3・Googleパーソナライズ検索の画面" title="画面3・Googleパーソナライズ検索の画面" width="640" height="459"><img src="http://www.studio-no9.com/sb/img/thm126_09090203_googlepersonalsearch.png" class="pict" alt="画面3・Googleパーソナライズ検索の画面" title="画面3・Googleパーソナライズ検索の画面" width="320" height="229" /></a><br />
Googleの<a target="_blank" href="http://www.google.com/support/accounts/bin/topic.py?topic=14121">パーソナライズ検索</a>は単に検索結果をブラッシュアップさせるためのものでなく、Google検索自体をパーソナルナレッジデータベース化させるためのものだと思います。<br />
<br />
<br />
検索結果のページで気に入ったサイトのランクを上げることで、ブックマークに保存させることなく、ブックマークとしての役割を検索ページが果たせるようになります。<br />
<br />
全文検索はもちろんできますし、最新のサイトも検索結果にマージされていること、なによりもSBMの検索結果と違い、適合度順にサイトを表示してくれるのは魅力です。<br />
<br />
<br />
しかしUI的な問題があります。<br />
<br />
検索結果からたどったサイトを見て気に入り、そのサイトのランクをアップさせようとした場合、再び検索ページに戻らなければならないのは面倒です。<br />
<br />
また、検索結果ページを経由することなく開いたサイトのランクを上げたい場合は、そのためだけにGoogleで検索しなければなりません。<br />
<br />
しかしこれらUIの問題は今後、GoogleツールバーやGoogleブックマークと連携して改善されるような気もします。<br />
<br />
<br />
<h3>ソーシャルブックマークをパーソナルナレッジデータベースとして利用できていますか？：まとめ</h3><br />
これら3つのサービスはそれぞれアプローチ方法が違っていますが、ナレッジデータベースという視点で見ると競合になるのではないでしょうか。<br />
<br />
どれも一長一短がありますので、しばらくこの3サービスを併用して様子を見ようと思います。<br />
<br />
<br />
ほかにパーソナルナレッジデータベースを使いこなす方法をご存じの方がいらっしゃいましたら、教えていただけるとうれしいです。]]></content>
	</entry>
	<entry>
		<title>Firefoxで一時的にFlashをoffにする方法</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=243" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=243</id>
		<issued>2009-06-17T23:18:13+09:00</issued>
		<modified>2009-06-17T14:18:13Z</modified>
		<summary>例によってまわりで知ってる人が少なかったのでエントリー。もう本当にどうでもいい内容です。たまに仕事で、Flashをインストールしていないと...</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>Web &gt; 覚書き</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[
<p>
例によってまわりで知ってる人が少なかったのでエントリー。<br />
もう本当にどうでもいい内容です。
</p>

<p>
<br />
たまに仕事で、Flashをインストールしていないときの動作をテストすることがあります。
</p>

<p>
<br />
テスト環境を用意するために、Flashをアンインストールしたり、Firefoxに『Flash Switcher』というアドオンをインストールする人が多いのですが、
</p>

<p>
「アドオンの設定画面で無効化すればいいだけなのに…」
</p>

<p>
といつも思うのです。
</p>

<p>
<a class="highslide" onclick="return hs.expand(this)"  onkeypress="return hs.expand(this)" href="http://www.studio-no9.com/sb/img/090617_flashoff.png" class="pict" alt="画面1・Flashアドオンの解除" title="画面1・Flashアドオンの解除" width="703" height="640"><img src="http://www.studio-no9.com/sb/img/thm123_090617_flashoff.png" class="pict" alt="画面1・Flashアドオンの解除" title="画面1・Flashアドオンの解除" width="479" height="436" /></a>
</p>

<p>
<br />
Flash Switchrはなぜだか不安定なので、こちらのほうが安全ですね。
</p>

<p>
<br />
すごくくだらない内容なのですが、でもまわりでやってる人が本当に少なかったのでエントリーしてみました。
</p>
]]></content>
	</entry>
	<entry>
		<title>どの機能に対応するべきかを「ユーザーの利用意向」を超えて考える</title>
		<link rel="alternate" type="text/html" href="http://www.studio-no9.com/sb/sb.cgi?eid=242" />
		<id>http://www.studio-no9.com/sb/sb.cgi?eid=242</id>
		<issued>2009-06-17T00:46:08+09:00</issued>
		<modified>2009-06-16T15:46:08Z</modified>
		<summary>ちょっと前にとあるサイトの企画をしていて「ケータイの機能でどれに対応するか」という話をしていました。最近はどんなサービスでもケータ...</summary>
		<author>
			<name>takeyoshi TOMODA</name>
		</author>
		<dc:subject>Web &gt; idea/plan</dc:subject>
		<content mode="escaped" type="text/html" xml:lang="ja"><![CDATA[ちょっと前にとあるサイトの企画をしていて「ケータイの機能でどれに対応するか」という話をしていました。<br />
<br />
最近はどんなサービスでもケータイ対応は必須だと思います。<br />
しかし一口に「ケータイ対応」と言っても、メールでの投稿に投稿に対応するとか、GPSに対応するとか、そのレベルはいろいろあると思います。<br />
使われない機能はユーザーにとっては妨げでしかないですから、確実にユーザーに使ってもらえる機能を選んで実装したいものです。<br />
<br />
<br />
今回は、そんな機能の取捨選択について、例によって自分にできているかどうかは棚に上げて、思ったことをなんとなく書いてみます。<br />
<br />
<br />
<h3>対応する機能・対応しない機能の判断基準</h3><br />
たとえばCGM系サイトを作るとします。<br />
<br />
ケータイから投稿できるというのは必須だとして、ではケータイに数ある機能の中から、どれに対応すればいいのでしょうか。<br />
<ul><li>画像の投稿に対応するか？</li><li>絵文字の投稿に対応する？</li><li>GPSによる位置情報投稿には？</li><li>デコメ投稿は？</li></ul><br />
<br />
機能に対応するかどうかを「自分が使うから or 使わないから」で判断するのは問題外だとして、陥りやすいのは、インターネット白書などの資料を取り寄せて各機能の利用率と利用意向率を見て、単純にその数字から判断してしまうことです。<br />
<br />
<br />
たとえばGPSに対応するかどうかを判断するときのことを考えてみましょう。<br />
<br />
『<a target="_blank" href="http://www.amazon.co.jp/dp/4844324101?tag=hetarewebdire-22&camp=243&creative=1615&linkCode=as1&creativeASIN=4844324101&adid=1X4RDYG4PDQH6KAFQW7Z&">インターネット白書2007</a>』のデータを見ると、GPS機能を使ったことのある率は16.4％、利用意向率は27.3％、逆に利用したいと思わないと答えた人は34.6％となっています。<br />
この数字だけを見ると、「GPSを利用している人は少ないし、使いたいと思っている人も少ない」との判断になりがちです。<br />
たしかにGPSは位置情報取得に時間がかかり、電池を大量に消費するため、使い勝手の良い機能とは言えません。ましてやそんな困難を日記に地図を貼りたい人などめったにいないので、この数字は妥当でしょう。<br />
<br />
しかしこの判断方法が本当に正しいのか、わたしは疑問に思っています。<br />
<br />
なぜなら、<em>ある機能を自分が使っている姿を、いま世に存在しているサービスや自分が体験したことのあるサービスを超えて想像できる人は少ない</em>からです。ということは、GPS機能を使うかどうか、これから使いたいかどうかの数字は、いま世に存在しているGPS対応サービスの枠の中で出されたものであり、決して来るべき近い将来の姿を予想した結果から出た数字ではない、と思うのです。<br />
<br />
<br />
<h3>「使わない理由」を把握する</h3><br />
その機能は本当に使われないのか？を判断するときには、使わないと判断した理由を聞いてみることは大事だと思います。<br />
<br />
「GPS機能はいらない」「GPS機能を使わない」という人に、そう判断した理由を聞いてみると、だいたい以下のような意見が出ました。<br />
<ol><li>電池を食うから</li><li>位置取得に時間がかかり、やりたい作業の妨げとなるから</li><li>他人に自分の居場所や、いた場所を教えたいとは思わないから</li></ol><br />
<br />
こうして理由を聞いてみると、１つめと２つめの理由は「たしかに使いたくないよね」と思わされますが、でも近い将来、それこそ1年とかのスパンで解決しそうなものであることがわかります。<br />
<br />
3つめについては、積極的にGPSが必要ないと言っているわけではないことに気づきます。<br />
<br />
こうして理由を確認してみると、サイト制作側からの提案次第ではGPSは十分に受け入れられる可能性があるように思えます。<br />
<br />
たとえば日記サイトなら、投稿画面にアクセスした時点で、最近撮影した画像が撮影時間と位置情報を参考にグルーピングされて投稿画面横に表示されていて、ドラッグ＆ドロップするだけで投稿可能、とかになっていると、画像付き日記の投稿がとてもしやすくなるかもしれません。<br />
（すでにeye-fyやDoCoMoの実験サービスなどもあることから、撮影したら自動で即ネット上ストレージにアップされてて再利用可能な状態、という時代もすぐに来るでしょう）<br />
<br />
GPSに対応することで、位置情報を貼り付けられるようになるだけでなく、UIの改善に利用できるのです。<br />
<br />
<br />
<h3>まとめ：新しいなにかを作るために「今使われていないから」「使いたいと思っている人がいないから」を超えた判断をする</h3><br />
なにか新しい提案をもったサービスを作ろうとしているのなら、現時点での「この機能は使われないだろう」という判断の枠を一度リセットする必要があるように思います。<br />
<br />
近い将来解決されそうな問題を把握し、それが解決されることを前提にアイデアを出すことで初めて、ユーザーに機能を利用するかどうか聞ける状態になるのだ、といえるかもしれません。<br />
<br />
なぜなら実際の作ったものを（プロトタイプでもOK）触ってもらうかしない限り、一般ユーザーにその便利さは伝わらないと思われるからです。<br />
（だからこそ新しいサービスには前もってモックアップによるプロタイピングテストの必要性があるのだと思います）<br />
<br />
<br />
このような例はすでにいくつもあります。<br />
<br />
ajaxのような非同期通信は最初、プッシュ技術として登場したときは「定期的に最新のニュースを配信してくれる」くらいの使い道しかありませんでした。<br />
当時はインターネットアクセスは従量制だったため、定期的にネットにつなげられたらたまらん、ということで非同期通信はほとんど需要がありませんでした。<br />
しかし時がたって、インターネットが高速化・定額化したときに、それはGoogleマップという実際のサービスの形になり、非同期通信の評価は変わりました。<br />
<br />
きっとGoogleのスタッフたちは、非同期通信技術が広まる条件を把握し、それが満たされることを予測し、有効な使われ方を検討し、その準備をしていたのだと思います。<br />
<br />
<br />
デコメも同じです。<br />
2年前の調査では、デコメも「使わない」「使いたいと思わない」と答える人が大半でした。<br />
しかしその後、メールで絵文字を選ぶのと同じインターフェースで使えるようになったとたん、爆発的にヒットし、今では当たり前のように利用されるようになりました。<br />
（本来デコメとはイコールhtmlメールのことだったのですが、最近のユーザーは『オリジナル絵文字機能』と認識し、利用しているようです）<br />
<br />
デコメを使わない理由、使いたくならない理由は「入力がめんどくさい」だったのですが、それが解決されたことで利用率、利用意向率ともあっという間に増えたのです。<br />
<br />
<br />
ケータイに限らず、機能や技術は次々に現れますが、それがユーザーに受け入れられないと判断する前に<br />
「なにが解決すれば使われるのか」「それが解決したらユーザーにとってどんな利便を提供できるようになるか」そして「その問題はもうすぐ解決されるのか？」<br />
を考えるのが、新しいサービスを企画する上で必要なスキルのような気がするのです。<br />
<br />
<br />
<div class="related-entry">【関連エントリー】<br />
- <a href="http://www.studio-no9.com/sb/sb.cgi?eid=196" >もうちょっと頑張れAmazonおまかせリンク</a><br />
- <a href="http://www.studio-no9.com/sb/sb.cgi?eid=111" >Microsoft Expressionシリーズ機能評価版</a><br />
- <a href="http://www.studio-no9.com/sb/sb.cgi?eid=177" >自転車の鍵が微妙に進化していた</a><br />
- <a href="http://www.studio-no9.com/sb/sb.cgi?eid=159" >データ登録をしてもらうための工夫</a><br />
- <a href="http://www.studio-no9.com/sb/sb.cgi?eid=110" >新しいYahoo!</a><br />
<span style="color:#aaa;">generated by <a href="http://feed.fkoji.com/related/" target="_blank">関連エントリーリストジェネレータ</a></span></div>]]></content>
	</entry>
</feed>
