【web制作の流れ】案件受注から納品までの制作フロー

※記事内に広告を含みます。

こんにちは、まいです。

勉強したけど案件受けるの怖い!
流れがイメージできたらいいのに!

って方に向けてweb制作の受注から納品までの流れ(制作フロー)を書いていきます。

Web制作会社のリモートワークで
Webディレクションとして働いていました。

クライアントとのやり取りは実践で経験をつみ、

フリーランスではなできない範囲も経験させてもらえました^^

フリーランスの場合はまずクラウドソーシングから
案件を受注しますが、
クラウドソーシング側で代行されるので
全部やる必要はありません。

クラウドソーシング外で受注することになったら
ミスらないよう流れを書いていきます。

目次でだいたいの流れがわかります↓

[toc]

お問い合わせ受信→大まかに制作物確認

まず、お問い合わせがきます。

自社サイトからなのか、SNSのDMからなのか、
ざっくりと何を作りたいのかを聞きます。

お問い合わせを受ける方法は

この記事で書きましたが、
クラウドソーシングの自己紹介ページから
お問い合わせを受け付ける方法がおすすめ。

打ち合わせの事前準備

詳細の打ち合わせをするために
予めざっくりと聞いておきましょう。

LPなのか、複数ページなのか。
打ち合わせまでに参考デザインとなる
Webサイトを選んでおいてもらうなど、

クライアントから欲しい情報をもらうのに
時間がかかりそうなものは集めておいてもらうといいですね。

制作案件の詳細を打ち合わせ

打ち合わせの方法としては

  • クライアント先に訪問
  • ZOOMなどビデオ通話を使ってオンラインで打ち合わせを
  • メールやチャットでテキストベースの打ち合わせ

制作に必要なヒアリング事項を聞いていきます。

大まかなに何を作りたいのか、制作物の内容によって異なりますが、
共通して聞くことはこの辺り。

✔️制作の目的→目的によってコンバージョンがかわる

✔️素材(画像・テキスト)の確認→提供ありか購入するかなど

✔️ドメインとサーバー契約の有無

などなど…

見積もり作成+スケジュール共有

ヒアリング・打ち合わせしたことを元に見積書を作っていきます。

※見積もりの作成方法も別ブログで書きます!

注意点

追加請求が発生しそうな場合は先に伝えておきましょう

例えば、画像を購入することになった場合。

クライアントさんは詳しくない方もいます。

当たり前に画像の購入は
見積もりに含まれていると思われていたりします。

トラブルやクレームになりそうなところは事前に伝えておきましょう。

見積もりと同じタイミングで納品スケジュールも一緒に共有しておくといいです。

契約・着手金の請求書発行

契約はクライアントによる

契約書の作成は、コーディングのみやデザインのみの場合でも
汎用がきく内容で作っておくと使い回しができます。

オンラインだと、クラウドサインを使えば月5件まで利用できるので
最初のうちはこれで十分ですね。

お互い信頼しきっていて契約書の作成はスルーすることも。

できたら契約書は作成したほうがいいです。

着手金は50%

制作している途中でクライアントから必要なくなったと
キャンセルの申し出があったりします。

着手金50%さえ入金してもらっていればいいですが、
もし0円だと、、、

納品前に終了してしまったことが一度ありますので
着手金は必須でもらいましょう。

ワイヤーフレーム作成

契約が終わり、着手金の入金を確認できたら制作に進みます。

デザインから制作する場合はワイヤーフレームを作成します。

※ワイヤーフレームも、大量に作ってきたので、、、後日ブログにする!

ワイヤーフレームを作ったら確認してもらいますが、

トップビューのイメージ確認、
セクション説明、ページ説明、置く画像の説明、
コンバージョンの位置などなど、、、

一通り説明しますが、
web制作に詳しくないクライアントさんだと
「それでいいよ!」と言われることが多いです。。。笑

トップビューを見せて全体的なイメージを確認

ワイヤーフレームと一緒に
トップビューを作ってイメージに相違がないか
確認をとるのがポイントです!

トップビューでデザインの方向性が変わってきますので、
全デザインを作り込んでしまう前に確認をとりましょう!

イメージ違いで何パターンが作ってあげると親切ですよね!

デザイン

ようやくデザイン制作に取りかかります。

私はコーダーよりだったので、
デザインはデザイナーさんに外注します。

実はワイヤーフレーム制作までは
Webディレクターさんの仕事だったりします。

デザインにとりかかるまでやることがたくさんなので、、、
一人でやると仕事が増えて大変です。。。

デザイン確認

デザインは打ち合わせの時に
修正回数は2回まで、などと修正回数は決めておきましょう。

デザインの後戻りを防ぐために
ヒアリングと打ち合わせは本当に大切です。

OKをもらえたらコーディングへと進みます。

コーディング

いよいよコーディングです。

コーディングはデザイン通りに制作すれば
デザインほど修正が発生することはほぼありません。

提出前の確認事項としては
リンクが飛べなかったり、
画像が表示されなかったり、
一通り確認しましょう。

※提出前のコーディングチェック一覧もブログにまとめたい!

コーディング確認(表示や動作)

チェックしてもらうところとしては、
動き(画像・テキスト・ボタンなど)を特に見てもらいます。

最後の最後で「デザインここを変えて!」と要望されることは、、、
Web制作あるあるかも。笑

パパッと変えられるところなら追加料金なしでぜんぜん変えます!笑

公開→最終確認

指定サーバーに指定のドメインで公開したら最終確認をしてもらいましょう。

✔️各ブラウザ

✔️パソコン・タブレット・スマホ

崩れがないかの確認は要チェックです!

問題なかったらサーバーアップで納品完了となります!

※サーバーアップ方法もブログ書く!

請求書作成

最後に残りの50%の請求書を作成、送付し
これにてお仕事完了です!

おつかれさまでしたー!

クラウドソーシングは納品したら
支払い管理はクラウドソーシング側が代行してくれます。

おまけ:アフターフォロー

Web制作は更新作業や保守作業など、
作って終わり、という訳ではありません。

納品から数ヶ月後に「更新もやって欲しい!」
と連絡が来たりします。

〇〇作業は△△円です!

よかったら連絡ください!

と伝えておくと検討してもらえますし、
更新作業だけでも繋がっておくと今後のお仕事をもらえることも
あるのでアフターフォローはきちんとしておくといいです!