ワイヤーフレームでWebサイト制作を進める時の注意点

  • このエントリーをはてなブックマークに追加

受託案件を何件もやっていると、お客さんによってはパワポで作ったワイヤーフレームを嫌がるお客さんもいらっしゃいます。

作り方にも拠ると思うのですが、四角とか丸で作られたレイアウトだけを見てもいまいちイメージ付かないし、実際にデザインされた際にどうなるのか見ないと判断付かないというのがもっぱらのご意見です。

作る側にとってみると、サイト作っちゃってからあれこれ直されても困っちゃうので念には念を入れて確認して制作を進めていくわけですが、我々業界の人間が当たり前に思っている進め方が、どんなお客さんにも通じるかというとそうではありません。

ワイヤーフレームは非常に重要なもので、作っちゃってから直すというと、頼んだ方も作った方もお互い不幸になってしまいます。
Web制作を何度も担当したことのあるお客さんなどであれば、スムーズかも知れませんが、必ずしもそうではありません。

それでも避けられない工程ではありますので、なんとか納得していただきながら、進めるためのワイヤーフレームのポイントをまとめてみました。

お客さんによって反応などは全然違うと思いますので、ひとつの参考としてご覧いただければと思います。

まず、これはイメージではなく、情報の配置であるということを念を推す。

当たり前のように何の説明もなく、ワイヤーフレームを見せて「サイトの構成です」という風に説明すると、このまま色が付いてデザインされてしまうと感じてしまうようです。
(業界にいると常識的な進め方だとしても、初めてWebサイトを作ろうとか、初めて業者に頼む方に取ってみるとこの当たり前の感覚は違います。)

あくまでも「どこに何を置くという情報配置である」ということと、何故ここにこの情報を配置するのかの説明をまずはさせてもらいたい、ということを伝えたうえで説明しないと勘違いされてしまいます。

情報のサイズ感は盛り込んでおきたい。

各要素(メインビジュアルとかニュースとか)のサイズの割合くらいは盛り込んでおきたいところです。
お客さんがワイヤーフレームを嫌がるのはワイヤーフレーム自体が、設計図として成り立っていない場合だと思います。
(まさにイメージが付かない、という部分です。)

建築の設計図などはきちんと倍率を図って設計図が書かれているので、なんとなくイメージが付いたりしますが、Webサイトのワイヤーフレームで情報配置だけでサイズ感が良く分からないような資料だとイメージが全然付きません。

情報配置の資料であるならば、ある程度の情報量の割合(サイズ感)というのも明確になっている資料が望ましいと思っています。

色やグラデなどの装飾をあまり付けない。

色やグラデなどを付けられると、お客さんにとってはそれがデザインのように見えてしまい、固定概念が生まれてしまいがちです。
ワイヤーフレーム作ってると、パワポのグラデ機能とか使ってなんとなくきれいに雰囲気出したくなりますが、これはあまりやらない方が良いと個人的には思っています。

色やグラデなどの装飾を付けすぎてしまうと、そのイメージでお客さんの頭の中が一杯になってしまい、デザインが逆にイメージと違う、ということになってしまう場合もあります。
(これはデザイナーさんの腕に拠ると思いますが。)

ですので、ワイヤーフレームにあまりゴテゴテと不要な装飾を付けない方が良いでしょう。

きれいに作る。

お客さんに見せる資料だから当たり前なんですけどね。
きれいというのが、装飾をするということではなく、線の細さから見易いような工夫をすることです。

配置だけ分かるように、お世辞にも見易いとは言えない資料を作ると、お客さんにとってもその情報配置が良いのか悪いのか何なのか分からなくなってきます。
「これはまだ構成段階の資料でして。。」なんていう言い訳はお客さんには通用しませんよね!

人に確認させる気持ちになる資料作りを心がけたいものです。

本当に一番良いのは。

ディレクターがワイヤーフレームを作ってまずはお客さんに確認して、というのがWeb制作の通常の流れのようになっていますが、個人的には出来るのであればデザイナーさん、もしくはアートディレクターと呼ばれるような方がワイヤーフレームを作った方が良いのかな?なんて思ったりもします。
(じゃあ、ディレクターって何やるの?っていうのは置いておいて!)

見せたい部分を効果的に見せる、とかそういう部分はデザイナーも意識する部分ですし、レイアウトもデザインの一部なので、デザイナーがやっていても違和感ありません。
(ただ、デザイナーさんはデザインもしなきゃいけないし、とか色々タスク負荷の話もあったりしますので、難しいところではあります。)

でも、制作側の都合で色々と資料を見せられるよりは、お客さんにとってはデザインやイメージを早くみたい!というのが本音で、いかにスムーズにイメージまで進めるかっていうのが制作の課題でもあります。

個人的に思ったことなんで、会社や担当の方によって考え方ややり方はまちまちかと思います。

参考までに。

執筆者:高本

株式会社8bit 取締役の高本です。 社内のWebサービス企画、プログラミングや、売上・請求管理にいたるまで幅広く担当しております。

関連記事

WordPress

アンケートフォームをホームページに設置できるWordPressプラグインの活用事例4選

WordPressでアンケートフォームを作成したい!けれどきちんと日本語対応しているプラグインが見つからない…と思ったことはありませんか? 弊社でリリースをしたフォーム作成作成プラグイン「Easy Form Maker」であれば、完全日本語対応で、通常のお問い合わせフォームだけでなく、アンケートフォームの作成を行うことができます。 今回は、実際にどんなアンケートフォームが作成できるかご紹介します。 目次1 Easy Form Makerって?2 イベントなどのフィードバックア […]

WordPress

カレンダーをホームページに表示できるWordPressプラグインの活用事例4選

イベントのお知らせをカレンダー形式で掲載したいけれど、なかなかWordPressの日本語プラグインでピッタリなものが見つからない…と思ったことはありませんか? 弊社でリリースをしたWordPressのイベントカレンダープラグイン「Event Calendar Maker」であれば、完全日本語対応で、ホームページ上に簡単にイベントカレンダーを掲載することができます。 今回は、実際にどんなシーンでこのカレンダーが活用できるのかをご紹介します! 目次1 Event Calendar […]

スマホアプリ

高齢者を見守るアプリ「みまもりシルバー」をリリースしました!

高齢のご家族が外出中、いつもと違う時間に帰ってこないと、ちょっとした不安が頭をよぎることはありませんか? 「道に迷っていないかな」「転んでいないかな」…心配事はなかなか尽きないですよね。 そんな心配をすぐに解消できるGPS見守りアプリ「みまもりシルバー」をリリースしました。 メールアドレスなどによる会員登録やサービス契約は不要!基本無料で、かんたんに使うことができます。 この記事では、アプリの魅力や使い方を詳しくご紹介します。 目次1 みまもりシルバーはなにができるの?1.1 […]

株式会社8bit (エイトビット)

東京都目黒区でWebサイト制作、Webシステム開発などを行っております。
コーポレートサイトやWebサービスの企画・提案を得意としており、自社での経験を元にアイデアをカタチにするお手伝いをさせていただいております。

Web制作に関するご相談はお気軽にどうぞ

弊社に制作をご依頼いただく際の費用感をご確認いただける、
見積りシミュレーションをご用意いたしました。