【初心者向け】Webサイト発注指示書（ワイヤーフレーム）の項目・書き方講座

こんにちは。Cocoaのウェブディレクターの中島です。

この記事は、Web制作会社やコーディング、デザイン会社へWebサイト制作の発注を行う際に、発注指示書をどのように書くべきかをWeb制作会社の視点でお伝えする内容となっています。

弊社では、クライアント様から発注を受けることも、外部制作会社へ発注を依頼することもあります。

つまり、発注書を示されることも、書くこともあるわけですね。

発注者、受注者、両者の目線から「良い発注書とは何か」をお伝えしていこうと思います。

また、発注指示書というと見積書に対する金額だけが明記されたものを指すときもありますが、今回の記事でいう発注指示書とはワイヤーフレーム（ある程度の仕様を示すもの）および、要望書を指すものとします。

そもそも発注書とは何か？

Webサイト発注指示書とは、制作会社に「どんなWebサイトを作成してほしいか」を伝えるのを目的とした書類（データ）です。

発注指示書に書かれるべき内容は次の項でご説明します。

大体の場合、この発注指示書を受け取った制作会社は、その発注書をもとに「デザイン案」と「仕様書」を提出します。

「デザイン案」は、発注指示書に書かれている要件を形にするとこんなデザインになりますが、どうでしょうか？という意味合いの書類です。トップページと下層ページ、それぞれの具体的な見本といった形です。

一般的にPDFファイル、もしくは画像データで提出され、発注元がOKを出すとそのデザインでサイトが製作されていきます。

基本的にOK後にはデザインの修正は受け付けない、もしくは有料での対応になります。

「仕様書」には、Webサイトの大まかな仕様が記載されます。

例えば、

・スマホ対応（対応機種・対応方法）

・対応ブラウザ（対応するブラウザの種類）

・使用する言語（HTML、CSS、PHPやJavascriptなど、またそのバージョン）

・セキュリティ（SSL通信など）

・CMSを使用する場合はそのCMS（WordPressやMovableType、EC-CUBEなど）

・暫定納期

こんな内容になります。

こちらも構造的な部分ですので、OKを出した後の変更は受け付けない、もしくは有料での対応になるのが一般的です。

どちらも変更が効きにくい項目ですので、疑問や質問がある場合は必ずこの段階で制作会社に投げるのが良いでしょう。仕様書が提出された時点では、比較的変更が容易なケースが多くあります。

一方、仕様書が提出されない場合は、仕様書の有無、またその後の対応を確認しておくのが理想的です。

なぜ発注指示書を書く必要があるのか

発注指示書を書くなんてめんどくさい！

口頭で言えばいいのに・・・、制作会社がテンプレートを用意すればいいのに・・・

発注担当者はきっとこう感じたことがあると思います。

しかし、発注指示書を用意することは大きなメリットがあります。

もちろん、制作会社のメリットだけではありません。発注会社にもメリットがたくさんあります。

以下で、そのメリットをご説明します。

・発注料金が安くなる傾向がある

ちゃんとした発注指示書を用意する場合と、まったく用意しない場合では制作会社の出してくる見積もりが変動する場合があります。というよりも、発注指示書がある場合、基本的に見積もりが安く、そして正確になります。

Webサイト制作会社の見積もりは、原則デザイナー、コーダーの人件費が大半を占めます。

精度の高い発注指示書がない ＝ 途中で変更がありそう、やり直しが多そう ＝ 人件費が余分に発生するかもしれない

と判断します。

そうなると、見積もりにもバッファー（余剰・保険）を乗せることとなります。

スムーズにいけば、100万円の案件でも、120万円の見積もりを出さざるを得ないのです。

・無駄な伝言ゲームを減らせる

発注する会社にも、部下と上司、意思決定者がいると思います。

現場で、制作会社との間で商談が進んでいても、上司の鶴の一声で途中まで進んでいたものが一気にゼロに戻ってしまうこともあります。

この場合、やり直しになってしまった部分は追加で請求されることとなります。（または一部を制作会社が被ります）

こうなると、無駄にコストが増えるだけでなく、次回以降の見積もりも少し高くなっていくことが予想されます。お互いに良いことではないですね。

仕様書を作ることで、発注会社の意思決定が一本化されやすいというメリットがあります。

これにより無駄なやり直し、追加請求、関係性の悪化を防ぐことが出来ます。

・意図していたものと違ったものができたときに防衛できる

発注指示書に書かれている内容が仕様書や製品に反映されなかった場合、制作会社にやり直しを要求できます。

言った言ってないの水掛け論を回避でき、相手方のミスを証明できます。

発注指示書の作成は、契約書同様、自社の防衛とも言えるのです。

発注書に書くべき内容

発注指示書に書くべき内容は、大きく分けて４つです。

１．サイトの目的、目標

２．サイトでやりたいと思っていること

３．理想とするサイト

４．可能な範囲で具体的な要求仕様

以下でそれぞれの項について詳しく説明していきます。

１．サイトの目的、目標

まずは、Webサイトの目的や目標を伝えましょう。

具体的には、

「既存サイトをスマホ対応にしてアクセスを増やしたい」

「新商品をリリースするから、新商品に特化したサイトを作成し、SEO対策してほしい」

などです。

目標は具体的な数字があったほうが良いですが、（アクセス1.2倍など）ない場合はそれでもかまいません。またアバウトな部分は制作会社が質問しますので、なるべく答えてあげると良いでしょう。

サイトの目的が制作会社と共有されていると、より具体的な提案やアイデアが出てくる可能性が上がります。また、リニューアルの場合は、既存サイトの問題点を分析することも可能になります。

２．サイトでやりたいと思っていること

サイトの目的と共通する部分があるとは思いますが、例えば

「お問い合わせフォームの問い合わせデータをエクセルで一覧管理したい」

「ホームページにメールマガジンの登録フォームを置いて、送信も簡単にしたい」

「Facebookのいいねボタンを各ページにつけたい」

など、具体的な要望がある場合は、示すと仕様がより要望に近いものになります。

なるべく具体的に、箇条書きするのがコツです。

３．理想とするサイト

ほかのサイトで、このサイトいいなぁと思うサイトを例として示すと、より仕様が要望に近いものになります。主に、サイトデザインに有効です。

「デザインの理想サイト」と「インターフェースの理想サイト」を分けると尚良いです。

インターフェースとは、ロゴの配置や、バナーの場所、新着情報の表示形式など、サイトの構造的な部分です。サイトの使いやすさの部分といっても良いでしょう。

一方、ここで言うデザインとは、サイトの色合いや写真の使い方、アイコンの感じなどサイトの見た目の部分です。

それぞれを分けて提示することで、より理想的なものがデザイン見本として上がってくる可能性が上がります。

４．可能な範囲で具体的な仕様要求

ある程度、HTMLの知識やCSSの知識、WordPressなどCMSの知識など、Webサイトに関する仕様を提示することが出来るのであれば、具体的に提示したほうが良いです。

例えば、下層ページのタイトルはh1タグを使用、記事内にはh2タグを配置、余白は下に20px追加、、など具体的に指示すると、意向に沿ったデザイン案が上がってきます。

また、PCサイトで表示する部分とスマホサイトで表示する項目なども具体的に指示してあげると良いでしょう。

もし可能であれば、ざっくりとサイトの幅や構造を書いたA4用紙やPDFを作成すると理想です。

仕様書にしっかり反映されているかを確認を

ちゃんと発注指示書を作成した場合、発注者の希望がしっかりと仕様へ反映されているかのチェックも容易になります。

希望・要望が反映されていない場合はこの時点で制作会社へ確認しましょう。

また、制作会社にコンペを行う場合は、コンペ前に以上の項目を示すことで、制作会社をより比較しやすくなります。

—

以上が理想とする発注書の骨子となります。

確かに、発注指示書を作成するのは労力がかかりますし、初めて作る場合などはどうやって作成してよいかわからない場合もあるかと思います。

その場合は、とりあえず作成してみて制作会社と話し合いながら完成させていけばよいと思います。

結果的に良い制作物を作るためには、発注指示者の希望を制作会社へ伝えることは避けられません。

制作会社からも良い提案を引き出すためにも、ぜひ発注書を作成し、納得のいくWeb制作発注を行っていくと良いでしょう。

いずれは発注指示書の見本や、テンプレートなども公開していこうと思います。