ワイヤーフレームの作り方

ホームページを作ろう！ホームページを作る際に必要なもの 2009-04-18 13:00

ワイヤーフレームの作り方

環の小坂です。
昨年末に連載した「ホームページを作る際に必要なもの」の続きです。
「サイトフロー」「画面フロー」「スケジュール」のお話を以前しました。
ＥＣならば「運営計画」も必要です。

今回のテーマは「ワイヤーフレーム」です。
制作の際に作る資料というのは下記の目的があります。
・関係者（顧客・営業・制作など）の意識共有
・要件チェック（漏れがないか、それで確定か）
・考えるための参考資料

ここで重要なのは「情報共有」即ちコミュニケーションです。

サイトフローがサイトの構成のコミュニケーションツールであり、
画面フローはそこから主にシステムの要件共有を手助けするものです。
スケジュールは各関係者のタスクや納期を考えるもの。
運営計画は予算や広告費などの考察をするものです。

ワイヤーフレームでは下記に重点をおきます。
・サイト内における優先順位
・コンテンツの分類・整理
・機能の視覚化
・ナビゲーション
・将来の拡張性などの考察
です。

この中で一番重要なのは「優先順位」。
ナビゲーションの配置は何を一番見て欲しいのかや
導線を決定する上で重要な要素です。
ページの上部に掲載するものが優先順位が高いことも言うまでもありません。
また、運用や将来の拡張性をどのように考えるかという視点も必要です。

主にトップページでワイヤーフレームを作成しますが、
複雑な意思決定が絡むこともありますので、
作成する中で何度も修正が入ります。
（自身の中で修正を入れていきます。）

ですから作成するツールや方法は「変更しやすい」ことが最重要です。
そういう意味で私はパワーポイントはお勧めせず、
エクセルで作成することが多いです。

ワイヤーフレームの副次的な使い方としては
議事録代わりにもなります。
顧客が文章や口頭で話したことや打ち合わせたことを
確認するのに視覚化は重要です。

最後にワイヤーフレームの作成ですが、
「短時間」で作成することが重要です。
デザイン要素はありませんし、システムもある程度考える必要はありますが、
設計要素はありません。
サイトフローなどがある前提では2時間以上かけるとかけすぎでしょう。
（もちろんサイトの規模にもよりますが）
通常のサイトの場合は1時間程度で書きます。

これが時間かかる場合は
・要件が整理できていないので、そこからやり直す。
・余計なこと（意味のない装飾など）に時間をかけているだけなので、
　切り上げる
のどちらかが重要であると思います。

昨日ワイヤーフレームの説明会を開催しましたが、
今後も開催する予定ですので、興味のある方はお問い合わせください。