ここ4年くらいずーっと思ってたことなんですが、ワイヤーってパワポじゃなくてphpで書いた方がいいんじゃないか。ということで、今やってる大規模コーポレートサイトのリニューアル案件で実践してます。

ウェブサイト設計の業界メインツールはパワポだと思うのですが(なんかいいツールがあれば教えてください)、単発キャンペーンサイトならまだしも、コーポレートサイトの設計をやる場合は主に以下の点でめんどくさいです。

• グローバルナビなど反復要素が多いので、修正が入ると全ページ修正しないといけない(マスタを駆使しているとはいえ、限界が)
• カラム幅や文字サイズのアタリがつけづらい。デザインしてみて初めて「文字多すぎるやん」となることしばしば。
• オンマウスなどのインタラクティブ挙動が表現しづらい。
• 遷移先をいちいち書き込まないといけない
• 条件分気によるレイアウト違いを、いちいち分離して表現しないといけない。例えばトップページだけフッターリンクに項目が追加される場合とか。
• メールに添付したり、いちいちストレージにアップして連絡するのがめんどくさい

まぁphpつくること自体が目的なんではなく、別にhtmlでもいいんですが、どうせならphpの方がさくっと効率化できるからいいよねと。

あ、俺の立場はプロデューサーやIAであって、プロの実装屋ではありません。
実装の方々からするとメリットとデメリットも変化するんでしょうか。

この方法のメリット

上で書いたことが解決できるぞ！ということでやってみてるんですが、一言で言うと「手触り感が伝えられる」ことがすごいいいことだなぁと思いました。
まだクライアントに見せてないからどうなるかは分からんですが。

逆に言うとパワポのワイヤーはあくまで「理論上のものである」というのが分かりました。
カテゴリー→サブカテゴリー→サブサブ…と辿るのが王道のサイト設計とはいえ、今やってる案件みたいに膨大にカテゴリが多いサイトでは、末端ページに行くまでになんぼクリックせなあかんのじゃい、となる。
設計段階でモックがあれば、「じゃあナビをドロップダウンにするか」とか「ショートカット銅線入れるか」とか「インデックスページをカットするか」みたいな判断がしやすい。
特に重要なのが、仮にナビをドロップダウンさせるとなった場合に第何階層から第何階層へショートカットさせると一番気持ちいいかといったディテールの議論ができるところかなぁと思ってます。
そういう設計にした際にカテゴリ移動がしやすいかどうかまで確認できます。

人に使ってもらってナンボのウェブサイトですから、あくまで「ルールとして成立している設計である」以上に、なんだかんだで「使いやすい」というところまで設計で担保しておきたいです。

デメリット

とにかく時間がかかる

はじめて作ってるんで試行錯誤中ですが、一回テンプレ作ったら今後はそれを改修すれば速くなるでしょう。

資料として残らない

モックで確定した後、デザイン中に裏でパワポにすればいいのではないかと。

今後の展望

wordpressでやった方が絶対早いよなー。
ナビゲーション項目とか全部ベタ書きでやってますが、入力内容が特定の名前でphpファイルで出力されるようにしてればナビの実装が激速化するんではないかなと。

とここまで書いて思ったんですが、「ワイヤーで設計する」というよりも、設計とモックアップを同時に作っちゃうと表現した方が正確かも。
まぁとにかく「手触り感」がクライアントに伝わりやすくなるのがいいなぁと思ってます。