競争戦略・ウェブナビゲーション・プレゼンにはストーリーが重要らしいよ。

この連休中に本をいつもより読んだ。

今、平行して読んでいる本3つに共通するのは「ストーリー」。
今、自分に関係があることは「ストーリーをいかに組み立てるか」なのか。

「ストーリーとしての競争戦略 ―優れた戦略の条件」では、「ストーリーとして成立するものこそが戦略」。
マブチモーターの「小型モーターの標準化」「生産のオフショア」戦略を例示。
風が吹けば桶屋が儲かる的な?会社に置いててしかもまだ読み終わってないけど。

「デザイニング・ウェブナビゲーション ―最適なユーザーエクスペリエンスの設計」では「ナビゲーションとは、設計者がストーリーを立てて、ユーザーにそれをトレースしてもらうこと」。
数多くあるナビゲーションパーツを機能やユーザーに与える印象ごとに体系化。
本を読むようにサイトのページを見てもらって最終的にCVさせる的な?まだ読み終わってないけど。

「スティーブ・ジョブズ 驚異のプレゼン―人々を惹きつける18の法則」では「プレゼンとは演劇であり、スライドなんかよりもストーリーが大事」。
インテルへの移行を説明したプレゼンは秀逸らしい。(6:04あたりから)

聞いている人に体験してもらうということ?まだ読み終わってないけど。

結局、何かをコントロールするには事前にストーリーを作ってそれが実現するような打ち手を出して、実行するっていう普通の結末に収束しそうだけど、それはそれで。

ナビゲーションを理解する(デザイニング・ウェブナビゲーションのまとめ2)

「デザイニング・ウェブナビゲーション ―最適なユーザーエクスペリエンスの設計」を読んでのまとめ。
続きまして、第一部 2章:ナビゲーションを理解する。

情報探索の6つの行動

  1. 開始
  2. 連結
  3. 閲覧
  4. 分別
  5. 監視
  6. 抽出

ユーザーは情報を探しながら6つの間を行き来する
→情報探索は「直線的」ではない

情報探索のモード

  1. 指向性閲覧:特定の情報に的を絞ったモード
  2. 半指向性閲覧:ニーズがそれほどはっきりとはしていないモード
  3. 無指向性閲覧:無目的なモード

これらのモードは相互排他的なものではない!
ユーザではなく、サイトが持つ情報探索のモードがわかれば、ユーザーのニーズに応じるナビゲーションを設計できるはず!

ブラウズと探索は相互排他的なものではなく、互いを補う関係のもの
ナビゲーションの目標は探索時間の最適化
重要なことは求めている情報を得るために必要なリンクのみを表示すること
→ユーザーが本来のタスクに集中できるよう、余計な道筋を示さないことが重要
ブラウジング行動は「ハブとスポーク方式」
遷移的変動性:ブラウジング中のナビゲーションの変化の度合い

ナビゲーションは
・急な変化ではなく
・理にかなった予測しやすい変化を付けながら
・頻繁に変えていく
のが良いパターン

トリガーワード:ユーザーのニーズにマッチするナビゲーション用のラベルやテキスト

バナー忌避現象:ユーザーは経験からバナー広告や、それに類する長方形のエリアを見ないようにする傾向を持つ
→同様に「ナビゲーション忌避現象」を克服する必要がある

情報のシェイプ:その情報特有の形式(フォーマット)
例)あるサイトを見たときに、それがニュースサイトだとわかるのは、ニュースサイト全般に共通する特徴があるから

「感情」と「認知」には深い関係性がある
→ユーザーはウェブページを0.05秒見ただけでページのアピールポイントがわかる
→デザインは重要

情報探索から完了するまでのユーザーの感情の遷移について
→情報量とポジティブな感情は単純な比例関係ではない
→探索しているテーマについて情報量がある程度増えてくると、大量の情報に混乱して迷う
→情報を整理して比較する
→結論にいたる

優れた情報体験を生み出す要因は「ネガティブな感情を防ぐこと」

ユーザーの情報探索のテンションを下げないために気をつけるポイント
・ラベリング:トリガーワードをうまく使う
・体系化:情報のグループ化をする
・外観:ナビゲーションのレイアウトや見た目の審美性を上げる

デザイニング・ウェブナビゲーション ―最適なユーザーエクスペリエンスの設計
James Kalbach
オライリージャパン
売り上げランキング: 40233

ウェブナビゲーションの基礎(デザイニング・ウェブナビゲーションのまとめ1)

「デザイニング・ウェブナビゲーション ―最適なユーザーエクスペリエンスの設計」を読んでのまとめ。
まずは第一部 1章:ウェブナビゲーション入門について。

ナビゲーションモデルのパターン

コンテンツ間のリンク

  • コンテンツ間の文脈は強化される
  • 情報の全体的なファインダビリティは低い

→はてなの内部リンク的なもの

リキッド・インフォメーションモデル

  • ハイパーテキストではなく「ハイパーワード」
  • 単語をクリックするとオプションメニューからナビゲーションを選択

→ブラウザの右クリックメニュー的なもの

フィルタモデル

  • フィルタリングやソートのコントローラーからコンテンツをコントロール
  • コンテンツの全体像がつかみにくい

→パラメーターをいじるようなナビゲーション

構造型ブラウズモデル

  • ディレクトリ構造を持ったナビゲーション

→以前のYahoo!など

検索モデル

  • 探しているものが明らかな場合に便利
  • →Googleなど

実際のサイトは複数のナビゲーションを組み合わせている

ディレクトリのナビゲーションモデルを持ったサイトは、検索型よりもブラウジングを続ける割合が多かった。

カテゴリからブラウズしたユーザーは目的のコンテンツが見つかっても62%が引き続きブラウジングを続けた。
検索のナビゲーションの場合、ブラウジングを続けたユーザーは20%。
参照した目的のコンテンツ以外のページ数について、ディレクトリ型のユーザーは検索ナビゲーションのユーザーに比べてほぼ10倍に達した。

ナビゲーションを設計する際には

  • 何故そのサイトを作っているか
  • 誰が利用するのか
  • どんな情報にアクセスできるようにするのか

をよく考える必要がある。

デザイニング・ウェブナビゲーション ―最適なユーザーエクスペリエンスの設計
James Kalbach
オライリージャパン
売り上げランキング: 40233

Firefoxをインストールしたら入れておくアドオン・スクリプト18個

学生の時からもうかれこれ6年間、firefoxを使ってきて色々入れてみたけど、最終的に行き着いたアドオンをまとめておきます!
最近はchromeしか使ってないからSNS系がないけども。

■ユーティリティ系のアドオン

1.All-in-One Sidebar
ブックマーク、アドオン、ダウンロードとかをサイドバーで開けるようにしてくれるやつ。
2.FireGestures
firefoxのジェスチャ。「右クリック押した後に左クリックで左のタブへ移動」とかが便利。
3.Launch Clipboard
コピったURLをfirefoxのタブで一度に開けるやつ。Excelでサイト管理→firefoxで開いてチェックの流れがマジで便利。
4.Tab Mix Plus
これがなければfirefoxを使う価値が半減する!ってくらい重要。「タブを多段表示」や「タブをダブルクリックでそのタブを複製」とかタブ周りの設定をカスタマイズできる。「タブの余白をダブルクリックで開いている全てのタブを閉じる」が本当に便利。
5.User Agent Switcher
別途ユーザーエージェントファイルを読み込ませる必要があるけど、これを入れればモバイルのUAや検索エンジンのUAに偽装できて、モバイルサイトのチェックやクローキングのチェックができるようになる(それらがIPベースでやられていると無理だけど)。ちなみにユーザーエージェントファイルはこちらから落とせる
6.Xmarks Sync
chrome同様に。異なるブラウザでブックマーク、パスワードを同期させる拡張。
7.ソース表示タブ
開いているサイトのソースを表示するとき、デフォルトだと別窓で開くけど、これを入れておくとタブで開けるようになる。

■サイト制作系のアドオン

8.Firebug
これもchrome同様に。個人的には「要素の調査」をよく使う。
9.MeasureIt
これもchrome同様に。ブラウジング画面でピクセル数を計れるやつ。サイトの修正をするときにあると便利。

■Greasemonkeyのスクリプト

10.AutoPagerize
ページネーションを同一ページで読み込むやつ。
11.Google display number
Googleの検索結果に順位を表示させるやつ。このサイトにあるやつをちょっと修正したやつ。
12.Yahoo! display number
Yahoo!の検索結果に順位を表示させるやつ。これもこのサイトにあるやつをちょっと修正したやつ。
13.Google Reader Auto Read Ads
Google Readerのフィードから広告を除外するやつ。
14.Google Reader Full Feed Mod
Google Readerの部分配信のフィードを全文配信の形で表示させるやつ。全文配信にさせるボタンが表示される。
15.Google Reader Prefetch More
Google Readerのフィードの読み込み量をデフォルトの部分的な読み込みから大量に読み込むようにしてくれるやつ。フェードがたくさん溜まると、デフォだとスクロールするたびに読み込むから、溜まる人はこれを入れておくと便利。
16.GoogleReader-plus-hatena
Google Readerのフィードにはてブが付いている場合、その数を表示させてくれるやつ。フィードが溜まっているとき、はてブ数を基準に開くフィードを判断してスピードアップ!
17.Google Reader – Colorful List View
Google Readerのフィードをサイトごとに色づけするやつ。

■検索エンジン系のアドオン

18.The SEO Toolbar
SEO系のアドオンはたくさんあるけど、これは一つだけで「ページランク」「Yahoo!.comでのバックリンク数(ページ、ドメイン)」「Open Site Explorerでのバックリンク数(ページ、ドメイン)」「開いているサイトのIP」「開いているサイトのWebArchive.orgのインデックス開始時期」等々がわかるやつ。とりあえずこれさえ入れておけばいんじゃね的なやつ。適当なアカウント作って落とすまでがめんどくさいけども。

あとはFox Splitter (旧称:Split Browser / 分割ブラウザ)がfirefox4に対応してくれるといいなぁ。

やっぱまとめるのって結構めんどくさいね。

Google Readerとはてブを活用して情報を管理していくよ。


今までGoogleリーダーを使ってきて、はてブの数を表示できるヤツGoogle Reader plus Hatenaを入れてたんだけど、いろいろ調べてみたら、もっと便利なツールがあった。

ので、今Googleリーダーで設定しているものをメモメモ。

  • Google Reader plus Hatena
    フィードの各エントリにはてブの数を表示させるヤツ
  • PostRank Extension
    フィードの各エントリに集合知的な何かでランクをつけてくれるヤツ
  • RSS Subscription Extension (by Google)
    chromeでRSS登録するときにボタン一発でできるようにするヤツ
  • Super Google Reader
    Googleリーダー上で各フィードの表示をボタンで「全文(ヘッダー・フッターとかなし)」「実際のページ」「普通のフィード」から選べるようになるヤツ

この4つの拡張をchromeに入れるだけで、マジで快適。
RSSの消化速度がかなり上がりました!

今後はチェックしながらとりあえず気になったものはTaberarelooでリーダー上から直接はてブへ登録!
理想はそれを定期的にこのブログへブックマークの棚卸しを!
とりあえずやってみる!