WEBDESIGNER.TOKYO
ウェブデザイナー.トーキョー

初心者・独学で勉強中の方には現場の様子は見えづらいかもしれませんが、実際にWEBデザイナーはどうやってホームページを作っていっているのでしょうか？
仕事を受注した後のWEBサイト制作の各工程をざっとまとめてみました。

勿論、これが正解ではないですし、会社組織であれば上長であるWEBディレクターの指示の元WEBデザインを進めたりするので各工程を飛ばすケースもあります。
1つの例として全体の流れや工程の参考にして頂ければと思います。

WEBサイトを作るために必要なモノの準備

WEBデザイナーになってWEBサイトを作ろう！と意欲に燃えている方も、まずは作るためのツールを用意しないと始まりません。
本当に必要最低限ですが、以下の3点があれば大丈夫でしょう。

1. ある程度スペックのある使い慣れたパソコンは持っていますか？
2. PhotoShop,Illustrator,Dreamweaver,Fireworks等の実制作に必須なソフトウェアは既に使用しているPCにインストールされていますよね？
3. 勿論、調べ物をしたり、クライアントやり取りをするためのインターネット環境も整っていますよね？

もしこれらが揃っていないようですと、残念ながらWEBサイト制作に取り掛かることは出来ません。
まずは、上記の3点を揃えるところから始めましょう。

制作会社や会社組織に入社した場合は、既にこの3点セットは当然揃っているはずですが、更に付け加えると「写真素材集」「フォント」「アイコン」等が会社の資産として使用可能であったりします。
場合によっては「使用していいソフト」等細かく定まっている場合もあります。

フリーランスや独学で勉強をされている方は、当然のことながらこれらの「素材」や「備品」を最初はすべて自分で揃えなければなりません。

実際のWEB制作の流れと工程

さて、具体的にWEB制作会社内のWEBデザイナー・フリーランスのWEBデザイナーがどういった流れで最終的に皆さんが日頃目にするWEBサイトを制作しているのかざっと下記にまとめてみました。

1. クライアントからの要望をヒアリング
2. 契約書の締結
3. スケジュール・ガントチャートの作成
4. サイトマップとワイヤーフレームの作成
5. Photoshopでデザインをしていく
6. Dreamweaverでhtmlコーディングをしていく
7. サーバーに出来上がったデータを納品・アップロードする
8. 請求書を送る

常時WEBサイトを運営していく場合は、最後の請求書を送付した後も随時修正対応が発生していくことになりますが、基本はこの8つのループと思って頂くと理解しやすいかな、と思っています。

上記の8つのループは”最低限”の工程ですので、逆に言うと何処か項目が抜け落ちていたりすると少しイレギュラーなケースと思って頂いていも良いかもしれません。
悪質なクライアントの例ですと、口約束で案件がスタートし急いで制作をしたのに次から次へと修正依頼が来て案件が完了しないと言う例もあります。

こうしたケースを避けるためにも、これら8つのループをクライアントと受注側双方で確認し、今後も案件が継続する場合は次回以降のフェイズ2にまわすと言った判断も必要になってきます。

ちなみに、これは小規模なWEBサイト制作の例ですが、大規模なWEBサイトやWEBエンジニアと連携をする場合は、6と7の間にWEBエンジニア・サーバーエンジニア等のバックエンド側の部門との連携が絡んできますし、開発に数ヶ月規模掛かる事もります。

自分自身でWEBデザインやWEBサービスを制作する場合は？

上記は一般的なWEB制作会社やフリーランスのWEBデザイナーの仕事の流れについてでしたが、では、自分自身（もしくはチーム）でWEBデザインやWEBサービス・スマホアプリを制作する場合はどうなるのでしょうか？

その場合でも下記のように、基本は上述した8つのループとほぼ変わらない流れとなるでしょう。

1. 付けたい機能・やりたい事をリストアップ
2. 外注先を使う場合は契約書の締結・仲間内の場合でもマネタイズの分配についてなど決めておく
3. スケジュール・ガントチャートの作成
4. サイトマップとワイヤーフレームの作成
5. Photoshopでデザインをしていく
6. Dreamweaverでhtmlコーディングをしていく
7. サーバーに出来上がったデータを納品・アップロードする
8. 今までに掛かった経費の精算

大きく変わる点としては、1、2、8でしょうか。
1については何も考えずに思いつくまま作業を開始する人は稀でしょう。
やはり、どういったサービスを最終的にリリースしてユーザーへ届けたいのかリストアップし、マインドマップ等を作成しておくことは非常に重要です。

また、2、8については自分一人の場合でも、チームの仲間内であっても「予算はいくらで作るのか」「マネタイズした際はどのように分配するか」を定めておかないと後々トラブルになってしまいます。

WEBサービス制作はどんなWEBデザインで作るのか？と言うWEBデザイナー的な目線以外に、どの言語で開発をするか？競合はどうやって動いているか？何ヵ月後に黒字転換するか？等々、事前に考えて行動をしておかないとならない項目が目白押しです。

ですが、アイディア一つでTwitterやYouTubeを超える可能性のあるサービスを作れるのがWEBの魅力でもあります。
先ずはWEBデザインをきちんと仕事としてやりながら、自分自身でWEBサービスの開発も取り組む事で更に楽しめると思います。

この記事のまとめ

さて、まずは8つの工程の見出しを軽くご紹介しただけですが、これからひとつずつ各項目について具体的な詳細をお伝えしていく予定です。

既にある程度WEBデザイナーについて勉強をされている方でしたら、上記の流れの中身は理解できるかと思います。
「え、本当にこれだけ！？」と思う方もいるかも知れません。
もちろん、案件により細部が異なる場合もありますが、私の個人的経験からですとおおよそこのような流れが多かったです。

では早速次回から各項目を見ていきましょう！