Webディレクター

Webディレクターが作成する重要ドキュメント5選

今回はWebディレクターが作成するドキュメントの中で特に重要だと思っている5つについて、作成する目的と、どのような情報が盛り込まれているのが好ましいかを順に解説していきたいと思います。

業務フロー図

まずは業務フロー図からです。
業務フロー図はなぜ作成する必要があるかと言うと、そのシステムを作った時に、誰がどのタイミングでどのように運営されるかを可視化して整理するためです。

例えば、会社情報を説明するコーポレートサイトは、一度作成してしまった後はそんなに更新頻度がなく、手をかける必要がないのですが、ブログ、ECサイト、マッチングサービスなどといったいわゆる「システム開発」が必要なものについては、「ユーザー登録」や「ブログ記事投稿」などといった、システムのデータベースが操作して変更されていくものになります。

上記を考えた時に、誰がいつどのデータを登録し、誰がいつどのデータを参照するか、などといった業務フローが正しく描けていないと、「他社のサービスが作っているから」といった不明瞭な理由で、余計な機能を増やしてしまう事になってしまいます。

1つ1つの機能に対して、本当にこのタイミングでこのデータを参照する必要があるか?ユーザーにはどのような導線でシステムを触って欲しいのか?といったような事を深掘りして考えるようにしましょう。

ER図

2つ目に重要だと思っているのはER図です。
ER図はエンジニアが作成するイメージが強いと思うのですが、ディレクターが作成するER図はあくまでどのモデルにどのモデルが紐づく、であったり、モデル毎の関係性を整理するために作成します。

ディレクターになりたての頃はこのER図に対してあまり意識を向けていなかったのですが、複雑なサービスを展開する時や、toC,toB,adminと操作するサービスが複数に渡る時に、各モデルの関係性が整理されていると非常に議論がしやすくなります。
各モデルで扱う項目などはワイヤーやデザイン段階で決めても良いと思いますが、モデルの数と関係性は早い段階で固められるようにしておくのが良いです。

ワイヤー

3つ目に重要なのはワイヤーです。
ここでは1つ目で紹介した業務フローが満たせており、かつ業務フローがイメージ出来るようなワイヤーを作成する必要がございます。
デザイナーがデザインしてから要件を変更するには時間と手戻りが大きくなり過ぎるので、要件や機能をディスカッションするに必要なシンプルなワイヤーを作成出来るようにしましょう。

主に入力画面はフォームと登録ボタンが表示されていたり、参照画面では必要な情報がカードの一覧になっているような情報があればよく、色を加えたりデザインを凝ってしまうと論点がズレてしまうので、シンプルな構成にする事を心がけましょう。

URL一覧

4つめにURL一覧を上げさせて頂きます。

URL一覧は2番目のワイヤーの画面数と一致する事になるのですが、ワイヤーが2,30を超えてしまうと、網羅的に把握するのが難しく、開発の見積を取る時に不向きです。
ワイヤーを網羅的にリスト化した上で、各画面の開発工数を見積れるように作成出来るのが望ましいです。

例えばブログ詳細画面など各情報に対して

仕様書

ガントチャート