Webサイト制作の企画提案書の作り方

こんにちは、デジマール株式会社のシラバス編集部です。

Webサイトの企画提案書の作成にお悩みですか？企画提案書は、ただアイデアを「主張」するものではなく、実際に「判断」を促す重要なドキュメントです。この記事では、初心者の方でも理解しやすいように、Webサイトの企画提案書の作成方法を丁寧に解説していきます。もしすぐにプロの手を借りたい場合は、デジマールへこちらからお気軽にご相談ください。それでは、始めましょう！

Webサイト制作における企画提案書の意義

企画提案書の作成意義は、提案するアイデアが実際にどのようにして課題を解決し、目標とする状態へと導くのかを具体的に示すことにあります。企画提案書は、単なる「主張」のものではなく、受け手が提案内容に基づいて「判断」を下せる必要があります。

また、完成イメージの共有と相手の共感を獲得することにも意義があります。必要な関係者の強力や、アイディアのフォローをもらえる可能性があるからです。企画提案書が、現状と理想の間に存在する課題を克服するための架け橋として機能するのです。

以下より、Webサイト制作における企画提案書の構成要素を解説します。

①与件整理

与件整理の重要性

与件整理の目的は、クライアントのニーズや問題を正しく理解し、ウェブサイトの目的や目標を設定することです。しかし、与件整理の際には注意が必要です。なぜなら、クライアントが話す与件は、しばしば表面的な事象に過ぎず、その背後にある実際のニーズや問題を見極める必要があるからです。

例えば、「ウェブサイトの訪問者数が増えない」という表面的な課題がありますが、実際にはウェブサイトのコンテンツがターゲットユーザーに響いていない、あるいはSEO対策が不十分である可能性があります。つまり、真の課題は「ターゲットユーザーに合ったコンテンツ戦略の欠如」という形で表れることもあります。このように、与件整理では、クライアントが述べる事象を鵜呑みにせず、その背後にある根本的な問題やクライアントの本質的なニーズを理解することが重要です。これにより、表面的な要求に応じるだけでなく、ウェブサイトの真の価値を高める効果的な提案を行うことが可能になります。

与件整理の方法

与件整理の方法は、プロジェクトの規模や内容によって異なりますが、一般的には以下のステップを踏むことが推奨されます。

クライアントとのヒアリング：クライアントのビジネスや業界、競合他社、ターゲットユーザー、ウェブサイトの目的や目標、期待する効果や予算などを詳しく聞き出します。この際には、クライアントの言葉だけでなく、その背景や理由も掘り下げて確認します。

与件の整理と分析：ヒアリングで得られた情報を整理し、クライアントのニーズや問題を明確にします。また、現状のウェブサイトの分析や競合他社のベンチマークなどを行い、課題や改善点を洗い出します。

与件の確認と調整：整理と分析した与件をクライアントにフィードバックし、共通の理解を得ます。また、必要に応じて、与件の優先順位や範囲、期限などを調整します。

以上のように、与件整理は、クライアントとのコミュニケーションや分析力が求められる作業です。しかし、与件整理をしっかりと行うことで、クライアントの満足度を高めるだけでなく、自分たちの制作プロセスや品質も向上させることができます。与件整理は、Webサイト制作の成功の鍵と言えるでしょう。

②サイトコンセプトの作成

サイトコンセプトを策定するには、以下のような手順を踏みます。

1. 5W1Hを考える

与件整理でリストアップした内容をもとに、サイトが誰のために何を提供し、いつどこでどのように利用され、なぜ必要なのかという5W1Hを考えます。これは、サイトの概要や特徴、ベネフィット、ターゲットユーザー、コンテキストなどを明確にするために有効です。

2. キーワードを抽出する

5W1Hから、サイトのコンセプトを表すキーワードを抽出します。キーワードは、サイトのコアバリューやキャッチフレーズ、テーマやカテゴリーなどを示すものです。キーワードは、可能な限り具体的で独自性のあるものにします。

3. メッセージを作る

キーワードをもとに、サイトのメッセージを作ります。メッセージは、サイトのコンセプトを一言で伝えるものです。メッセージは、シンプルでわかりやすく、ターゲットユーザーに訴求力のあるものにします。

4. メッセージを検証する

メッセージをクライアントやターゲットユーザーにフィードバックしてもらい、その響きや効果を検証します。また、競合他社のメッセージと比較して、差別化や優位性を確認します。

5. メッセージを修正する

検証の結果に基づいて、メッセージを修正します。修正する際には、与件や目的、方向性に沿っているかどうかを常に意識します。

以上のように、サイトコンセプトの策定は、与件整理の成果を最大限に活かし、サイトのイメージや魅力を高める作業です。サイトコンセプトは、Webサイト制作の土台となるものなので、しっ=かりと策定することが重要です。

③デザインカンプ（トップページ）の作成

デザインカンプとは、ウェブサイトのデザインやレイアウトを含めた、「完成見本」のことです。「カンプ」や「モックアップ」と言ったりもします。サイトの最終的なビジュアルイメージを決定するために作成されます。この段階では、色使い、フォントの選択、レイアウトの配置など、サイトの全体的な視覚的要素を慎重に選び、決定します。デザインカンプを作成することによって、クライアントやチームメンバーに対してサイトの具体的な見た目を示すことが可能となり、プロジェクトのビジョンをより明確に伝えることができます。

④ワイヤーフレーム（代表的な下層ページ）の作成

ワイヤーフレームは、Webページの基本的なレイアウトやコンテンツの配置を定めるための設計図です。ワイヤーフレームの概念は、文字通りシンプルな線や図で構成されたもので、Webページの骨組みを示します。

例えば、ガーデンの設計を考える際に、どこに花壇を作り、どの部分に歩道を配置するかを計画するように、ワイヤーフレームを使用してWebページ上で「重要な情報はこのエリアに配置しよう」「ユーザーが興味を持ちそうなコンテンツはここに設けよう」といった具体的な配置を決めます。ワイヤーフレームをしっかりと策定することで、後のデザインやコーディングの段階での突発的な変更や修正を防ぎ、効率的なウェブサイト制作の進行を保証します。

ワイヤーフレームはデザインの前の段階に位置する設計図であり、デザインカンプは最終的な完成レイアウトを示すものです。これらは異なるステータスを持ち、特に現代のウェブデザインにおいては、スマートフォン版とPC版のワイヤーフレームをそれぞれ別に作成することが一般的です。これにより、異なるデバイス向けに最適化されたユーザーエクスペリエンスの設計が可能になります。

⑤要件定義書の作成

要件定義書は、サイト構築のための技術的な要件を詳細に記述するドキュメントです。ここには、ページ数、画面設計、使用するサーバーやドメイン、コンテンツマネジメントシステム（CMS）など、サイト構築に必要なすべての技術的な情報が含まれます。要件定義書は、プロジェクトチームが一貫性のある方向性で作業を進めるための指針となります。

 

 

例：

⑥ディレクトリマップの作成

ディレクトリマップは、ウェブサイト内に設置されたすべてのページのタイトルやURL、内容などを網羅した一覧表です。ウェブサイトの制作者やクライアントなどの関係者間で情報を共有するために作成され、各ページの詳細を記載することが特徴です。

ディレクトリマップの効果には、サイトの全体像を把握すること、コンテンツ管理や制作を効率的に行うこと、情報共有を容易にすること、タイトルやディスクリプション、内容の把握によるSEO対策の強化などがあります。また、見積もり資料や進捗管理シートとしても活用できます。

ディレクトリマップは内部用資料であり、主にExcelなどの表計算ソフトで作成されることが多いです。サイトマップとは異なり、ディレクトリマップはサイトの構造を制作関係者に共有するために作成され、ページの内容を詳細にまとめている点が特徴的です。一方、サイトマップは一般的にユーザーや検索エンジンにサイトの構造を共有するために作成され、ページのタイトルや階層などを簡単にまとめたものです。

⑦WBSの作成

WBS（Work Breakdown Structures)、すなわち作業分解構造は、ウェブサイトプロジェクトの全タスクを体系的に管理し、プロジェクトの進捗を明確に追跡するための重要なツールです。以下に示すプロセスは、一般的なWBSの構成です。

1. 要件定義

   • サイト基本仕様の策定
   • 機能要件の定義
   • 非機能要件の定義
   • お見積もりの作成

2. 設計

   • サイトマップの作成
   • ワイヤーフレームの作成
   • コンポーネントの設計
   • CMS機能の設計
   • システム設計（例：お問い合わせフォーム）
   • 開発環境および本番環境のサーバ環境準備
   • ドメイン管理と設定定義
   • サーバ証明書の契約と設定
   • アクセス解析の設計
   • 連携サービスの契約
   • テスト・検証計画の立案

3. 制作

   • トップページデザイン
   • 主要下層ページのデザイン
   • 画像パーツの作成
   • 画像素材の購入
   • ベースコーディング
   • 下層ページのコーディング
   • CMSテンプレートの開発
   • システム開発（例：お問い合わせフォーム）
   • アクセス解析の設定
   • 表示検証・機能検証

4. 導入・テスト

   • コンテンツ移行計画の策定
   • データの移行
   • CMSデータの投入
   • 301リダイレクトリストの準備
   • CMS利用ガイドの策定
   • CMS利用方法のレクチャー会
   • コンテンツの検証
   • 公開計画の策定
   • 開発環境と本番環境の差分反映

5. 公開

   • 本番環境への公開（DNS切り替え対応）
   • 公開通知設定（サーチコンソールでのsitemap.xml配信）
   • 公開後の動作確認（パス参照、アクセスログ取得

このように、WBSはプロジェクトの各フェーズで必要なタスクを整理し、プロジェクトの進捗を効果的に管理するための重要なツールです。ウェブサイト制作において、WBSは明確な目標設定、効率的な作業分担、タイムラインの管理など、プロジェクトを成功に導くために不可欠な役割を果たします。

⑧見積書の作成

見積書には、プロジェクト全体を通じて発生するさまざまなコストが網羅されており、プロジェクトの予算管理とクライアントへの透明性を確保するための基盤を提供します。以下に、見積書に含まれる主な項目とその解説を示します。

1. 進行管理費

   • プロジェクト全体の管理や調整に関わるコスト。プロジェクトマネージャーやチームリーダーによる管理作業にかかる費用が含まれます。

2. 企画費・プランニング費

   • サイトの基本構想や戦略の策定に関する費用。クリエイティブなアイデア出しや戦略計画の作成に要するコストです。

3. サイト設計費

   • サイトの構造、ナビゲーションシステム、ワイヤーフレームの作成に関わるコスト。サイトの基本設計にかかる費用を含みます。

4. 環境構築費

   • 開発環境や本番環境のサーバ設定、ドメイン取得などに関連する費用。サーバレンタル料やドメイン登録料などが含まれます。

5. デザイン費

   • サイトのビジュアルデザインに関する費用。ページデザインやグラフィックデザインにかかるコストを含みます。

6. コーディング費

   • HTML、CSS、JavaScriptなどを用いたウェブページの実装に関する費用。フロントエンドおよびバックエンドの開発にかかるコストです。

7. 素材費（写真やイラストなど）

   • サイト内で使用する写真やイラスト、その他のビジュアル素材にかかる費用。写真購入費やイラスト制作費が含まれます。

8. SEOの内部対策費

   • ウェブサイトの検索エンジン最適化に関する費用。メタタグの設定、コンテンツ最適化などのSEO戦略に関連するコストです。

9. 運用・保守費

   • サイトの公開後の運用や保守に関する費用。サイトの定期更新、セキュリティ対策、バックアップの実施などにかかるコストを含みます。

以上の項目は、ウェブサイト制作プロジェクトにおける費用見積もりの作成に不可欠です。これらの項目を網羅することで、プロジェクトの予算を適切に管理し、クライアントに対して透明性の高い見積もりを提供することが可能になります。

まとめ

この記事では、Webサイトの企画提案書作成に関する基本的な知識と具体的な手順を紹介しました。企画提案書は、Webサイト制作の成功の鍵です。もしこのプロセスについてさらに詳しいアドバイスや支援が必要であれば、デジタルマーケティングエージェンシーのデジマールへぜひこちらからご相談ください。