WBSの組み立て方

2020年7月14日（火）
ウェブディレクター協会のオンライン勉強会
「いまさら聞けない」シリーズ 第4弾

Transcript

1. WBSの組み⽴て⽅ 2020.07.14 Yuki Kaneko
2. ⾦⼦ ⼣紀 株式会社アンティー・ファクトリー ディレクター デザイナーを志し、2008年に業界⼊り。様々なジャンルのWebサイト案件を 通じて、デザインと共にディレクションをゼロから学ぶ。 その後デザイナーとしてさらに研鑚を積み、2014年からディレクターに転⾝。 好きなもの ピンク⾊（濃いめ）・猫（2匹飼ってます）・フェス（邦楽） スノボ（上⼿くない）・⼈狼（上⼿くない）・エレカシ（♡）
3. 1. WBSとは 2. なぜWBSが必要なのか 3. WBSの組み⽴て⽅ 4. まとめ Index
4. WBSとは ʁ
5. WBSとは Work Breakdown Structureの略。 プロジェクトに必要な作業を、分解して洗い出し、構造化することで 誰が⾒ても、プロジェクトのスタートからゴールまでの全体⼯程がわかるもの。
6. なぜWBSが必要なのか ʁ
7. なぜWBSが必要なのか プロジェクトに必要な作業を、抜け漏れなくすべて洗い出せる
8. プロジェクトに必要な作業を、抜け漏れなくすべて洗い出せる 作業内容がすべて出揃えば必要な⼯数を算出できるため、 精度の⾼い⾒積もりを作成できる なぜWBSが必要なのか
9. 誰が何をいつまでに対応すべきなのかが、明確になる なぜWBSが必要なのか
10. 作業に必要なリソース・期間・作業順序がわかるため、 プロジェクト完了までの詳細のスケジュールを作成できる 誰が何をいつまでに対応すべきなのかが、明確になる なぜWBSが必要なのか
11. ⽬的地（プロジェクト完了）に たどり着くためのナビ
12. そもそもナビとは ・ルートがわかる ・所要時間がわかる ・迂回ルートもわかる
13. WBSの組み⽴て⽅ ʁ
14. サンプル（項⽬マスター） 別紙
15. 項⽬の考え⽅ フェーズ 作業 ⼯程 ⼯程 ⼯程 作業 ⼯程 ⼯程 ⼯程 ⼤ 中 ⼩
16. 項⽬の考え⽅ フェーズ 作業 ⼯程 ⼯程 ⼯程 作業 ⼯程 ⼯程 ⼯程 ⼤分類→中分類→⼩分類 の順で考える ⼤ 中 ⼩
17. 項⽬の考え⽅ フェーズ 作業 ⼯程 ⼯程 ⼯程 作業 ⼯程 ⼯程 ⼯程 フェーズ 作業 ⼯程 ⼯程 ⼯程 作業 ⼯程 ⼯程 ⼯程 プロジェクト
18. ⼤分類→中分類→⼩分類 ⼤分類 プロジェクトを構成するフェーズ 要 件 定 義 設 計 素 材 準 備 取 材 撮 影 デ ザ イ ン 制 作 コ デ ン グ シ ス テ ム 実 装 検 収 ・ 公 開
19. ⼤分類→中分類→⼩分類 要 件 定 義 設 計 素 材 準 備 取 材 撮 影 デ ザ イ ン 制 作 コ デ ン グ シ ス テ ム 実 装 検 収 ・ 公 開 ⼤分類 プロジェクトを構成するフェーズ
20. 中分類 各フェーズを構成する作業内容 設計 このサイトの設計を仕上げるためには何が必要？ ⼤分類→中分類→⼩分類
21. 中分類 各フェーズを構成する作業内容 設計 このサイトの設計を仕上げるためには何が必要？ コンバージョンは？ターゲットは？サイトマップは？画⾯遷移導線は？ 画⾯構成は？CMSは何使う？どこを更新する？descriptionは？ ⼤分類→中分類→⼩分類
22. ⼩分類 作業内容をFIXさせるために必要な⼯程 ヒ ア リ ン グ た た き 台 作 成 ク ラ イ ア ン ト 提 出 お 戻 し 修 正 ク ラ イ ア ン ト 提 出 お 戻 し 微 調 整 FIX ⼤分類→中分類→⼩分類 画⾯構成
23. ⼩分類 作業内容をFIXさせるために必要な⼯程 ヒ ア リ ン グ た た き 台 作 成 ク ラ イ ア ン ト 提 出 お 戻 し 修 正 ク ラ イ ア ン ト 提 出 お 戻 し 微 調 整 FIX ⼤分類→中分類→⼩分類 メンバーに 確認 打ち合わせ 設定 メンバーに 確認 打ち合わせ 設定 画⾯構成
24. ⼩分類 作業内容をFIXさせるために必要な⼯程 ヒ ア リ ン グ た た き 台 作 成 ク ラ イ ア ン ト 提 出 お 戻 し 修 正 ク ラ イ ア ン ト 提 出 お 戻 し 微 調 整 FIX ⼤分類→中分類→⼩分類 １ページごとに、この⼯程が必要 画⾯構成
25. あらためてサンプル（項⽬マスター） 別紙
26. …こまかすぎない？ ⾒づらくない？
27. ポイント① 分類して、まとめてみよう
28. ポイント① まずはサイトマップ
29. ポイント① サイトマップが決まっていれば トップページとグローバルナビやフッタメニューが作れる まずはサイトマップ
30. ポイント① サイトマップが決まっていれば トップページとグローバルナビやフッタメニューが作れる まずはサイトマップ システム組み込むから、フォームは先に決めてしまおう
31. ポイント① サイトマップが決まっていれば トップページとグローバルナビやフッタメニューが作れる まずはサイトマップ システム組み込むから、フォームは先に決めてしまおう けっこうコンテンツ量が多くなりそうなページたちだな
32. ポイント① サイトマップが決まっていれば トップページとグローバルナビやフッタメニューが作れる まずはサイトマップ システム組み込むから、フォームは先に決めてしまおう けっこうコンテンツ量が多くなりそうなページたちだな ある程度パーツルールが決まってきてるはずだから、 あとはルールに合わせて原稿流し込むだけでいけそうだ
33. ポイント② ⼯程を横のライン上に載せてみよう
34. ポイント② ページ数やタスクが少なければ、⼯程を縦に積むことが多い
35. ポイント② ⼯程を横に載せると、タイムラインがスッキリし、⼤量のタスクも管理しやすい
36. …でも、正直 ⾯倒くさくない？
37. よくある現象① いつもプロジェクトの後半（コーディング/実装）に バタバタしていた
38. ・ねえ、サーバー情報は？ よくある現象①
39. ・ねえ、サーバー情報は？ ・え。これはデータベース使えないんだけど！ よくある現象①
40. ・ねえ、サーバー情報は？ ・え。これはデータベース使えないんだけど！ ・Analyticsのタグどうするの？ よくある現象①
41. ・ねえ、サーバー情報は？ ・え。これはデータベース使えないんだけど！ ・Analyticsのタグどうするの？ ・APIキーもらわなきゃ無理だよこのデザイン よくある現象①
42. ・ねえ、サーバー情報は？ ・え。これはデータベース使えないんだけど！ ・Analyticsのタグどうするの？ ・APIキーもらわなきゃ無理だよこのデザイン ・画⾯縮めたときの挙動ってどうなるの？ よくある現象①
43. ・ねえ、サーバー情報は？ ・え。これはデータベース使えないんだけど！ ・Analyticsのタグどうするの？ ・APIキーもらわなきゃ無理だよこのデザイン ・画⾯縮めたときの挙動ってどうなるの？ ・OGP画像？何も⾔われてないから設定してないけど？ よくある現象①
44. だったら、よく⾔われること＝忘れがちなタスクを 全部書いておこう 納期も迫る中 その対応のほうが⾯倒くさい！
45. よくある現象② 作業までは分解できてるはずなのに 進め⽅が流動的になってしまう
46. よくある現象② ・FIXしたのに、修正⼊る
47. よくある現象② ・FIXしたのに、修正⼊る ・この作業、必要なかったな…
48. よくある現象② ・FIXしたのに、修正⼊る ・この作業、必要なかったな… ・⽀給素材が来ない。もう納期遅らせるしかない…
49. よくある現象② ・FIXしたのに、修正⼊る ・この作業、必要なかったな… ・⽀給素材が来ない。もう納期遅らせるしかない… ・ここを直したってことは、あっちもこっちも直さなきゃ。 もうまるっと仕切り直さなきゃ、わからないぞ…！？
50. ⼯程をこまかく出しておいたほうが トラブルが起きた時に影響範囲を最⼩限に留められる ただでさえ、思い通りにいかないことばかりなのに いちいち振り回されるほうが⾯倒くさい！
51. まとめ ʁ
52. プロジェクトを 正しくナビゲートする役割 WBSとは 経由地（フェーズ）やルート（作業）だけじゃなく 道順（⼯程）まで⽰す 道順がわかっていれば、渋滞も予測できるし、 事故った時の迂回路を⾒つけやすい
53. 作業を最⼩単位＝⼯程まで 明確にしておく
54. Thank you