ホームページ制作会社エスエムティのスタッフコラム

  • HOME  >  
  • スタッフコラム  >  
  • ホームページ制作時に必要な企画提案書の構成と内容を「チョットだけ」ご紹介
HIRAYAMA 記事担当
HIRAYAMA
投稿日:21.09.24 
最終更新日:21.12.16

ホームページ制作時に必要な企画提案書の構成と内容を「チョットだけ」ご紹介

カテゴリ:ホームページ制作

タグ

このコラムをSNSでシェア!

こちらの記事も読まれています
ランディングページとWebサイトの違いとは?目的に合ったものを作ろう!
サーバーとドメインの基礎知識 ホームページの運用に必要不可欠なサーバー・ドメインについて紹介します

企画提案書について

ホームページ制作やWEBシステム開発のご相談を頂く際、お客様から仕様書や要件定義書(または要求定義書)を頂きます。
もしくは、ご要望や考えをヒアリングする所からスタートします。

ホームページ制作会社が作る企画提案書の内容とは?

お客様から掲示された要件定義が詳細に示されていて、こちらから企画や提案無しで制作を進めることがあるのか?

答えとしては「ほぼ、ありません」

お客様から頂く資料は基本「ホームページ制作で実現したいことを、整理した資料」なんですね。

要件定義書を受けて作成するのが企画提案書であり、

要件に対し、ホームページで具体的にどの様な方法、設計や仕組みを用いて実現するのか?

目的を実現するために要件定義を掘り下げ、手段を具体化したものです。
ホームページ制作の技術・専門知識を有する私どものお仕事になります。

そこまで要件定義書に記載できるのであれば自社でホームページを制作できますからね…。

hirayama
hirayama

家を建てる、店舗を開業したい、新しい事業を立ち上げたい…、
どれも専門家に相談しますよね。

ホームページも同様だと思ってください。

企画提案書の無料作成キャンペーンも実施しております。お気軽にご相談ください。

この記事では作成した企画提案書の一例を用い、その流れをご紹介しています。

お客様がご要望を纏める上でも参考になる部分があると思います。
参考頂ければ幸いです。

企画書の定石について

企画書は第一パート(課題)、第二パート(考察)、第三パート(解決)の3章で構成するのが提案書の定石的な構成です。提案書の基本の三章構成とも言われてます。

三幕構成は脚本の構成として有名ですよね。
(映画の脚本はほぼ、三幕構成)

企画書や他の文章や考えの組み立ての時、三幕、三章構成を取り入れては如何でしょうか?
意識して組み立てるとスムーズで論理的な資料を作成できますよ。

hirayama
hirayama

組み立て方は様々で。正解はありませんが「お客様に刺さる提案」を意識しています

企画書の構成・流れについて

企画書の構成と内容例について

それでは企画提案書の「構成と内容例」をご紹介。

事細かく詳細までは…ノウハウもあるので省略しますね。
流れと各パートのプロット程度としてご紹介します。

企画書提案書の導入パート。与件整理とまとめ

企画書の導入部分ではホームページ新規制作、ホームページリニューアルに至った理由・与件を改めて再確認する所から企画書をスタートします。

改めて、今回の背景を資料化することでマインドフルネスに企画提案書に入って頂くためのパートです。

与件整理

お客様から頂いたご要望や要件定義書の内容を改めて簡潔に纏め、提示します。

「おさらい」となるパートですが意外に重要ですね。
この時点で与件が漏れていたり、足りない場合は企画全体が弱いものになりますので注意が必要です。
(与件が漏れている時点で失敗ですが…)

ご相談いただく段階では与件や要件定義自体が漠然としている、曖昧な場合も多々あります。

その場合にはお客様と商談やヒアリングをしっかりと行い、情報を掘り下げ資料化・言語化しましょう。
明文化がする事が大切です。

例えば、

  • 今回の要件「デザインが古くなったのでホームページをリニューアルしたい」
hirayama
hirayama

了解しました!やりましょう!

これでは全く掘り下げられてませんよね。

デザインが古くなればどのような悪影響が発生するのか?
デザインを一新することで獲得したい効果やターゲット、目的は何なのか?

掘り下げて、「デザインが古くなった」の先にある本当のお悩みや問題を抽出する事が必要です。

今回の与件「デザインが古くなったのでリニューアルしたい」

こんな企画書はNGですよね。企画書自体が不要です。新しいデザイン案を出せば済む話ですので。

しっかりとした与件整理を行いましょう。

※要件定義が曖昧ではなく、確たる方向性や内容が最初から示されている場合は省略する場合も。

まとめ

今回の与件・要件に対してどのような企画提案を実施するのか。
課題解決のために何を行うのか、何が提案できるのかの全体像を先に伝えます。

事細かく説明するパートはその後です。

目的を達成するための手段や分析を先に伝える場合もありますが、まずは何を提案・実現できるのか。
導入部分で先にしっかりとアピールしましょう。

ターゲットを定義する

ターゲットのペルソナ

与件に対するターゲットの分析・設定を行います。

ターゲットの設定例は例えば、

  • 10代の女子高校生
  • 宮城県仙台市エリア
  • 親が比較的富裕者
  • 運動系の部活に入っている

…など。

ターゲットを分析し、掘り下げる

勘や経験などではなくデータドリブンに分析・提案を行いましょう。
裏付けとなる様々なデータを集め、活用します。

ターゲットは「どのような情報を求めているのか」、「行動パターンは?」等々。
目的達成の手段・方法を具体化するためにも重要なパートとなります。

ターゲットインサイトとメインターゲット

ターゲットインサイトのまとめ、メインターゲット像を決定。

例えばメインターゲットを複数のペルソナ設置を用いて提案することで、ターゲットに必要なもの、準備すべき企画やコンテンツの具体化が可能になります。

想定するターゲットに対してアンケート調査なども実施できれば、さらにホットな分析・求めるモノの深堀も可能ですね。

hirayama
hirayama

ターゲットを明確化し、次に制作物の方向性・コンセプトを展開します。
お腹にスーーッと落ちる、納得性の高い提案を。

制作物の方向性を伝える

メインターゲットを見据え、具体的なホームページ制作物の方向性を展開します。

主として必要な情報やコンテンツは何か?

インサイト分析、メインターゲット像からどのような情報、コンテンツが必要か、刺さるかを展開。こちらもデータドリブンに仕上げましょう。

「メインターゲットの獲得施策」には何が必要かを、ポイントを押さえ展開します。

競合他社はどのような施策をしているのか?

  • 競合他社はどのようなサイト展開、コンテンツ展開を行っているのか?
  • 吸収すべき情報があるのか?
  • それを踏まえて自社のスタンス・ポジションはどこに置くべきか?

ポジショニングマップ等も利用し、他社事業やサービスとの差別化や自社優位性を表し決定します。

グランドデザイン

ターゲット、方向性をグランドデザインとしてまとめ、展開します。

ここまでのパートの纏め資料になりますね。
グランドデザインを明示し、腹落ちさせ、その次に具体的な制作物を伝えていきましょう。

※グランドデザインは言い過ぎかもですね。全体構想の意味合いとして。

具体的なデザインやコンセプトを展開

デザインやコンセプト

グランドデザインを実現するための具体的なホームページデザインやコンセプトなどを展開しましょう。

コンセプト

今回の制作物に対するコンセプトの説明を。
テーマやコンセプトが前提でのデザイン(または構成案・ワイヤーフレームなど)であり、意味があるものとなります。

コンセプトの説明なしにデザインだけの提案では…具体的な意図を理解して頂くのは難しいでしょう。

かなりザックリとなりますが、例えば…、

hirayama
hirayama

「高齢者のためのやさしいサイト!」
「地方創成をあなたと、一緒に!」
「女子高生はスマホが大好き♪」
「サスティナブルな家電製品販売」

…など。

一言で表現してしまうとキャッチコピーっぽくなりますね…。

デザインやワイヤーフレーム

成果物に近いものを提案する訳ですから、具体的に「目に見えるもの」として提案の説得力・臨場感も膨らみます。

メインターゲットの獲得施策に関連するキーとなるデザインやビジュアルを展開します。
サイト設計のベースとなるワイヤーフレームの提案でも良いでしょう。

ホームページは最終成果物が「紙」ではなく「パソコンやスマートフォンのモニタ上」です。

外部からのアクセスを制限したインターネット上にアップロードし、モニタで表示することで雰囲気や臨場感も倍増して伝わりますよ。

裏テーマ

こちらでこっそりと…裏テーマを入れる事があります。
(悪いものではありません)

「このデザインは実はこんな意図も」、「この企画で○○を実施しよう」など。
企画提案側の表に出ない内緒話があるかも。

表に、提案には説明を出さないことも多いです。

「何か裏テーマありますか?」と聞いてみるのも一つです。
面白い話がでてくることもあります。

hirayama
hirayama

実は別の案件でこの仕掛けを導入したらCVが3倍になったんです、
ですのでこの仕掛けを御社にもこっそり搭載しようと考えてました…みたいな(笑)。

サイト全体設計・施策について

サイト全体設計・施策

ターゲット定義、制作物の方向性、具体的なコンセプトやデザイン。
ここまでクライアントに提案できれば満足な感じもしますよね。

ですが、それは表面上のみの満足になってしまいます。

企画構成・設計側はさらに詳細なサイトの構成・仕掛け等々まで企画書に落とし込むべきでしょう。

それも含めて全てがホームページ制作の骨子となり、設計図となります。
運用をし、効果検証・改善等を実施するための土台までを、資料として作成しましょう。

hirayama
hirayama

提案に時間がない場合は技術的な説明も多いパートとなりますので割愛する事もあります。
ですが、こちらも同様に非常に重要な部分です。
要件定義や内容によりサイト全体設計・施策やポイントも異なります。
提案内容の一部をピックアップしてご紹介しますね。

ホームページのサイト構成図・設計図

具体的に提案を実現するためのサイトの全体像・構成図。

何処にどのような導線があり、メインメニュー候補は?サイトの回遊性は担保できるのか。
デザイン等とあわせサイト構成図をもって示すことで容易に全体像の把握が可能になります。

また、今後のサイトの改善や増改築を行う上でも重要な資料となります。

構成図上に更新システムが入るエリア、メールフォーム導入、お客様の更新頻度が高いエリアなど記載やマークも含めて作成を行います。

20~30ページのサイト構成図、数百ページの構成図などボリュームや内容により構成図の作り方・魅せ方も様々です。

実装するUI・UXについて

UI・UX

デザインや構成フレームを基に実際にどのようなUIを考え、搭載するのかを解説します。

また、ユーザーに対し各コンテンツは具体的にどのような内容や仕掛けを組み込んだUXを搭載・展開するのかを構成図の各エリア毎、または重要な箇所に絞って展開しましょう。

UIについて

UIとは、User Interface(ユーザインターフェース)の略で、ユーザーとコンピュータとが情報をやり取りをする際に接する機器やソフトウェアの操作画面や操作方法を指します。

ホームページの場合ユーザーと接するホームページの画面設計がUIに該当します。

主にはユーザーがストレスなく回遊できるか、使いやすさ・探しやすさの設計を行います。
ホームページに機能的価値を高める、ユーザビリティ設計を。

UXについて

UXとは、ユーザーエクスペリエンス(User eXperience)の略称で、プロダクトやサービスを通じて得られるユーザー体験を意味しています。UXの範囲はUIよりもさらに広く、UIを含めたすべての顧客体験を指しています。

※視認性や操作性を意味するUIはUXに内包される要素の一つ

デザインやコンテンツを通して、ユーザーの感性に訴え、ホームページ上で得られる体験・価値を高めます。
情緒的価値や感性的価値の提供も含まれます。

CMS(コンテンツマネジメントシステム)の導入について

WordPress管理画面

お客様自身で更新したい、システム化したいといったご要望を頂く場合。
よくご相談頂くのはニュースの更新、施工事例や実績の更新、採用情報の募集要項など。

タイムリー性が必要なお知らせの情報配信箇所、更新頻度が高い箇所に導入を提案します。

hirayama
hirayama

逆に、1年を通して1~2回の更新しか無いエリア等は提案を推奨しないことも。
システム開発コストを考えた場合、費用の割に合わないので…。

お客様が

「サイト全体をCMS化したいんだよね。」

と仰られた場合でも費用や頻度から、果たして本当に必要なのか?
確認する場合もあり、結果導入しないケースも。

CMSは導入が比較的容易な、既に土台のプログラムが組み上がっているWordpress(ワードプレス)の導入をご提案したり、複雑な出力設計の場合は1からシステム開発を行うケースもあります。

簡易的なニュース更新のシステムからネットショッピングのレンタルカートシステム、オンラインサロンの会員管理システムなど…色々。目的を達成するための補助システムにも多種多様なものがあります。

SNSツールの導入について

SNSを用いてのソーシャルマーケティングも効果的であり、お客様側からSNSを導入したいとご要望を頂くことがあります。最近は特に多い感じがしますね。

SNSと一言で言ってもFacebookLINEInstagramtiktokなど様々…。
それぞれのユーザー層や属性も特徴的です。

例えば、LINEを用いてのソーシャルリクルーティング施策、運用支援。
目的により最適なSNSツールの導入提案、活用方法を示します。

検索エンジン対策

お客様側から「検索エンジン対策をしたい」とご要望を頂くことが当たり前になってきた気がします。
ひと昔前は業界の言葉であって、一般の方はご存知のないキーワードでしたが。

ホームページ制作関連の営業電話も頻繁に掛かってきますよね。
検索エンジンで上位とか…Google MapでMEO対策が有効です!など。

hirayama
hirayama

頻繁に営業電話がかかってきたら覚えちゃいますよね…

検索エンジン対策としてどのような手法を用いるのか、モバイル対応の場合スピードの重要性に対してどのように対処するのか等々、説明をします。
また、コンテンツマーケディング実施など継続的なロングテールSEOの提案なども。

検索エンジン対策とは?
検索エンジン対策

簡単に言うと「社名」だけで検索されても潜在ユーザーに対しての集客力がホームページは弱い。
知らないユーザーがサービス内容や目的で検索した時、検索結果上位にあげる手法です。

例えばエスエムティの場合、例えば「ホームページ制作」や「WEBコンサルティング」での検索エンジン対策を行います。目的のキーワードで探しても、自社を知らないユーザーは「エスエムティ」で検索はしませんので。

効果測定ツールの導入

それでは全く意味がありませんよね?

ホームページ制作は手段であり、目的ではないのです。

完成した!よかった。お終い。


いわゆる一昔前のホームページがその状態でした。
ホームページを公開しておけば、誰か訪問するだろう。程度の。

ホームページ公開後データを解析・分析し、

  • 仮説は効果を生んでいるのか?
  • 目的は達成できたのか?
  • 改善点は無いのか?

確認と分析が可能なツールの導入を提案します。

いまだに効果測定ツールを導入していないサイトもあります。
一日何人のユーザーが来訪して、どのような行動をとったのか、契約に至ったのか等々…。

ホームページもリアルな会社や店舗と同じ。
効果測定ツールの導入は必須といえるでしょう。

スタンダードな効果測定ツールとしてはGoogle Analytics(グーグルアナリティクス)、Google Search Consoleなどを導入します(このツールはご存じの方も多いかと)。

しかし、導入するだけではあまり意図した効果検証はできません。
各種目的に対してKPIやKGIを設定し、運用後の分析・PDCA実践を行うための仕組みを設定しましょう。

KGI(Key Goal Indicator)-(重要目標達成指標)

例えば…お問合せを月に100件に増加させる。
このような最終的な目的をKGI(重要目標達成指標)として設定します。

お問合せ自体は最終目標にあらず、ホームページの外にKGIを設定する事もありますが。
例えばお問合せを頂いて実際の「成約数」等をKGIにするなど。
ホームページの運用側が、どのような経営上のゴールを設定しているかにより変わります。

KPI(Key Performance Indicator)-(重要業績評価指標)

KGIに向かっての中期的な指標をKPI(重要業績評価指標)と言います。
KPIは例えば

  • 1年後にアクセス数を3倍に増やす
  • 訪問数を○○までに倍増させる
  • 滞在時間を伸ばす
  • 直帰率を下げる

などがあります。

KGIもKPIも指数化・測定するために具体的な目標数値の設定が必要です。

KGI:カラオケで95点の採点結果をだす(私は90点が上限です…。)
KPI:毎日3時間歌の練習をする、音楽教室に週3回通う。

KGIを達成するためのKPIは適切でしょうか?
また、KPIを実現するための具体的なアクションまで必要ですよね。

PDCAを回しましょう。

スケジュール・プロジェクト体制について

ホームページ制作企画・進行においてはスケジュールシートの作成・提出は必須と考えて良いでしょう。

「出来上がり次第でいいや」

「春までには…」

曖昧な場合、ホームページ完成までの期間がダラダラと伸びるケースが多々あるんです。
私達は「ホームページ制作関連業務」が本業ですが、お客様の大多数が「本業の合間」「本業とは別に」ホームページを制作を考え、相談しますよね?

よくあるケースが

「本業が忙しくて…」
「落ち着いたら再開します」

そういったパターンがあります。延び延びで1年以上かかることも…!

初心を忘れてしまう事にもなりかねませんので契約期間・スケジュール設定はしっかりと行うべきでしょう。
延びのびになった挙げ句、情勢も変わり仕切り直しなんて事も…。

プロジェクト体制も資料として作成するべきでしょう。

  • プランナー
  • ディレクター
  • クリエイター
  • コーディング・更新担当
  • システムエンジニア
  • プログラマ
  • 緊急連絡網

上記は一例ですが各種相談窓口・役割を明示しましょう。

hirayama
hirayama

「営業が不在で誰に連絡・相談すれば良いのかわからないんだけど…」
そのようなケースが発生しないようにしましょう。

ホームページ制作に対する具体的なお見積

ホームページ制作のお見積

内容からお見積項目を確認・検討した上で最終予算を検討して頂きます。

  • 企画側が松竹梅で複数パターン提出するケース
  • 予算に合わせてお見積を作成するケース
  • 予算が決定していない場合は要件定義からまずはお見積を作成するケース

さまざまです。

企画提案内容の取捨選択、費用判断をして頂く為にも各種企画項目分かれたお見積を作成。
運営や更新費用等も付随して提出する事も与件次第であります。

hirayama
hirayama

付き合いの長いお客様だと1式で金額を伝えることはありますが、
ホームページ制作費用 1式 ○○○円 では流石にNGですね。

アペンディクス(Appendix)

いわゆる付録、オプション企画。
企画提案内容に付随し、+αとして効果的な資料パートも組み込みます。

例えば要件に関連するが、予算外のオプション提案要素として。
集客のための広告施策、SNSマーケティングを効率的に運用するための有料ツール、
多言語対応やアクセシビリティ対応など。

それもいいね!と結構刺さりますよ。

最後に

「要件に対し、ホームページで具体的にどの様な方法、設計や仕組みを用いて実現するのか?」

納得頂けるだけの企画提案書を作成し提案を行いましょう。
お客様側にとっても要件定義書作成のヒントとしてご参考頂ければと。

このコラムをSNSでシェア!

ページの先頭へ戻る

ページの先頭へ戻る

お問合せ

キャンペーン

pay-per-click