ワイヤーフレームの前にペーパープロトタイプをつくる。

という書き込みをtwitterとか、その他ブログで散見して。
これって、おかしいんじゃないの？と思います。
ワイヤーフレームの”前に”ペーパープロトタイプをつくるのがおかしい、
その順序、フローはおかしい、と言いたいわけではなくて。

「ワイヤーフレームの前にペーパープロトタイプをつくる」というこの
表現というか、言葉としておかしいんじゃないの？と思います。

　・そもそもワイヤーフレームを一体何のために創るのか。
　・そもそもなぜペーパープロトタイプを創るのか。

ってことがきちんと整理されてないんじゃないかなぁと思います。
制作会社サンによっても違うのでしょうが、ワイヤーフレームというのは基本的には
「何をどこに置くのか明確に定義したもの（もしくは検討するためのもの）」だと、僕は思っています。そこにデザイン的要素はなくあくまでもレイアウト、画面構成要素を検討し定義するためのもの。
この根底に流れるのは、基本的には一つの問題を回避するためのものだと思っています。

「ビジュアル（装飾・配色）」と「画面構成・配置」を一緒に議論しないため。

いきなりPhotoshopでデザインしたものを提出していては（対クライアント、対制作側メンバーともに）、この二つを混同します。そもそも、これは実は別個に検討すべきものだと思うというのが、僕なりの持論だったりするのですが。

「何をどこに置くのか」ということとと「置いたものをどうみせるか」というのは、別の話だと思っています。まず、「何をどこに置くのか」が決まらないと、「それをどうみせるか」なんて決まるわけもないし、話しても無駄だとすら思います。だって、不要なものまで話をしているのだから。
というか、もっと言うと、「何をどこに置くのか」というのも実は混同していて、本来は・・・

　「何を置くのか」
　「どこに置くのか」
　「どうやってみせるのか」

であるべきかなぁと思います。
これ、それぞれ対応付けをすると

　「何を置くのか」・・・コンテンツリストやサイト構造図
　「どこに置くのか」・・・レイアウトワイヤーフレーム
　「どうやってみせるのか」・・・基本デザイン案

となるのかなぁと。
プロジェクトの大小によって、もっと細かくなると思いますが。
まあ、基本的なワークフロー（と、そのタイミングでのアウトプット）として。

ペーパープロトタイプというのは、これは本来出来上がったものを指すのですよね。どちらかというと、「ペーパープロトタイピング」の方が、制作に落とし込む表現としては適切かと。で、そうするとおかしな話になるわけですよ。「じゃあ、ペーパープロトタイピングって何をするものなの？」という。一番間違いのない答えとしては「ペーパープロトタイピングでペーパープロトタイプを創る」ってのが、１００％間違いないのですが、それじゃあねぇ？ｗｗｗ。

「プロトタイピング」というのは言うなれば「模型をつくる」ということですよねぇ。プロトタイプはだから「模型」になるんだと思いますが。「試作品」とか「試用品」でもいいんですが。それを「紙で」つくるから「ペーパープロトタイピング」なわけですよね。紙で作るメリットというのは、やはり何より「手軽にできる」ってことでしょうか。手軽にできるから作業時間が減る・・・というのもまあ、その通りだと思いますが、手軽にできる作業で「プロトタイピング」を行うことが大事ですよね。完全に材料を揃え、時間をかけて設計した後にあらゆることを確認していては、欠陥が見つかった時にまた作り直しになってしまう。だから、それを手軽に行える「紙で」「プロトタイピング」することにより、欠陥を予め見つけたり、はたまた気付きを得る場を設けるということが大事、ですねぇ。

で、このＷｅｂ制作における「ペーパープロトタイピング」って具体的に何をするんですか？というのが上記の「じゃあ、ペーパープロトタイピングって何をするものなの？」という問いのもっと深い回答。たいてい、ユーザーとのインタラクションをテストしたり、検討したりする作業に使われることが多いんじゃないかと思います。その場合、ビジュアルデザイン要素を排除して、枠や線、箱を置いた状態のものをポストイットや鉛筆などで描いたものを使うというか、それが「プロトタイプ」とか「モックアップ」とか言われるものになるんじゃないかと。

それ、ワイヤーフレームじゃないんですか？

って思うんですよ。
ワイヤーフレームだってそういうものでしょ。
PowerPointやイラレでつくられたものを「ワイヤーフレーム」と指すなら、それこそ「何を創っているのか」という意識が欠如し、本来合意形成や検討のために使われるという目的があるにもかかわらず、そのものを創ることが目的になっちゃってるんじゃないかと思うんですね。PowePointで創られたワイヤーフレームだって、結局検討用、合意獲得用に創られたものであり、それはＷｅｂサイトそのものではない（当たり前ですが）。ということは、これだってある意味立派な「プロトタイプ」だと思うんですよね。

ワイヤーフレームを何で作成すれば良いかと言うのは「何をどこに配置するか」という資料を「誰に」、「どうやって」見せるのかという「目的」「実現しなければならないこと」があって、それに沿って創るべきだと思います。だから、本来「ワイヤーフレームを何で創るべきか」という議論は、ケースバイケースというのが正解であると思うし、そんなものは制作会社ごとのワークフローによっても変わるべきだと思います。というか、「ワイヤーフレーム」自体、何の合意を取るためのものなのかということがブレていたりしますしね。

しかし、ワイヤーフレームの大目的である
「何を、どこに配置するのか」
ということは変わらないと思うんです。
それを使う相手やタイミングによって、大目的にぶら下がる細かな目的が変わり、それによって表現内容も変わっているだけで。プロトタイプというか、完成するＷｅｂサイトの事前段階資料であることに変わりはない。であるならば・・・

「ワイヤーフレームの前にペーパープロトタイプをつくる」
って
「下書きの前に手書きをする」
って言ってるようなもんだと思うんです。
それ、おかしいですよね？
「下書き」というのは、フロー（手順）の中の一つ。
「手書き」というのは、表現するための物理的手段の一つ。
だから、「ワイヤーフレームをペーパープロトタイプでつくる」というのが、本来の正しい表現じゃないかと思うんです。ＰｏｗｅｒＰｏｉｎｔで創るのなら、それは「データで創る」とか「データで清書する」ということになるんじゃないかと。

ものっすごい細かい話で、なんか揚げ足取りみたいですね・・・。
でもでも、これって、
「ワイヤーフレームを一体何のために創り誰に見せるのか」
「ペーパープロトタイピングを何のために行うのか」
がわかっていれば、こういう表現にはならないと思うんですよ。
それが、きちんと整理できていないから、
「ワイヤーフレームの前にペーパープロトタイプをつくる」
という表現になるんじゃないかと思うんです。

大事なことは、Ｗｅｂサイト自体もそうだし、プロジェクト自体もそうですが、
「その資料、何のために創るの？」ということを、きちんと創り手が理解していないといけないんじゃないかと思うんです。