実はとっても重要な構成案(ワイヤーフレーム)について知ろう!

公開日:
カテゴリー:
これからホームページを発注する方向け

デザイナーの山本です。
Webサイト制作を発注したら、デザイン制作の前段階のステップとして多く導入されているのが、構成案(ワイヤーフレーム)の提出ではないかと思います。

この構成案ですが、サイトにとって実はとっても重要なものになるため、クライアントの立場の方もどういうものか理解しておいたほうがよいのではないかと常々思っています。
ということで、構成案(ワイヤーフレーム)とはどのようなものなのか、まとめてみたいと思います。

構成案(ワイヤーフレーム)とは?

構成案(ワイヤーフレーム)とは、ページ内に「何を」「どこに」「どのように」表示するかを表したものです。

photo by podluzny


基本的には色や装飾などのデザイン要素は使用せずに作成します。

構成案はデザインと違ってわかりづらい?

Web制作のプロとしてお客様に構成案を提出して毎回感じるのは、デザインについては発注者の多くの方が注力されるけど、構成案となると意外としっかり確認されていないのでは?!ということです。

デザインは、見た目がわかりやすく「好き/嫌い」という個人の好みでもジャッジ可能なため、Web制作の現場では「関わっている人全員がデザイナーになってしまうのが悲劇」だと皮肉られるくらい、多くの方から意見が出やすい傾向にあります。

構成案はデザインとは違い、モノクロで、何をジャッジすればよいかわかりづらく、チェックが甘くなってしまう傾向にあるのかもしれません。

構成案はとても重要

サイトの成功にとってデザインと同じくらい、もしくはそれ以上に重要なのが、実はサイトの構成(何をどれくらいどこでどのように伝えるのか、どういう機能や情報が必要で、それはどんな形でどこに配置されるのか)だと言えます。

「どう言うか」より「何を言うか」が重要とコピーライティングの世界では言われていますが、これはWebについても同様です。
ユーザーはサイトのデザインで商品やサービスを選ぶわけではありません。

「とりあえず」でも作れてしまうところに問題があるのが構成案

クライアント様との打ち合わせをまだ行っていないときに構成案を作る会社もあるようですが、それはよい制作フローではありません。

手ぶらよりマシということなのかもしれませんが、サイトは基本オーダーメイド。
どのような暮らしをしているどんな家族かわからないのに家の設計図を作ってしまうのと同じです。

以前制作会社さんとの打ち合わせでクライアント様との打ち合わせ前なのに構成案が出てきたことがあり、お話をお伺いしていると、その担当者さんはクライアント様のビジネスに関してもそれほど理解されていらっしゃらない様子で、構成案についても「打ち合わせ時に何もないよりはよいと思ってとりあえず作りました」とのことでした。

デザインやHTMLコーディング、プログラミングのように制作するのに専門的な技術やソフトは必要ないため、「とりあえず」でも作ってしまえるのが構成案の問題点かもしれません。

ビジネスにプラスになるサイトの構成案を作るにはビジネスやユーザーについての理解が必要

構成案に必要なもの

ビジネスの理解

ビジネスで何を達成したいのかをまったく理解せずに、ビジネスのための課題解決方法をデザインすることができるものでしょうか。
そしてまた、私たちは、いつもビジネスの最優先事項ばかりを重視するわけではありません。顧客や実際に使うユーザーのニーズと優先事項とのバランスを取らなければならないのです。そもそも、ビジネスの優先事項をサポートするためには、ビジネスそのものを理解していなければなりません。

お客様のビジネスを理解せずにサイトの構成を作るのは難しいです。

ユーザーの理解

サイトを使うのはユーザーです。
どんな人がユーザーでユーザーが求めているのが何であるかを理解する必要があります。

あるテニススクールのサイトで最も見られているコンテンツは「レッスンのタイムテーブル」です。ここから、多くの生徒さんがサイトに訪れ、レッスンのスケジュールを見ていることがわかります。
その事実を知らずに、サイト制作時に、発注側のゴール=新規入会だけを意識してサイトを作ってしまったらどうでしょうか?
サイトでタイムテーブルを見たいと思っている多くの生徒さんが困ることになります。

このように、どんなユーザーがどの情報を必要としているかを理解したうえでサイトを制作することが大切です。
これらはリニューアルであればアクセス解析からわかる単純な事実ですが、アナリティクスを確認しなければ、想像することはできても実際どうなのか確信を持つことができません。

もっとユーザーを知るためのリサーチ

例えば何でもよいのですが、スポーツやミュージシャン、何かの熱心なファンになったことはあるでしょうか?
その分野を知らないで初めて触れた人と熱心なファンでは、見るもの、求める情報などが違うことが想像できると思います。

制作者はクライアントのビジネスのプロでもなく、熱心なファンでもないことが多いと思います。そのため「その分野を知らないで初めて触れた人」の目線では物事を見ることができるかもしれませんが、「熱心なファン」や「その業界」や「あなたの顧客」のことは何もわかっていないかもしれません。

熱心なファンや、その業界の人、その会社の顧客、なと自分とは違う立場の人がサイトで何を求めているか、どうサイトを利用するかを知るためにはリサーチが有効です。
現在さまざまなリサーチの手法がWebサイトの制作者に学ばれています。

最近私もユーザーリサーチの手法のひとつであるユーザーインタビューを何度か勉強として行いましたが、インタビューをすると必ず知らなかった事実や発見があります。

Webで成功している企業は皆ユーザーの調査に力を入れていると、インタビューメソッドのワークショップで講師のエリカ・ホールも言っていました。

このように、ビジネスへの理解、ユーザーへの理解を踏まえて、ユーザーの目的とビジネスの目的の両方が達成されるように構成案を考えます。

また、過去にテストでコンバージョン(お問い合わせや購入など目標とする行動がユーザーによって達成されること)が上がると実証されているコンテンツやレイアウト、人間の行動パターンや心理を利用した情報の見せ方など、裏付けされたデータや知識があればそれも踏まえて作ります。

ちゃんと作ればすべての要素の説明ができる

では、どうやって構成案を確認すればよいの?という話ですが、慣れていないとどこを見ればよいか確かに難しい部分もあると思いますが、まずは作られた方に各要素の役割=どうしてそれがここにあるのか、を聞いてみると良いのではないかと思います。

先述した打ち合わせ前に構成案を作られた会社の担当者さんに、これはどんな役割ですか?とお伺いしても、各要素がそこにある意味を自信を持って答えるのが難しそうでした。
逆に裏付けした上で作成された構成案はすべての要素について説明をすることができます。

説明を聞くことで各要素の役割を理解し、適切かどうかジャッジしやすくなりますし、それならこのほうがよいのでは?などクライアント側の視点から見た改善点なども出てきやすくなるのではないかと思います。

また、構成案を確認するだけではなく、構成案を元にユーザーテストを行ってみるのもよいでしょう。

記事を共有する

この記事を書いた人

プロフィール画像

山本美代子
フリーランスWebデザイナー。
美術系大学後、情報誌の会社の制作部、Web制作会社を経てフリーランスに。
ビジネスに貢献できるサイト制作のためにUXやマーケティングの勉強中です。 ペーパープロトタイプ作成後、デザイニングインザブラウザにてUIデザインを行う制作スタイルで制作しています。