1. ホームページ制作 TOP
  2. ホームページ制作依頼の教科書
  3. 企画・設計

企画・設計

どうも、ウェブ企画パートナーズの竹内です。 今回は「企画設計」についてお話ししたいと思います。ホームページの制作を進めていき、契約を結んだ後、いよいよホームページを作り出していくぞと、もう格好いいサイトを作っていくぞとなった、その一個手前に行う作業が企画設計になります。

ホームページ制作で “無策” は禁物

無策で走り出しても、ろくな結果になりませんので、制作に入る前に一旦落ち着いて話し合うフェーズが必要です。いわゆる「キックオフミーティング」と呼ばれるもので、ここで色々すり合わせていきましょうというのが、この企画設計のフェーズになっております。

企画設計で決めるべき３つのこと

具体的に何をするかというと、だいたい3つぐらいのことを決めていきます。今回ご説明するのは、一般的なコーポレートサイトやサービスサイトを想定した企画設計です。飛行機の予約システムのような、非常に複雑なものを想定しているわけではありません。

その3つとは「サイトマップ・ワイヤーフレーム・コンテンツ」です。これらをしっかり決めていきましょうというのが、企画設計のフェーズになりますので、それぞれ詳しく解説したいと思います。

１．サイトマップでページの全体像を把握する

まず1つ目はサイトマップと呼ばれるものです。サイトマップとは、例えば図で表現すると、トップページが一番上にあり、その下の階層に「サービス」や「料金」といったページがぶら下がっている、ツリー型の構造でサイト全体の階層を視覚的に表現したものを指します。

サービスページの中にさらに個別のサービスがあったり、さらに3階層目に何かがあったり、といった構造を明確にするんですね。これで、だいたいどんなページが出来上がるのかを事前に想定しておきましょうというのが、このサイトマップの役割になります。

事前のすり合わせで認識のズレを防ぐ

このサイトマップがあることで、「うちのサービスは本当は3つあるのに、この図だと1個しかサービスがないからおかしいですよね」といった具合に、認識のズレを視覚的に、そして事前に把握することができます。

もう少し突っ込んだサイトマップですと、各ページにどんな要素が入るかまで定義します。例えば、「サービスページには具体的にサービスの強みが入りますよ」とか、「こっちのページはサービスの一覧表示のみにして、別のページでサービスごとの強みを説明しますよ」といった内容です。ほかにも、「料金ページ内によくある質問を入れるのか、それともよくある質問は独立したページとして別に作るのか」といった、そういったページ構成を事前に決めるものをサイトマップと呼びます。ページ構成の図、と言い換えると分かりやすいかもしれませんね。

２．ワイヤーフレームで情報の配置を決める

続いてはワイヤーフレームです。ワイヤーフレームは、おうちでいうところの設計図みたいなものだと考えてください。先ほどのサイトマップではページ全体の構成をざっくり考えましたが、今度は具体的にそのページでどんな感じで情報を配置していくのかを考えていきます。

例えば、このあたりにロゴがあって、お問い合わせボタンがあって、メインビジュアルがあって、その下に強みが紹介されていますよ、といった感じです。デザインをする前に、まずデザイン的な要素を排除した状態で、どういう情報が入るのか、その情報はお客様に伝わる効果的な順番で配置されているのか、といったことを確認していきます。

前のステップでページの構造はわかりましたが、各ページがどうやってリンクで繋がれるのか、というイメージまではまだ湧いていないと思います。ワイヤーフレームでは、「お問い合わせページにはここからリンクが繋がれていますよ」とか、「実は下の方にも同じようにお問い合わせへのリンクがありますよ」といった、具体的なページの繋がりまで決めていくのが役割になります。

３．コンテンツでサイトに魂を吹き込む

最後がコンテンツです。先ほどのワイヤーフレームで「強みを1・2・3と紹介する」という配置に決めたとします。でも、「実際はここは動画で載せたいと思っている」ということであれば、その動画はどういう内容にするのか、YouTubeにアップするのか、あるいはVimeoのような別のストリーミングサービスにアップするのか、といったことを決める必要があります。

文章やキャッチコピーをどうするのかも、このフェーズで話し合います。例えば採用サイトの場合、会社の想いに共感してくれる、いわゆるカルチャーフィットする人が欲しいと思うので、それに合わせたコピーを考えますよね。会社の方向性によって「うちで働いたら全員年収1000万です」とアピールするのか、それとも「何年後に何を目指します」とビジョンを語るのかは様々だと思います。

そういったコピーを自社で考えるのか、制作会社にお任せするのか、はたまた外部のコピーライターの力をお借りするのか。このように、具体的にやりたい内容をどう実現していくか、その中身を話し合うのがコンテンツのフェーズになります。

まとめ：急がば回れ。手戻りをなくす企画設計

以上が、ホームページを実際に作り出すぞ、となる前に、まずは一旦落ち着いて企画と設計をしていきましょう、というお話でした。

サイトによっては、例えばシステム的な要素があれば、「要件定義」という、より詳細な取り決めが必要になることもあります。ホームページ制作はだいたいスケジュールが決まっていると思いますので、後から「やっぱりこうじゃなかった」と戻る作業が発生すると大変です。

手戻りが少なくなるように、あらかじめ企画とか設計をしっかりしておくことによって、困ったことにならないようにしましょう、というのがこの企画設計の目的になります。