ワイヤーフレームってなんで作るの？

デザイン2021-02-26

こんにちは！デザイナーのちかです。
みなさま、ワイヤーフレームってご存知ですか？

以前別の記事で、「デザインを作成する上で、ワイヤーフレームを作成するのはとても大事！」とご紹介しました。

・Webサイトのデザインってどうやって出来上がるの？（全体の流れ編）
https://plasol.co.jp/blog_post/web-design/

今回はもっと具体的に、ワイヤーフレームとはなにか、何故ワイヤーフレームが必要なのかについて、お話させていただきます。
一見無駄に見える工程ですが、とても重要な工程ですので是非ご覧いただければと思います。

ワイヤーフレームとは「デザインの設計図」

以前の記事でもご紹介いたしましたが、ワイヤーフレームとは「デザイン作成の前段階に必要な設計図」です。

デザインを作成する上で「どのような情報を載せるか」「情報にどのような優先順位をつけるか」「どの位置に情報を載せるか」という判断は、必ず必要になります。
そしてこの判断は「デザインの前段階で」制作会社とお客様との間ですり合わせをする必要があります。そうしないと、かなりのロスが出る可能性があるのです。
そのすり合わせを目に見える形にして行うのが「ワイヤーフレーム」です。

例えばデザイン段階で、

・制作会社側の考え
この情報は載せたほうがユーザーにより情報が伝わるから載せておこう。

・お客様側の考え
その情報はあまり重要じゃないんだけどな…なので載せなくても良い。

上記の様なやり取りが発生した場合。
ワイヤーフレームで事前に「載せる・載せない」の意思確認が事前にできていれば、上記のやり取りはそもそも発生しません。

また、デザイン段階で上記の様なやり取りが発生したという事は、「作らなくて良いデザインを作成してしまった」事になります。
その分工数が無駄になったと言ってもいいでしょう。

このような「無駄な工数」が積み重なってしまう事を防ぐ意味でも、事前にワイヤーフレームを作成して、認識のすり合わせを行う事は、スムーズに進行するうえでとても大事な工程です。

ワイヤーフレームは「デザインではない」

また、誤解されがちですが「ワイヤーフレーム＝デザインではない」ということです。

あくまでワイヤーフレームはデザイン前の設計図。
各部品や全体のデザインの作り込みは「しない」のがほとんどです。

なので、ワイヤーフレームの段階でボタンや写真がグレーになってて全然イメージと違う！となっても、それはワイヤーフレーム段階であるから、というのをあらかじめご了承いただけますと幸いです。

もちろん、どういうイメージ・テイストのデザインが良い！こういう写真を配置してほしい！というご意見は、ワイヤーフレーム段階かデザイン段階で反映させていただきますので、どんどん頂きたいです！
ただ、「あくまでワイヤーフレーム」「あくまでデザインの前段階」というのを、念頭に置いておくとやり取りがスムーズになるのではないでしょうか。