フレームワーク再考 どうしたらフレームワークをうまく使えるのか？

こんにちは！

「5W1H」は、情報を浮かび上がらせるときや、適当に考えたことを、シーンとしてイメージするには、とても使えるかもしれないと気づいたという話です。

ちまたに溢れるフレームワークをうまく使えていますか？ 自分は使えてません。なんでだろう？どうしたらフレームワークをうまく扱えるんだろう？

そんな話も含めて、長文です。

「本の表紙を見る」を5W1Hで改めて考える

まず最初に、整理してみます。昔からあるフレームワークを使ってみます。 というのも、最初は、適当にステップを思いついただけなので、もう一度おさらいしてみようと思ったからです。

5W1Hというフレームワークがしっくりきました

実は今までは、5W1Hってあまりピンときませんでした。

小さい頃から作文とかで聞いていたけれど、あまり分けることによって何か役に立った経験というのも無かったからです。

そもそも、フレームワーク自体があまり好きではありません。「その分け方でいいの？」という単純なつっこみです。結論を出すために、フレームワークに当てはめるのであれば、こぼれ落ちる情報が多すぎるのでは？と思っていました。

フレームワークという言葉自体が何か大げさな感じもしていましたので、どこか期待している部分もあったかもしれません。フレームワークに当てはめるだけで終わっている人を見ると、「もっとほかにもあるよ」と思うことがありました。「むしろ、それ、人の視点が抜けてるよ」とか。「フレームワークにあてはめるために、ほかのこと見て見ぬふりしたでしょ？」などなど。

また、フレームワークに当てはめて分類してしまうと、今度はそれ以外を見ることができなくなり、「フレームワークに当てはめたんだから間違いない状態」になる人もいます。

そういった人と接するうちに、「もともとフレームワークは、答えでもないし、結論をだすためのものではない」「乱用と期待しすぎは危険」「どのフレームワークを使うかも大事」「フレームワークを考え出すことも大事」「コツとかヒントのほうがしっくりくるかも」「やってること自体はあてはめてそぎ落とすことだとしても、見えていなかったものを見るためで、全体を見ようとする気が無ければ、変な情報だけ手元に残る」と感じてきました。

もともと、多い情報を整理するときに困ったときは、自分はいつも「人の視点」を使ってました。なんだかんだ、人間が関わるので、「その人から見たらこうかな」とかです。「肩書きがあっても人間だもんね」とか。

なので、あまり「フレームワーク」をうまく使えていた感覚がありませんでした。

ところが、今回は、適当に考えただけなので、最初の情報が少ない状態からでした。

「5W1H」という基本的なものでしたが、このような場合は暗闇の中で、スポットライトが次々増えて、その物の姿が浮かび上がってくる感じがして、なかなか良さそうです。

シーンとして明確にイメージしやすくなる

スポットライトといいましたが、Whenを想像するのも、Whereを想像するのも、すべて、シーンを具体的にする感じで、分ける感覚ではありません。

暗闇の中で、時間の流れがあらわれ、舞台の背景セットが表れ、カメラが本の表紙をクローズアップし、その人の気持ちを想像する、物体・身体的な方法はどうしているか？をカメラが写していく。そんな感覚でした。

シーンとして明確にイメージしやすくなるので、「計画を練る」ときにもぴったりです。旅行の予定などでは自然とそうしてるはずです。（いきあたりばったりの旅もしたことがありますが、それでも出発時は考えています）

「絵に描く」ことや、「シーンを撮る」こと自体がフレームワーク

シーンとして明確にイメージするという意味では、「絵に描く」ことや、「シーンを撮る」こと自体がフレームワークと言えます。

描いたり、撮るためには、「Who,When,Where,What,Why,How」が無ければすぐにばれます。「Why」は少しばれませんが、シーンとして考えるときには必要です。もちろん、このマンガのように、人間を丸で描けば、Whoの部分はちょっと簡略化しています。

絵に描く、シーンを撮るのは通常は、別の目的です。「相手に何かを伝えるため」という目的です。 その目的とは別に、「描く（or思い描く）」「撮る」ことは「書く」「話す」と同じように、その行為を行ううえで、必要とされること条件があって、それが無意識のうちにフレームワークの役割を果たします。

フレームワークをうまく扱うには、フレームワークに当てはめた結果のみではなく、フレームワークに当てはめる行為で、見えていなかったものを自分が浮かび上がらせることができたか？のほうが大事だと思いました。

無意識のフレームワークも探し、名称のあるフレームワークだけにこだわらないことも大事かと。

このサイト内の関連記事：

• 観察のコツ「5W1H」
• 「フレームで発見する」と「データから発見する」は両方うまく使う

「本屋で本を買う」行為ひとつとっても、いろんな手順がある

ということで「本屋で本を買う行為」のパーツ化にチャレンジ！

手ごろなサイズの「行為」だと見越してスタートしてみました。 文脈としては関係するはずの、本を買う前後の部分はひとまずおいておきます。

思っているよりも意外と色んなステップがあった

さて、やってみると意外と色々なことをやっているようです。 人それぞれですが、自分はこう見るとなかなか中身を読まないようです。

1. 表紙を見る
2. 帯を見る
3. パラパラ眺める
4. 著者プロフィールを見る
5. 目次をざっと読む
6. あとがきを読む
7. まえがきを読む
8. 目次の気になる箇所をパラパラ読む
9. おもしろければもうちょっと読む
10. 気になるフレーズがあり、良さそうであれば買う

こういった読み方は自分では普通ですが、皆さん、どのように読んでいらっしゃるのでしょうか？

各ステップをもう少しパーツ化することにした

さて、もともと「本屋さんで本を買う行為」というひとまとまりのパッケージですが、各ステップをもう少しパーツに分けてみます。

というのも、これでも、十分こまかい気もしますが、サイトのパーツのように目に見えるわけではないからです。 もうちょっと、具体的にするために、「5W1H」メソッドを使って整理してみます。

続きは次回！

このサイト内の関連記事：

• 「プロペパ君」を実際に使ってみて、パーツ化の粒度について考えた

「プロペパ君」を実際に使ってみて、パーツ化の粒度について考えた

以前につくったプロペパ君という、レイアウトパターン用のパーツを使ってみて考えたことです。

18種類のうちの創造的なはずの細かいパーツ12種類は初心者は使えない

抽象的なほうが、創造的に作れると思っていましたが、パーツの山から全体をイメージできる人は、そもそも、手で描けるでしょう。 ただ、こんな使い方ならＯＫ

• 答えとなるレイアウトを見ながら作ることによって構造を学ぶ
• 出来上がったものの一部分のパーツを動かし、どう変わるか考える

やり過ぎかと思っていた動画再生や地図を表すパーツのほうが意外と使えた

情報としてはある程度パッケージ化されているともいえる「動画再生」「地図」「フローチャート」などのほうが、単体でもそれが何なのかがわかるので使いやすい。

ほかのものは、パーツだけではわからない。文章などは書き込んだりしないとダメかもしれない。 ある意味、パーツの文脈がわかるくらいの粒度じゃないと、初心者には無理でした。

無謀にも人の行為やインタラクションをパーツにし、パッケージ化するとどうなるだろうか？

「シナリオ」「インタラクション」「もの」のなかで、今回は「もの」をパーツにしてみたので、ほかの部分もパーツ化してみます。そして、ある程度の情報のひとかたまりとして、パッケージ化してみます。 そうすると、人の動きがイメージしにくい初心者がイメージしやすくなるかもしれません。

長くなりそうなので次回へ続く

動きは、動詞の数だけありそうです。一部にしてみないとダメそうです。 出来上がったものよりも、パーツについて考えてみることで、発見できることがありそうです。 とりあえず、続く。

このサイト内の関連記事：

• 「個々のパターン」と「全体を見る」は別
• プロペパ君で作るオーソドックスなWebサイトのレイアウト（9パターン）

「見立て」による発見

「見立て」によって、新しい発見があるということだと思います。そこに新しい使い方を見ることができるということですが、プールにしか見えない人もいます。

この場合同じものが対象なんですが、違う。何かを観るときに、そこから受け取るものが違う。

このマンガでたまーに、セリフほとんど無しのものを描きます。いわゆる文字の情報がほとんど無いというものです。

これは「絵を読む」という表現か、「観てわかる」という表現のどちらかになると思います。（もちろん、マンガの文法も関係しています）

「見立て」も、自分の行為自体を別のものに見立てる場合もあれば、対象物を何か別のものに見立てる場合とがありそうです。

って、なんだかわかりにくいですね。

by fabbio

by lucas

by wZa HK

by eyeliam

by jon hanson

by Snowticias.com

by empressofdirt

この最後の写真は、関係ないのですが、「skateboard」で探していたら出てきました。 たくさんスケートの写真を観ていると、不思議と関連を感じて「見立て」ることができるようになってきます。

名前はまだ無い

今回はこちらのいい感じの写真を見ながら考えました。

• Pool（Taro Hirano Photography）

「名前はまだ無い」状態というのは、今回のようにプールという名前があってもそうなります。 「少年達」にとって、「普通のプール」ではなくなっていて、後の「ボウル」に瞬間的になっています。

一般的な名前は一応あるけれども、ある瞬間は、「名前はまだ無い」状態の何かになっていること（や場面）がありそうです。

そう思うと、少年達にスケートボードの遊び場として使われたときには「ボウル」、その家の人にとっては庭にある「プール」となるようです。

使う人とその物の関係で名前が「プール」「ボウル」と変わります。 さらにいえば、たとえ名前は相変わらず「プール」と呼んでいても、意味合いが変わります。

使う人とその物がその瞬間にどういう関係であるかによって、使われ方が変わる（場合によっては名前が変わる）と捉えるとおもしろいです。

なんかつながる部分もありそうな気もしないでもない棚橋さんの記事（で本を引用していたあたり）の部分。 棚橋さんの言いたいこととは違うかもしれないですけれど（笑）

かつ、その意味というのは、人と物とのあいだに相互作用的に存在するのです。 『お客さんから逃げない』（DESIGN IT! w/LOVE）

by tunaboat

by tunaboat

• プールを掃除するスケーター Dipping Into an Empty（The New York Times）

このサイト内の関連記事：

• アフォーダンスとは記号のようにそれが何かわかること？
• 表面とその裏側

関連書籍とDVD：
POOL


DOGTOWN & Z-BOYS [DVD]

Webサイト制作で大事そーな6個のポインツ（ペパプロ君をつくりながら考えたこと）

前にコレ『キッズのための、紙で作るＷｅｂサイト（というかページ）設計』を作りながら考えたことです。 長くて要点をつかみにくいかなと思い、アナログ感全開の蛍光ペンを使ってみました。受験生みたいです。 （マンガの内容をテキストにするのは、ちょっと億劫なので、またいつか）

このサイト内の関連エントリー：

• プロペパ君で作るオーソドックスなWebサイトのレイアウト（9パターン）
• キッズのための、紙で作るＷｅｂサイト（というかページ）設計

関連書籍：

• ワークショップ―偶然をデザインする技術
• ペルソナ作って、それからどうするの? ユーザー中心デザインで作るWebサイト

関連リンク：

• 株式会社コンセント

『ワークショップ―偶然をデザインする技術』を読んで ワークショップやグループワークのチームの人数は何人がよさそう？

自分のワークショップでの参加経験からすると、5人でも、3人、2人に分かれたりします。 何人がいいのかは、そのときにやる内容やメンバーにもよりますので、コレだというのはないとはおもいます。

大人数場合は、2〜3人くらいに小分けになるのは自然ですので、重要なのは、その小分けになったもの同士でうまく意思疎通をしていこうと、グループの各メンバーが意識しているかにかかってきます。

とはいえ、わざわざ小分けになったチームにリーダーを立てて意思疎通するのでは、もちろん遅い。 そう思うと、2〜3人になってはいるけれど、そのフェーズごとにメンバーがどんどん入れ替わるぐらいのゆるいものがベストだと感じています。

当たり前のように思えますが、これが組織で部署のように分かれている場合は、結構大変そうです。

ただ、ワークショップでのグループワークは、物理的に近くにいたり、作業対象を目の前で共有しています。

それが、普段と比べて何の意味があるかは、表にめだって出てきませんが、「小分けになるけれど、各自がゆるゆると臨機応変に動く」というのがワークショップでのグループワークでは発生しやすい点がメリットのひとつかなと感じています。

関連書籍：

ワークショップ―偶然をデザインする技術


ゲーミングシミュレーション:未来との対話 (ASCII SOFTWARE SCIENCE Language)

「個々のパターン」と「全体を見る」は別

『ワークショップ―偶然をデザインする技術』は、いわゆるワークショップそのものについて以外に、何かを作るプロセスとして、どういう位置づけになるかを書いてあるような気がしました。もちろん実例も書いてあります。

そういう部分では、（「認知的ウォークスルー」などユーザを理解するという部分のヒント探しという意味ではちょっとずれていましたが）『ゲーミングシミュレーション:未来との対話』のなかでも、ゲーミングとよばれるものがコミュニケーションの方法としてどう位置づけされるのか？という視点が書いてありましたので、その部分は興味がわきました。 その説明として、本の中で、「全体を理解することに向いている」ということが書かれていました。

ココがおもしろいなとおもったんですが、きっかけは『プロペパ君で作るオーソドックスなWebサイトのレイアウト（9パターン）』で、レイアウト用のピースやパターンを作る前に、個別のパターンで、「できることと、できないことがある」と考えていて、作りながら「どのあたりまでだろう？」と考えていたからです。

部分はなんとなく見えても、組み合わせようとすると何かしら別の要素が入ってきます。

ジグソーパズルであれば完成系はひとつです。けれど、レイアウトのパターンをそのピースだというのは何か違う気がします。

なので、タングラムや、ＬＥＧＯのように、組み合わせ方で完成形も変わるものの、一つのピースといったほうがやや近いと思いました。

そのときには、全体を考えること（＝昨日の記事で書いたように、『デザインの第一歩、広く見渡し想像すること』）が必要になってくるはずだと、もやもや考えています。 （さらに、現実と比べると、実際には手元にピースがなければ、探したり、作ったり）

ほとんど書きましたが、パターンについての話は、また別の機会に。

このサイト内の関連エントリー：

• プロペパ君で作るオーソドックスなWebサイトのレイアウト（9パターン）

関連書籍：

• ワークショップ―偶然をデザインする技術
• ゲーミングシミュレーション:未来との対話

デザインの第一歩、広く見渡し想像すること

トーキーです。 間違えて買った再生紙線入りノートがようやく終わりました。 白いノートが、とてもまぶしいです。 ちょっとスキャナの汚れが目立ちます。

このサイト内の関連記事：

• 作るものとデザインリサーチ

チーム内の活動の継承をうまくやるための参考メモ

相変わらず、ドナルドおじさんと居酒屋で話しているみたいな本ですが、なんとなくきになったことのメモ。

直接「ユーザビリティ」とは関係ないんですが、「ユーザビリティ向上」というのは「改善プロセスを継続する活動」になると思います。

チームプレーなところも考えます。そのあたりは、Webサイトであれば、サイト運営チームのがんばりにかかってきます。少しづつではありますが、最初にまずユーザビリティに興味のある個人が、実験的にそういった点を考慮しながらサイトのコンテンツを考えたりするところからでしょう。

次の段階としては、ネット上でＴｉｐｓを集めたり、数人が限定的に活動を行っているかもしれません。 その次の段階としてでてくるであろう「改善プロセス」というのは、ある程度組織で、意識的に行っていくことになると思います。

ということで、直接は関係ないですが、チームの中で活動を継承していくプロセスの参考という意味で。

関連書籍：

• パソコンを隠せ、アナログ発想でいこう!―複雑さに別れを告げ、“情報アプライアンス”へ

『パソコンを隠せ、アナログ発想でいこう!』を読んで 熟考するために描いた絵は捨ててもよい

捨てる捨てないはどうでもいいんですが、描く行為が何をもたらすかです。 先日の「話す」こと自体の効能にも似ています。

本来は、報告書を読む人が報告書を作るのが一番よかったり、もっと良いのは、やはり報告内容を一緒に体験・体感することだと思います。

旅行のブログを思い浮かべると良くわかると思います。 書く人は、思い出しながら書くことで増幅します。振り返りの効果です。（カタカナでいうとリフレクション）

かたや旅行に行っていない人はそのブログを見て思いをはせるしかありません。 やっぱり、一緒に旅行に行くのが一番です。誰のためでもなくブログを書いて、振り返る。 それが一番だと思います。

それができないから、報告書を読むのだと思いますが、 報告書を書くコスト、読むコスト、そして抜け落ちる情報あるということを忘れないようにすると、 安易に「報告書読めばわかる」という落とし穴にはまらなくなりそうです。

報告書を書くコスト、読むコスト、抜け落ちる情報とバランスを考えて、足を運び共同作業するということも選択肢の一つとしてまず検討することが大事だと感じました。 （報告書を書く人にとっては振り返りの効果があることはプラス面です）

このようなことが、単なる報告書という成果物の話になってしまうと、うまく伝えられなかったりします。 結構ムズカシイ。こんな問いもいいかもしれません。

「その報告書、なにするためのものですか？」

サイト内の関連記事：

• 「体験」を伝える（受け取る）ために「文書」以外にも方法はないのか？
• 「調査を報告する人」と「調査の報告書を読む人」の違い

関連書籍：

パソコンを隠せ、アナログ発想でいこう!―複雑さに別れを告げ、“情報アプライアンス”へ


ペルソナ作って、それからどうするの? ユーザー中心デザインで作るWebサイト

不思議なことに、動くとそれが次に動く素（もと）になる

『実験的な思考で動く』と近い部分があります。 究極的にはすべて実験で仮説です。 ポイントは、

• 相手の反応を見る
• 自分がどれだけできるか見る

意外に、二つ目のことは、自分でわかっていると思い込んでいる人もいます。 やってみなければわかりませんので、気楽な気持ちで自分を観察するつもりではじめてみると良いことあるかも。

おもしろいのは、動いたこと自体が自分の中で、次に何かやることの素になることです。それを素に次の何かをやると、また動いた分だけ素ができます。

例：

1. プロトタイプを作ってみよう。
2. （できたものを見て）ユーザーの気持ちを自然と考える何かを追加しよう
3. （できたものを見て）印刷してみよう
4. （できたものを見て）使ってみてブログに載せてみよう
5. （できたものを見て）落ちてしまうのでポストイットにしよう
6. （用紙売り場にて）マグネット印刷用紙があるから使ってみよう
7. （できたものを見て）冷蔵庫でやってみよう
8. （やりながら）どれだけのパターンができるかやってみよう
9. ９パターンできた
10. もうちょっとできるかやってみよう
11. でけた←今ココ（プロペパ君で作るオーソドックスなWebサイトのレイアウト（9パターン））
12. やりながら考えたことを描いてみよう（今度）

と、こんな感じで最初から全部見えていたわけではありません。

このサイト内の関連記事：

• 実験的な思考で動く

話を広げる（オープンクエスチョン（オープンエンドの質問））

「オープンクエスチョン（オープンエンドの質問）」のインタビューですね。間違えました。

このやりかたは「話を広げる」ためのものです。 「Yes/No」で答えられるものは時として誘導的になりますので、確認するときには良いかもしれませんが、状況などを広く知りたいときには向いていません。

人によってはとめどなく話すので、ビジネスでのユーザー調査の場合には、ある程度ラインを引いておくことも大事なようです。

「聞く」ことに重点を置く

おもしろいなと思うのは、特に意見を言うわけではないのに相手がたくさん喋るということです。もちろん良し悪しを言うわけでもありません。ユーザー調査の場合は、状況や背景というコンテキストに関することを集めるためだけです。

ですから、「提供していること」というのは実は無いんです。むしろ「聞く」ことに重点をおきます。 そして「聞く」ことに重点をおいた結果、なかにはとめどなく話す人も出てくるくらいの状態なる。

解決策も意見も返すことはありませんが、もしかしたらユーザー調査の対象者は「話せてすっきり」して帰っていくかもしれません。

いろんなことを考えました。（ビジネスと直接関係ないです。）

ただ聞いてもらう場は圧倒的に少ない

まず、聞いてもらう場が無いということ。もしくは、単純に、聞いてくれるから話すということ。

特にユーザー調査の場合は、「こういうことについて聞きたい」と目的を伝えているかもしれませんが、「聞く」体勢ができています。

普段であれば、議論や討論、また日常生活の中では、そのときに相手の話や、テーマを考えたうえで話すことが必須です。そんなときは一貫性や、反論・質問に対する考えをまとめておく、大げさにではなくてもキャッチボールする準備を無意識のうちにすると思います。こんなこと言っていいのかなということも、もちろん考えるでしょう。「質問」する前に自分の「仮説」を用意しておくというのは基本で、それがないと、人を「辞書」のように使ってしまうこともあります。

そういったことが必要とされる場に比べて、逆にただ聞いてもらう場は圧倒的に少ないのかもしれません。 「話してくれない・意見がでない」と思ったときには、「聞く」体勢を整えることで解決への糸口が生まれるかもしれません。

女の子に相談されたと思って、「意見」や「解決策」を言ったら怒られた

もうひとつ同時に思い出したのは、 「悩み事を話したのは解決策や意見を求めているわけではない」 というよくある話です。

例えば、女の子に相談されたと思って、「意見」や「解決策」を何か言わなきゃと考えて返したものの、なんだかイマイチな反応（もしくは逆に怒られた）という話です。（別に女の子だけではありません）

考えてみれば当然で、「意見」や「解決策」を交換する以外に会話してはいけないなんてルールはありません。で、そういったときにも、「聞く」というユーザー調査のスタンスが、偶然にもぴったり合うんではないのかなと想像しました。（良し悪しは別として）

考え方によっては、「解決策」を持っていなくても、きちんと「聞く」だけで、十分相手が喜んでくれる可能性があるということです。

「話す」だけで、何かが起こるのでしょうか？

「話す」こと自体がアウトプット

もともと「話す」こと自体がアウトプットなので、「話す」だけでも話し手は変化します。 自分を振り返ってみても「話していたら整理できた」ということもあります。

友人が書いた脚本を見せてもらうときに、あらすじを説明してもらったときにもそういうことがありました。 また、「この登場人物は、このシーンでこういうことが起きた時に、ここではどう思っているの？」ということを聞いたりします。

そうすると、いわゆる「うれしい」とか「怒った」とかだけではなく、「こういうことがあって、このときの気持ちはこうだったのだろう」というように、少し現実に近い感じになります。

また、単純に、「このシーンの後に、このシーンがきたら、観客はどう思う？」と聞いたりもします。 （ちょっと観客視点の認知的ウォークスルー的な手法をイメージ）

やり取りしていて思うのは、脚本の場合は、部分的にはこういうものが書きたいという衝動のようなものが必要で、その衝動はある意味熱中することが必要ですし、人物のキャラクターを統一させて展開していくことは大変で勢いも必要です（自分はできません）。

なので、作ったものについて誰かに話すことによって、整理されるというだけでも価値があるのだと感じます。

「会話」には、そういう効果もあるんだと思います。

まとめ

普段から、自然に駆使しているはずの「会話」ですが、改めて考えるとおもしろいです。

観客の意見があてにならないことはある

「主語」シリーズです。 マンガを先に描いて、あとで文章を書いてるので前回までに書いたことと関係している感じです。

※『プロペパ君で作るオーソドックスなWebサイトのレイアウト（9パターン）』に追加しました！ ペパプロ君だったのにプロペパ君になっちゃってた・・・どうしよう。ま、どっちでもいいか！

このサイト内の関連記事：

• ものづくりの際に時々考えるようにしている4つの視点（洩れあり、ダブりあり）
• 実験的な思考で動く

ものづくりの際に時々考えるようにしている4つの視点（洩れあり、ダブりあり）

昨日の続きです。 「立ち位置」は、マーケティングの範疇で「ユーザビリティ」とは違うかなと感じていましたが、そうでもないようです。

今回のマンガの場合でもそうですが、関わる人が増えてくると、立ち位置をそろえるところからはじめないといけない。自分達が作っているものは、「誰のための、どんなもの」なのかというところからです。

その過程で、問題となってくる優先順位も「立ち位置」が決まっていれば、おのずと決まってくる部分も多いのではなないかと思います。

※例えばこのブログですら、立ち位置を一応決めてあります。 自分用のアウトプットのメモという以外に、 例えば、

• 表現方法をマンガにする。
• 専門用語を噛み砕き、かた苦しさを減らす。
• ユーザビリティに何かしら関係があること。

などです。

「ゆるいマンガでユーザビリティがわかるブログ」、「邦訳された海外の分厚い専門用語満載の本の真逆のブログ」というような自分でも思い出しやすいキャッチがあると便利です。

やらないこと（andやることができないこと）も決まってきます。

• 専門用語が好きで、洩れ無し、ダブりなしなどの定義ですっきりしたつもりになりたい人は対象外
• テキストで検索できるということを最重要とはしない
• ユーザビリティに関連しないことは対象外
• マンガが好きではない人、マンガの文法がわからない人も対象外

ブログを描いていて感じるのは、ある意味制限でもありますが、こういった目安があったほうが優先順位がついて、残したものがより強調されるということでした。

逆に「立ち位置」が定まらないと、関わった人の数だけ機能やコンテンツが増えていき、種類は多いけれど、どれも強調されないなどの問題が起きます。

ちょっと脱線しましたが、最後に、「主語」を意識するということをきっかけに、ものづくりの際に時々考えるようにしている4つの視点をなんとなくメモ。

1. もともと誰のために何を作ろうとしているか？という視点
2. 作ろうとしているものは全体のなかでの立ち位置はどこか？という視点
3. 作る際に何が無駄で、何が大切かがわかるような目安に、時々照らし合わせているか？という視点
4. 作ったものへの評価は、誰の心のつぶやきで、誰の心のつぶやきでないのかという視点

1と2は、同時に考える気もします。

実験的な思考で動く

人間は情熱で生きています。

たまに男性はロジカル、女性は感情的なんてことを耳にしますが、そんなことはありません。みんな感情的です。「論理も感情を動かすためのひとつの手段であーる」なんて決め付けはよくありませんが、「気炎」なんて言葉もあるくらい、燃え盛るものを持っている生き物、それが人間だと思うのです。

わかりやすい人もいれば、炭火のように静かに熱くなっている人もいます。

そんなわけで、自分が作ったものには愛着もあるし、自分の考えていることを否定されると「コンニャロー」となるのは自然現象です。

そういうようなことがよくあるので、少し離れて「この物をみて、この人はこう思ったのか」と観察することも、情熱と同じぐらい価値があります。そうすることで、「次はココを変えたらどうなるかな？」という実験的な思考が生まれ良いものづくりにつながります。

ユーザビリティテストの「思考発話法」というアプローチの存在を知るうちに、「心のつぶやき」を聞くだけでも大変なんだなあと思うようになりました。

また「コンテキスチュアル・インクワイアリー」「師匠と弟子」という手法を知るうちに、「意見」と「行動」のズレや、そのまわりの背景も視野に入れること、「意見を聞いても本人が気づいていないものは、当然出てこないことがある、その場合の意見は何かを言わなければいけないのでとりあえず思いつきを言っていることがあるので注意すること」の大切さを感じました。

自分はとても仏の心の域に達していませんが、日常生活においても結構影響を受けた手法ですので、ユーザビリティに興味ない人（は読んでないか）も、この視点を持ってみると実験的な思考で動くようになりそうです。

※そういえば『プロペパ君で作るオーソドックスなWebサイトのレイアウト（9パターン）』にPDFファイル用意してみました。

このサイト内の関連記事：

• 予想していたものがでてきたか教えてもらう

プロペパ君で作るオーソドックスなWebサイトのレイアウト（9パターン）

春ですね。 「プロペパ君」（『キッズのための、紙で作るＷｅｂサイト（というかページ）設計』）の別バージョンを作ってみました。

少しパーツを増やしてみました。LEGOと一緒でパッケージになりすぎると想像力が刺激されなくなると思いつつも試しに増やしてみました。（そのうちpdfにするかもしれません）追記：しました。記事の終わりにあります。

地道にはさみでチョキチョキ・・・。

写真じゃわかりにくいですが、なんと今回はマグネットでペッタンコです。

では、Webでよく使うレイアウトをどこまで作れるかチャレンジ開始。（3カラムはやってません。第三の目で適当に右か左にナビゲーションを想像して追加してみるといいかもしれません。）

■トップページなどで多いオーソドックスなタイプ

コンテンツ部分が広めで余りがち。トップはやはり配置するものがどうしても多くなるので、項目が多い場合は、あとでバナーをぺたぺた貼る羽目にならないように気をつける。

次は、

■2階層の中に直接飛べるタイプ

（一つ目のも飛べますが） トップページやカテゴリーのインデックスページにも使われます。 中のメニューが増えても比較的対応しやすく、拡張できるところがポイントです。 テキストも控えめで、次の移動先のリンクを探している人をすばやく振り分ける時に向いてます。 ただし、右カラムと左カラムの中の要素の量が増えてくれば揃うとは限りません。 （一定量と決めておけば揃います）

ちなみに下の場合で、「ランキング」を押すと・・・、（2009/04/11追加）

この下のようになるイメージです。

または、さらに階層がある場合は、インデックスページに飛ぶというイメージです。

まじめに説明していて、おもしろくないんですが、次は、

■第2階層のオーソドックスなタイプ

左に第2階層のメニュー。右がコンテンツ部分です。よくある感じで、文章に関連したリンク（外部コンテキストナビゲーションリンク）が必要に応じて配置されます。

（パンくず型のナビゲーションも通常配置されます）

文章の途中がリンクになっているような、インラインのコンテキストナビゲーションも使われますが、このタイプのリンクは、

ユーザビリティテストによると、「ユーザーがすばやく読むため、このように隠れたリンクは見落とされたり無視されたりする傾向にある」からです。 『Web情報アーキテクチャ―最適なサイト構築のための論理的アプローチ』より

ということもあるようです。

自分の実感としては確かにそうであるということ、ただし、インライン型でもリンクを貼るときの文脈で読んでみたくなるような内容かどうかでクリック数が変わっていると思います。

■コンテンツ内にローカルナビ型　（2009/04/11追加）

通常、サイドにローカルナビゲーションがつくものをよく見かけますが、コンテンツ部分に入れたものです。

製品情報ページで「特徴」「機能」「外観」「付属品」などを切り替える際に見かけます。

サイドメニューと組み合わせたバージョンです。

次は、

■ブログ型

縦長になりがちですが、豊富な写真がある点は強みです。 企業サイトでは縦長すぎて敬遠されるかもしれませんが、正直、縦の長さを意識しすぎたメーカーのサイトの小さい写真よりも、ブログの購入者の熱意のこもった大きくて、いろいろな角度の写真、質感がわかるくらい細部をアップで撮った写真、また生活の中で使われている様子がわかる写真のほうが得るものがあると思います。（ブログもペイ・パー・ポストの場合もありますが、使用者の意見は抜きにしても）

■ステップ説明型

レイアウトというよりもコンテンツの中身の表現ですが、最後に問い合わせリンクへの誘導付きです。

■問い合わせなど、入力フォームページ

ブログは、記事下（コメント入力用の）についてますので、あれはあれでひとつの進化した形で、将来的にはページ遷移の必要がない場合はああいった見た目が多くなりそうです。

そして、次は、

■イベント告知＆申し込み型

写真、料金・タイムテーブル、開催地。そして、申し込みフォームです。

■商品紹介型

サービスの紹介に、図解を使ったもの、そして、短めの動画でも確認することもできる例です。 フッターには問い合わせボタン、もしくは他ページへのリンクが貼られていて、「このページの一番上に戻る」リンクをクリックする必要なく別ページへ行けます。 フッターリンク充実型の例ともいえます。

まじめに説明するのも疲れてきました。おまけです。

■YouTube型

記憶に頼って作ったので意外と違うかもしれません。コメントが並ぶ感じは、クチコミレビュー型のサイトにも通じるかもしれません。

■振り分け優先トップ（グローバルナビ無し）型（2009/04/11追加）

「中小企業の方」「家庭でお使いの方」など属性で振り分けることもあります。 ドロップダウンは中身が見えないので使いにくいですが、その中身を最初から出しているともとれるタイプです。 なので、各メニュー名を押せば第二階層のインデックスページへ飛べるイメージです。

上のがトップですが、ほかのページではグローバルナビはこの下のような感じです。

■振り分け優先トップ（グローバルナビ有り）型（2009/04/11追加）

一つ前と同様に、トップページをサイトマップのように、訪問者をすばやく振り分けることに重点を置いたタイプです。テキストリンクのラベリングがとても重要です。

メインイメージを少なくしたバージョンがこちら。

■ダッシュボード型

　（2009/04/11追加）

iGoogleのようにカスタマイズされたページです。カスタマイズ以外でも振り分けることを優先しているタイプと言えます。トップページがダッシュボード的な位置づけになることも少しづつ増えてきそうです。

■マイページ型（2009/04/11追加）

Amazonのような特殊なタイプです。

ダッシュボード型に少し似ていますが、コンテンツが多く、レコメンドや関連情報、更新情報の要素もはいります。

SNSのマイページにも近いでしょう。

■ウィザード型（2009/04/11追加）

インストール画面のような単純に進んでいくタイプです。

Ｗｅｂ上で商品やサービスの説明をするときによく登場します。

■最小限型　（2009/04/11追加）

Ｇｏｏｇｌｅも色々増えてきていますが、Ｗｅｂサービスなど新しく始めるときは、無理に余白を埋める必要はありません。むしろその余白とシンプルなインターフェースが使いやすさを生みます。 必要もなく余白を埋めようとしたときは危険信号です。

■おまけ

今回やったようなことを普段から頭の中でやっているのではないでしょうか？ 「こうなったら、レイアウトがこう！」というように。 ただ、それに慣れてないお客さん（だけではないかな？）とイメージを共有する場合だと紙に書くなりして、目に見える形にして話したほうが良さそうです。

やっぱり、家なら冷蔵庫で！

追記：

■『ペパプロ君マグネット』（よく考えたらマグネット印刷用紙を使わないとマグネットでもなんでもなかった） pepaprokun_magnet.pdf (PDF/125kb・2ページ) ※商用・非商用・教育・研修限らず、ご自由にどうぞ。

このサイト内の関連記事：

• キッズのための、紙で作るＷｅｂサイト（というかページ）設計
• ペーパープロトタイプ（かるたでわかる用語集）

関連書籍：

• Web情報アーキテクチャ―最適なサイト構築のための論理的アプローチ
• ペーパープロトタイピング 最適なユーザインタフェースを効率よくデザインする

「人間中心設計」をヒントにした5段階のデザインプロセスのまとめ

「人間中心設計」をヒントに、おもしろい手法もいくつかあったので、今までバラバラだった記事を少しまとめてみました。

自分自身、あまり読み返さないのですが、残念ながら現代の技術ではマンガ内を検索できないので、一度目次のようにメモ。

デザインプロセスで繰り返す5段階。（マンガ内とはちょっと違いますがどっちでもいいです）

1. 調べる
2. 試作品をつくる
3. 試してみる
4. 反応を観察、収集
5. 変更点を考える

ちなみに「人間中心設計」自体はプロセスについてであって、細かくやらなければいけない決められた手法はありません。

■調べる

自分の頭の中を洗い出す

今のところ思いついていることを紙に書き出す。 フレームワークにおさまらないものも書き出す。 重複してもＯＫ。

例：

• 旅行に行きたい。海に行きたい。
• 温泉旅行に行きたい。合宿したい。ものづくり合宿したい。おいしいご飯食べたい。
• 和室に泊まりたい。

対象となる関係しそうな人にヒアリングする

こうに違いないと思ったときも、ヒアリング。人の話に耳をかたむける。オープンインタビューで。

例：

• 旅行に行くときに、今まで宿選びで気にする点はどんなところ？それぞれのメンバーの会社の休みはどう？メンバーはどう？
• コストが無いなりに効率よく少しでもユーザー調査をする
• そばにいる人中心デザイン

少し整理する

例：

• 対象は誰か？どんな状況になりそうか？参加者の目的は？まとめて、ラベリングしてみる。
• 作るものとデザインリサーチ
• 事前準備その１　テキストエディタに書き出す

■試作品をつくる

小さくつくる

小さくはじめるのは簡単だから。思いつきベースのものでもＯＫ。

例：

• 「ものづくり合宿しおり」をつくる
• 「明確な要求」と「自覚していない要求（手順、手間）」
• キッズのための、紙で作るＷｅｂサイト（というかページ）設計
• ペーパープロトタイプ（かるたでわかる用語集）

■試してみる

試すといっても、「自分だったら・・・」とか、飲み屋で話すといったくらいのことから色々。

ウォークスルー

参加する人間の視点で考えてみる。

例：

• 「しおり」を元にシミュレーションしてみる
• 認知的ウォークスルー（かるたでわかる用語集）

自分以外に公開してみる

やりたいこと、または、頭の中で考えていること、その内容。関連してそうな過去の情報を公開する。 探している相手から見つけやすくしてもらうために。（おおげさにいうとファインダビリティ？）

自分が人のことを全部理解できないように、相手も自分のことを全部はなかなかわからないので。マッチングのために。

例：

• 「ものづくり合宿がやりたい」「テーマを決めて、普段にはない刺激をお互いに受けて帰る場にしたい」「固くなく柔らかい」と人に話す
• しおりをメールで送る
• 「株式会社デザインプロセス」を訪ねて

自分以外の人にヒアリング

例：

• 打診してみる
• 「しおり」を見せて心のつぶやきをきいてみる

人間の動きもいれてテスト

例：

• 半日でやってみる、一日でやってみる、少人数でやってみる
• 「動き」を入れたチェックでさらに良いものに
• クローズドカードソートで自分と相手のちがいを知る

■反応を観察、収集

例：

• リアクション、失敗
• プロトコル分析（かるたでわかる用語集）

■変更点を考える

例：

• 趣旨
• 立ち位置
• キャラ立ち
• 大人数でやるなら（実在しない人なので、イメージの共有は書類だけではなく一緒に作りながら）

以上です。 意外と仕事じゃないときや、扱うものや結果が目に見えやすいもののとき（スポーツ・演劇）には、自然にやっていることも多そうです。（なので人間中心設計という名称はあまり気にしません）

振り返ると、自分でもあまり考えていない部分も見えてきました。 （ブログの立ち居地を意識してマーケティングの部分は少しはずしていますが）

関連書籍：

• デザインマネジメント デザインをビジネス戦略に活かす基礎知識 (大型本)

「株式会社デザインプロセス」を訪ねて

気がついたらエイプリルフール過ぎてました。 思いっきり普通の記事描いて過ぎてしまいました・・・。

ブロガーたるもの一度くらい堂々とうそを・・・。うう。 つき忘れたうそをつきたいです。

・・・さておき、ほそぼそとワークショップあたりから続いている組織についての話をマンガにしてみました。

東京駅から30分の少しはずれにある会社です。

近くには小さな神社もありました。 少しのどかなところで仕事するってのもいいですね。

気持ち良さそうに寝ているネコ発見。激写後にようやく会社に到着。

社内の机の上には、なにやらポストイットやら。 人形を使ってるのは、見る位置を変えたときに、視点が切り替え安いからだとか。

外に出たら真っ暗になってました。帰りは急行電車がちょうどきて20分で東京に到着。

こんな会社ホントにあったら一度訪ねてみたいですね（つき忘れたうそついてみました）。

「なんとか中心設計」の体現とは？

一製品ではなく、普段から「なんとか（人間とかユーザーとか）中心設計」の手法を使うということも、手法を学んでいると思います。

「体現」ということを以前から考えているのですが、手法を覚えるのに精一杯な時期を過ぎると、少し余裕が出てきます。

志向にもよりますが、普段から「何とか中心設計」を組織でもそうですし、生活でもそうですし取り入れるといいんじゃないかと思ってます。考え方を「製品やサイトの設計」時に限定しないで広げてみたらどうなるのかと。

計画的にやっているのであれば良いんですが、「人間中心設計」まわりが専門用語にあふれ、次々と定義するための新しい言葉が生まれ、それを仕事としていない人からは、もはやなんのこっちゃわからない壁をどんどん積み上げているなと思うときもあります。

わからない言葉を知りたいとか、なにかあるぞというわくわく感を与えるためならば良いのです。

ただ、大真面目に新しい言葉を生み出し、小さい部屋をますます小さくしていくだけであるよりは、外の人と会話するつもりなら、生み出した言葉の翻訳も同時にきちんと考えたほうが良い。（中だけで使うなら問題無し）

自分も、はたと立ち止まると、普段「なんとか中心設計」ではやってはいけないとされることをしてることに気づきます。

それましたが、実際にどういう点で「なんとか中心設計」というものを製品開発やサイト設計の手法以外に生かせて、どういう点はいかせないのかなあというのを考えてみたのが今回です。

このサイト内の関連記事：

• 境界線