ワイヤーフレームとは、ホームページやウェブアプリ、スマートフォンアプリなどの画面を作るときに、デザイン作業の前に用意する「設計図」のようなものです。
デザインを作る前に、どの場所にどの機能を置いたら良いか、検討するためにワイヤーフレームを作ります。ワイヤーフレーム作成の工程を飛ばしてデザイン制作に進むと、その分の制作費は抑えられますが、デザインが上がってきた際に「え、この資料請求ボタンはちがうところに置きたかった……」といったような、発注側と制作側の齟齬起きる場合があります。デザインの修正コストの方が高くついた、といったことがないように、なぜ必要なのかを見ていきましょう。
ワイヤーフレームを作ると、ロゴやグローバルナビゲーション、お知らせや問い合わせボタンが画面のどの位置に置かれるのか、割合として大まかにどの程度の面積を占めるのかなど、デザイン制作の前に検討することができます。
また、メインビジュアルは一枚絵のイメージとするのか、矢印を付けてスライドショーとするのかなど、細かい補足をいれることもできます。
さらに、トップページから下層の各ページへ、画面の中でどのリンクがどこに繋がるのかも把握できます。デザインに進む前に全体の構造が確認できるので、
「ここはこうしたかった！」
「あれだけ話したつもりなのに、自分のイメージと違った」
といったことを防ぐことができます。
言葉だけでああしたい、こうしたいと意見を言い合うよりも、ワイヤーフレームを見ながら話すと視覚的に理解できるので、関係者同士で共通認識が生まれて議論が深まります。制作会社との意思疎通も高まります。
ワイヤーフレームは、飾られたデザインに惑わされることなく「どこに何の要素を置くか」を考えるため、関係者確認の際に話がデザインに逸れることが減ります。
またデザインに進んでからの無駄な変更や修正も、減らすことができます。デザイン段階ではなく構造の検討段階でチェックできるため、その後の作業を効率よく進められます。
ワイヤーフレームを作ることで、全体像が見やすくなり、関係者間での意思共有が格段にしやすくなります。各自が当たり前と思っていることでも、実際形にしてみると違っていることが多かった……といった経験は、多くの方がお持ちではないでしょうか。
ワイヤーフレームを積極的に使ってコミュニケーションをとることで、見た目にとらわれることのない、本質の議論を重ねることができるというわけです。
