ワイヤーフレームを描く恩恵。あります。確かにあります。ただ、ここで言いたいのはサイト制作をするにあたって「デザイン着手前にお客さんとの認識のすり合わせができる」とか「それによって仕様の確定が図れる」とか「デザインの作成がスムーズ」とか、そういった具体期な業務の中の恩恵のことではなくて「ワイヤーフレームを描く行為」そのものから得られる恩恵について考察してみたいと思います。

そもそもワイヤーフレームとは

下記LIGさんが書いているようにサイトの設計図面ですね。

簡単に言えば「何を・どこに・どのように」が記載された「サイト設計図面」です。つまり、制作するウェブサイトの要素や機能、情報を設計図面のように配置しておき、お客様や制作者と認識を合わせるためのものです。
Web制作者のためのワイヤーフレーム講座「役割と考え方」編 | 株式会社LIG

イッパイアッテナではワイヤーフレームとは言わず「構成書」という言い方をしています。配置だけでなく、文章構造の優先度なども含め、結構作り込んで作成します。

文章構造を意識することの利点

まずワイヤーフレームを引く際、大前提としてサイト全体のコンセプトを視野に入れ、各ページにおける目的を意識して設計していくことになります。「だれに・なにを・どのように」という視点ですね。（私はこの視点をディレクターの師匠から叩き込まれました。）上記視点を元にページにおいては「ここは強く打ち出す」「ここはリストとして列挙する」など具体的に落とし込んで行くことになるわけですが、当然サイトを作成していくためhtmlの文章構造を意識して描いていくことになります。

htmlは<h1><h2><h3>という見出しや<li>リストなど、論理的に情報伝達を行うために基本的な文書構造を持っています。これを意識しながら構成書を描くことで、ページが伝えたいメッセージが明確になるばかりではなく、自分自身の論理的思考も鍛えられることになると私は思っています。論理的な思考は当然日常においても有効なことが多いので、繰り返し構成を引くことで培われる、この恩恵は大きいと考えています。

視覚的に考える利点

ワイヤーフレームはあくまで設計図面であるため、配色をしたり、画像やイラストを配置したりという具体的なデザインはしません。とはいえ、クライアントやデザイナーと認識をすり合わせるため、設計した情報を、ぱっと見で把握できるよう視覚化する必要はあります。ここで味噌なのは「デザイン」はしないものの「視覚化」はするという所です。（本来的に言えばどちらもデザインではあるのですが）。あくまでワイヤー段階における「視覚化」は、サイトの目的やゴールが何なのか共通認識をすり合わせるために機能するということです。（余談ですが仮にワイヤー段階でデザイン要素を強めてしまうと、それに引っ張られクライアントが伝達すべきメッセージを見失い「見た目」にこだわり始めてしまい、結局目的が明確化されないので、ぼやっとしたデザインが作成させるということが多々あります。）

ワイヤー段階では「目的」を明確にすることに注力することで、サイトコンセプトも定まってきます。サイトコンセプトが定まるとデザインの方向性も定まるので、やはり、全体としてデザインの質も向上することが多いです。私はこの「情報の視覚化 」を繰り返すことにも大きな利点があると考えています。当然ながら文章だけで情報を伝達するよりも、視覚的な要素も含めたほうが伝達スピードは格段に上がります。ワイヤーフレームを引くことで自然と、この能力が磨かれることにも大きな恩恵があると思うのです。

サイト制作以外の状況でも、例えば打ち合わせにおいて、クライアントの課題が何で、目的は何かということを端的に図解化するということのスピードが上がったり、日常生活の中で、例えば夫婦間におけるコミュニケーションにおいて5年後・10年後というライフプランを考える時などにも効果的に機能すると（実感も含めて）そう思うのです。俗に言う「デザイン思考」の力が自然と高まると言う感じでしょうか。仕事においても、生活においてもコミュニケーションの中で、他者と認識をすり合わせる必要が生じることは多々あります。その中で、上記のようなワイヤーフレームを描くことで得られる視覚化の能力は非常に有効だと考えています。