Webディレクター

Webディレクターのサイト制作の進め方と具体的にやること

2020年12月9日

 

悩む人
Webディレクターが、どんな流れでサイト制作を進めているのかを知りたいな...。また、各工程でやることや作業内容も知りたい

 

こんな悩みに答えます。

 

こんな方におすすめ

  • サイト制作の流れを知りたい方
  • 新人ディレクターになって、サイトの制作の流れを理解したい方
  • ディレクターがどんな流れでサイト制作を進めているのか知りたい方

 

Webディレクターがどんな流れでプロジェクトを進めていて、サイト公開をしているのか疑問に思うと思います。

 

当ブログを書いている僕も新人でディレクターとして入社しましたが、先輩たちがクライアントのサイトを公開するまでに、どんなことをしているのか正直よくわかりませんでした。

 

なので、今回は、サイトが公開されるまでにディレクターがやることや進め方について、自分の頭の整理も込めて記事にしてみます。

 

※制作会社によって、制作フローが異なる場合もありますので、ご了承ください。

 

なお、以下記事でサイト制作ができるまでの流れをまとめた記事を紹介していますので、こちらも合わせて参考にしてみてください。

 

関連記事
【Webサイトの制作の流れ】ホームページができるまでの手順を解説します【家に例に考えると分かりやすい】
【10分で理解!】Webサイトの制作の流れを徹底的に解説

  悩む人 webサイトができるまでに、どういう流れでできるのか、どれくらいの期間でできるのかを知りたい!   こんな悩みに答えます   こんな方におすすめ webサイト ...

続きを見る

 

前置きが長くなりましたが、早速始めていきます。

 

 

Webディレクターのサイト制作の進め方の流れ

Webディレクターのサイト制作の進め方の流れ

 

サイト制作の流れについて、大まかに以下の流れで進めます。

  • ①受注まで
  • ②制作フェーズ
  • ③公開準備

 

各フェーズ毎にwebディレクターがやることがありますので、詳しく解説していきます。

 

①:受注まで

①:受注まで

 

まず、webディレクターは、クライアント(発注者側)からサイト制作の依頼を受けます。

 

クライアントからサイトのリニューアルを検討してましてサイトのリニューアルをお願いしたいです〜といった感じで、連絡を頂きスタートします。

 

ディレクターがクライアントから相談を受けてまずやることが以下です。

 

  • リニューアルの依頼を受けオリエンテーションをする
  • 依頼内容をもとに提案書を作成してプレゼンテーションをする
  • 提案が通れば契約締結

 

1つずつ順番に解説していきます。

 

ステップ①:
リニューアルの依頼を受けオリエンテーションをする

 

まず、発注者(クライアント)が、サイトのリニューアル目的をまとめた提案資料を用意し、オリエンテーションに参加します。

 

webディレクターは、クライアントにヒアリングする質問事項をフォーマットか何かにメモして用意します。

 

制作会社によって、質問する事項は異なると思いますが、具体的に以下について質問します。

 

  • 与件整理
  • 現状分析と現状把握、仕上げ

 

1つずつ解説します。

 

与件整理

 

クライアントへ質問事項を用意するために、Webディレクターは、現状サイトで分かっていることを整理します。

 

クライアントへ質問する内容をまとめ整理するのに、「コンテンツストラテジー」が役立ちます。

 

コンテンツストラテジーとは、CMSブログサービスなど情報を発信する様々な手法がある中で「ビジネスに寄与するコンテンツを戦略的に考える」ための方法です。

コンテンツを作ることや発信することが目的になってしまいがちですが、やるべきことを見失ってしまわないよう、そもそもの目的やターゲットを確認できるようにしておく必要があります。

引用:ferret「コンテンツストラテジー」とは何か?

ちなみに、コンテンツストラテジーブリーフについては、コンセントラボさんが用意されているフォーマットが参考になります!

 

» Contents Strategy Brief(コンテンツストラテジーブリーフ)

※クリック後に外部サイトへ飛びます

 

このテンプレートに記載されている項目から、現状分かっていることを出来るだけ記載していきます。

 

調べても分からず埋められない項目は、オリエンテーションで直接聞く感じです。

 

現状分析と現状把握、仕上げ

 

その他にもWebサイトの「動作環境、制作の条件」についての情報の有無なども聞くことがあれば、洗い出しをしていきます。

 

  • サーバーの構成(共用サーバー?専用サーバー?)
  • サイト内のタイトル、metaのルール
  • FTP接続情報
  • 関連するシステム
  • ディレクトリ、ファイル名のルール
  • JSなど外部ファイルの仕様状況

 

他にもありますが、現状で分析や把握できることがあれば、ヒアリング前にメモしておきます。

 

ステップ②:
提案書を作成してプレゼンテーションをする

 

オリエンテーションが終わり、サイトの改修についてヒアリング後は提案資料を作成していきます。

 

提案資料を作成するにあたり、webディレクターがやることは主に以下です。

 

  • 保守条件の検討
  • サイト作成の予算
  • デザインコンセプト検討
  • 提案の範囲を取りまとめる
  • 納期までのスケジュール作成
  • ヒアリングの内容を元に与件整理
  • 社内リソースの確保・開発体制を整える

 

ヒアリングした内容は、資料作成ではパワーポイントなどの文章ソフトを用いて作成します。

 

もし、本質的な改修目的など、重要なことを聞き逃した場合は、事後にクライアントに電話などで確認することもあります。(本当はヒアリング時に聞けたらいいのですが...)

 

ステップ③:
提案が通れば契約締結

 

提案書を作成して、クライアントからの連絡を待ちます。

 

ディレクターは、クライアントからの回答が期日までになかったり、遅くなっていれば、連絡をとって提案の結果について聞きます。

 

ここで提案した内容が通りましたら、契約締結となり本格的にプロジェクトのスタートです!

 

②:制作フェーズ

②:制作フェーズ

 

発注者(クライアント)との契約締結ができましたら、本格的に制作をスタートしていきます。

 

実際に、制作フェーズが始まると一気にWebディレクターのやる仕事が増えていきますよ。

 

具体的に以下の作業をやります!

 

  • 要件定義を作成
  • WF作成
  • デザイン・コーディング制作の管理(スケジュール管理や品質チェック)

 

1つずつ、順番に解説していきます。

 

要件定義を作成

 

提案でも大枠の要件定義を作成しましたが、契約締結後により詳細な要件定義を作成する必要があります。

 

開発する成果物の範囲を具体的に決める感じです。

 

詳細な要件定義を作成するためには、具体的に以下を決めていきます。

 

  • スコープ計画:やる作業範囲を洗い出す
  • 詳細見積もり:アサインするメンバーの工数、所要時間から見積もりを算出
  • 詳細スケジュール作成:各メンバーの工数、開始・終了の期日を計画
  • コミュニケーション計画:クライアントとの連絡手段の決定

 

提案では、上記概算として出していたものを、契約締結後に具体的に決めて作成します。

 

また、システム要件、機能要件なども盛り込みますよ!

 

システム開発に関する要件定義書(要求仕様書)のテンプレート

 

要件定義は、その後の工程に影響しないために、とにかく具体的に作業範囲を明確化していきます。

 

WF作成

 

詳細な要件定義ができれば、『WF → デザイン コーディング』の順番で制作します。

 

ディレクターは、WFを作成しクライアントとの同意をとります。OKをもらえれば、次で紹介するデザイナーやコーダーへの制作指示を出します。

 

また、WF(ワイヤーフレーム)は、2、3人(またはそれ以上)で分担して制作します!

 

ワイヤフレームについては、以下記事で詳しく紹介していますので、参考にしてみてください!

 

関連記事
Web制作に必要なワイヤーフレームとは?【作成する際の6つのポイント】

  悩む人 Webサイト制作に必要なWF(ワイヤーフレーム)って何...?作るポイントを理解しておきたい   こんな悩みに答えようと思います   記事の内容 WF(ワーヤ ...

続きを見る

 

デザイン・コーディング制作の管理(スケジュール管理や品質チェック)

 

ワイヤーフレームで、クライアントとの合意が取れればデザインコーディングをしていきます。

 

ここでやるディレクターの主な仕事は、先述した通りデザイナー、コーダーへの作業依頼です。

 

また、デザイナー、コーダーが作成した成果物に対しての品質チェックや修正指示、全体の進行管理をします。

 

③:公開準備

③:公開準備

 

ここまできましたら、サイト公開の準備を進めます。

 

公開するために、以下のステップで進めます。

 

  • テスト・移行
  • 公開
  • 検証

 

1つずつ解説していきます。

 

テスト・移行

 

開発環境でのテストを行います。

 

チェックの仕方として、要件を満たしているか?問題なく稼働するか?など実際にサイトを使って、検証をします。

 

サイトのチェックは、webサイト制作メンバー、システム担当、プロジェクトマネージャーが行い、問題なければクライアント(発注者)に連絡する感じです。

 

発注者の承認が取れればサイトの公開準備です!

 

ディレクターが発注者に連絡する際には、どういった視点でチェックを行い、不具合の検証をしてもらうかと細かく伝えると、公開後のトラブルなく公開準備ができます。

 

公開

 

サイト公開には、制作したwebサイトのファイル一式を「開発環境 → 本番環境」にアップロードする必要があります。

 

ディレクターは、コーダーに本番環境のアップ依頼をします!
KEI

 

ちなみに、公開後もバグや表示崩れがないかなど、ディレクターは細かくチェックします。

 

クライアントにも確認をしてもらい承諾を得られれば、ディレクターは作成したファイル納品ファイル一式をまとめます。

 

発注者による検収を経て検収書を受領することで、『プロジェクトの終結』になります。

 

これでプロジェクトの完了です!
KEI

 

まとめ:Webディレクターのサイト制作の進め方

まとめ:Webディレクターのサイト制作の進め方

 

いかがでしたか?

今回は、Webディレクターがサイト公開までにやること、進め方について、紹介しました。

 

Webディレクターの仕事は、サイト制作前の要件決めから公開まで幅広くプロジェクトに参画することができますので、やりがいのある仕事でもあります!

 

ただ、クライアントや色んな部署の人とコミュニケーションをするので、プロジェクトが終わると正直かなり疲れます...。(僕だけかもしれませんが...)

 

無理せずほどほどにプロジェクトを進められたらな〜と勝手に思っています。

 

もし本記事を読み、webディレクターのサイト制作の進め方について、少しでも理解できましたら幸いです。

 

今回は以上です。

 

ここまで読んでいただき、ありがとうございました!

 

  • この記事を書いた人

keiblog

当ブログは、『シンプルで見やすい記事を発信!』をモットーに「ブログ・WordPress」などWebに関する役立つ情報を発信していきます。【経歴】▶︎Webディレクター就職(歴8年)(コーディング・SEOが好きです!)▶︎ブログ開設

-Webディレクター