Embed Size (px)
Citation preview
Web業界ってどうよ？
０ディレ for Students Webディレクター編WebディレクターとしてIT業界で生きる
講師 自己紹介合志建彦（ごうし たけひこ）
株式会社 デジミホ 所属
Webマーケティング企業のWebディレクター
ECサイト、メーカーサイトなど複数案件を同時進行で担当
経歴
新卒でケーキ屋に入社
結婚を機に寿退社 ← MJD！
主に受託開発のWebデザイナー、ディレクターとして
複数のデザイン会社、Web制作会社を経験
所属企業について
株式会社 デジミホ
こんなもの作ってきました
様々な商品ブランドサイト 企業の採用サイト ECサイトなどの受託制作を行ってきました
あと ケーキとか
今年のホワイトデー
２．１４ 来年お待ちしております
先にお伝えしておきます
本日のスライドの内容は
後日ディレ協学生部のfacebookグループ上で共有します
※著作権上または企業機密上公開できない内容は
共有時にはナイショにします
なんでこの業界にはいったのか？
PCワークってなんかかっこよくねぇ？
↓今からやるならインターネットらしい
↓HTMLと絵がかけりゃWebが作れるらしい
↓おベンキョしてみた（デジハリ）
↓
ハマった！
HTML！Photoshop！Flash！
キタコレ！
おもしれ～～～
(*´Д`)ﾊｧﾊｧ
Web業界にいる人種
● デザイナー● コーダー● システムエンジニア● プログラマー● テスター
デザイナーとプログラマーだけじゃないよ
● プロジェクトマネージャー● ディレクター● プランナー● インフォメーションアーキテクチャー
Webサイトの制作フロー
設計 制作 検証 運用
企画
情報設計
デザイン
コーディング
システム構築
検証
バグ対応
情報更新
メンテナンス
分析・PDCA運用
Webサイトの制作フローと職種
設計 制作 検証 運用
プランナー
インフォメーションアーキテクチャー
デザイナー・コーダー
SE・プログラマー
テスター
コーダー
デザイナー
コーダー
プログラマー ｅtc
ビビっときた？
このサイトのデザインかっけー！自分も描きたい
→Webデザイナーどう？
これってどうやって作ってんの？動かしてみたい
→プログラマーどう？
→コーダーどう？
彼らだけじゃサイトはできない！
どんなにクリエイティビティなデザイナーがいても
どんなにプロフェッショナルなプログラマーがいても
バラバラに動いてしまってはサイトは作れない
サイト制作を取りまとめる役割が必要
その役割が“Webディレクター”
Weｂ制作には“ディレクター”という
ポジションがある
野球やサッカーには監督がいないと選手が機能しない
建築現場には現場監督がいないと大工が働けない
Web制作にはWebディレクターが必要
Webサイトの制作フロー
設計 制作 検証 運用
進行管理・品質管理
プランナー
インフォメーションアーキテクチャー
デザイナー・コーダー
SE・プログラマー
テスター
コーダー
Webディレクター
Webディレクターってなにするの？
デザインはしません
プログラムも組みません
コーディングもしません
えっ？
じゃなにするの？
プロジェクトを成功に導く！
クライアント（お客様）の要望からプロジェクトのゴールを設定し
チーム（クライアント含む）にその目的を説明し理解させ
ゴールまでのイメージを共有してチームを導く！
つまり、、、、、
Web制作における司令塔
ちょっとこの方はハードルが高い？じゃあ、、、
俺は持ってる
某サッカー日本代表選手
「勇者」である
某国民的RPGの勇者様
なぜWebディレクターが勇者なのか？
・勇者は戦士ほど力は強くない
・勇者は魔法使いのような強い魔法は使えない
・勇者は僧侶のように体力を回復させられない
・勇者はあそびにんのように遊べない
専門分野においては専門家にはかなわない
ならば“Webディレクター＝勇者”はどこで生きるのか？
“Webディレクター” “勇者”
某深夜枠の勇者ヨ◯ヒコ
ならば“Webディレクター＝勇者”はどこで生きるのか？
ゴール（企画）を設定する ＝ 世界に平和を！
費用を積算する（出資） ＝ 王様に資金とひのきのぼうをもらう
メンバーをアサインする ＝ ルイーダの酒場へ
情報を集めて整理する ＝ お城や村で情報収集
プロジェクトを段取る ＝ 次に行く町やダンジョンを決める
ゴールへ導く ＝ 魔王を倒す！
“Webディレクター” “勇者”
ディレクション能力の活用 サークル飲み会の幹事編
ゴール（企画）を設定する ＝ 大会へ向けて一致団結する
費用を積算する（出資） ＝ 飲み会の予算を検討
メンバーをアサインする ＝ 日程と参加者ぎめ
情報を集めて整理する ＝ 店の雰囲気とか参加者の好みとか
プロジェクトを段取る ＝ メニュー・出し物・あいさつ役決める
ゴールへ導く ＝ One for All All for One !!
“Webディレクター” “飲み会の幹事”
ディレクション能力の活用 告白♥
ゴール（企画）を設定する ＝ 告白してO.K.をもらう
費用を積算する（出資） ＝ デート費 プレゼント費⇒バイトだ！
メンバーをアサインする ＝ 男なら自分で直接！
情報を集めて整理する ＝ 彼女の好みとか流行りのお店とか
プロジェクトを段取る ＝ デートプラン！ 雰囲気は大事だぞ！
ゴールへ導く ＝ 「よろしくお願いします！」
“Webディレクター” “Boy meets Girl”
実際にどんな仕事をするの？
● 課題のヒアリング
● 企画立案
● プレゼンテーション
● 制作進行管理
● 品質管理
● クライアントとの打ち合わせ
などなど
Webディレクターに必要な能力
● ヒアリング能力● コミュニケーション能力● 企画立案能力● 段取り力● プレゼン力
ホントにいろいろありますが、、、、
● コーディング知識● デザイン知識● 流行の把握● デバイス知識● プログラム知識● サーバまわりの知識
ディレクション能力はディレクターだけのものじゃない
プランナー、デザイナー、
コーダー、SE、プログラマー
みんながディレクションのスキル、意識を持っていれば、どんなプロジェクトも もっとスムーズに進行する
はず
ディレクションスキルを身につければ
どんなポジションでも、
どの会社にいても、
すべてのビジネスにおいて
重要で重宝される
つまり、年収アップにつながる！
このあとはワークショップの説明
ここまででいったん
Webディレクターについての説明は終わります
Web制作フローやWebディレクターについて
質問があればどうぞ
今日のワークショップについて
進行管理に必要な
WBSをつくってみよう
今日体験するのは「進行管理」の部分
設計 制作 検証 運用
進行管理・品質管理
Webディレクター
進行管理のためにプロジェクト開始前にすること
段取り↓
アサイン↓
スケジュール
進行管理に必要な3つの事前ステップ
段取り：目的に必要な作業の洗い出し
↓アサイン：その作業を依頼する人を決める
↓スケジュール：必要な日数を引く
段取りってなんだ？
スケジュール ≠ 段取り
１つ１つの作業を
だれが・どういう順番で・どれだけの期間必要かを検討して
プロジェクトのスタートから完成までの予定をたてる
段取りと誰がやるかを決めないと、スケジュールは決まらない
スケジュールの作成と管理
単なるスケジュールでは進行の管理はできない
プロジェクトの進行に必要な工程を洗い出し、
その進捗を管理するために必要なのが、、、
WBS です。
この後ワークショップです
グループわけと
自己紹介
休憩・・・
ここで15分間の休憩です休憩の後はグループワークです
今日のワークショップ
「プロジェクトのWBSをつくる」
WBSとは・・・Work Breakdown Structure の略
プロジェクト管理の計画手法の一つ。プロジェクトをワークパッケージという個々の作業要素に分割し、階層的な構造に配して管理する手法。またはその資料のことを指す。
サンプル
テンプレート
https://drive.google.com/file/d/0B0FJbQpNgYP-cW9iXzg5dktheFU/edit?usp=sharing
WBSがなぜ必要か？
WBSとは、ゴールまでにどういう手順が
必要かを漏れ無く明確にし、その１つ１つの手順を
「だれが・どういう順番で・どれだけの期間必要か」を見える化し、プロジェクトメンバーで共有するためのツール
つまり、、、
WBSがあることで進行具合が把握できる
WBSとはプロジェクトの開始前につくる
「完成までのロードマップ」
WBSと現状を照らし合わせることで、
いま、だれが、なにを進めている、はずかが
把握できるので、プロジェクトの進捗が確認できる
WBSをつくる手順
1.必要な工程を作業レベルに分解する
↓2.それぞれの作業を実行できる人を割り当てる
↓3.作業に必要な日数を割り振る
WBSをつくるプロジェクトのお題
「10名の学生団体が告知サイトと新歓時期に新入生向けのビラを
配布することで100人の学生をイベントに集める」
「3校の広告研究会が1校20人ずつ集まって、
それぞれが活動内容を発表するイベント」
「3つの校舎に分かれている軽音楽サークル1校舎20人ずつの団体が、
合同で行う花見兼新入生歓迎イベント」
「所属する野球部の50周年イベントの企画運営
現役・OBを問わず一同に集めて開くパーティー」
プロジェクトを作る際の条件
● 企画・運営を任されているチームである
● 予算については会計に確認するフローが必要
● 最終的な企画案は代表が決定権を持つ
STEP1 作業分解
作業分解とは？
例：プロジェクト「ゆでたまごを食べる」
たまごを冷蔵庫から出す
鍋に水をはる
たまごを鍋に入れる
コンロに火をつける
必要な時間待つ
鍋からたまごを取り出して冷やす
たまごのカラを割る
塩をかける 食べる
１．作業分解
必要な作業工程を分解する
１．各自で与えられた課題に必要な作業分解
（１5分）
２．各自が分解した工程をグループで共有し
グループで１つの工程一覧表をつくる
（３０分）
１．作業分解
各自で必要な作業工程を洗い出してみる
＜ポイント＞
・モレなく、ダブりなく
・作業の粒度を一定にすること例：（１）たまごを冷蔵庫から出す→鍋に水をはる
（２）冷蔵庫の扉を開ける→たまごをとり出す
→鍋を取る→蛇口をひねる→鍋に水を満たす
１．作業分解
テンプレート
https://drive.google.com/file/d/0B0FJbQpNgYP-cW9iXzg5dktheFU/edit?usp=sharing
最初の工程は手書きで書き出してもO.K.最終的にこのテンプレートに記載した結果を
グループで1つにまとめて発表
１．作業分解
各自で必要な作業工程を洗い出してみる
15分まってやる！
某空中浮遊王国の末裔ム◯カ大佐
プロジェクトを作る際の条件
● 企画・運営を任されているチームである
● 予算については会計に確認するフローが必要
● 最終的な企画案は代表が決定権を持つ
ーーこの条件により発生する工程があるはずーー
１．作業分解 つづき
各自が出した工程をグループで共有する
自分一人では気づかなかった作業項目を、
他の人の意見と合わせて
「もれなく」「だぶりなく」していく
１．作業分解 つづき
＜手順＞
テンプレート上の大きな工程に大項目を記載
↓項目ごとに、分けたタスクを工程順に上から記載する（なるべくでよい）
※必要に応じて欄は追加してください
１．作業分解
各グループでテンプレートに工程を記載
グループ内のみんなの意見を集約して、
「もれなく」「だぶりなく」していく
大事なことなのでもう一度言います
「もれなく」「だぶりなく」
１．作業分解
グループで1つの作業工程にまとめる
あと
30分まってやる！
某空中浮遊王国の末裔ム◯カ大佐
STEP2 アサイン
２．アサイン
洗いだした工程を進めることのできる担当ぎめ
＜手順＞
分解された作業1つ1つにバイネームで担当を決める※実際に企画を進行するつもりで決める。同時に進行できない
複数のタスクを一人にアサインしないように注意
STEP3 スケジュール
３．スケジュール
工程ごとにいつまでに行うべきかの線を引く
＜ポイント＞
１．締め切りから（後ろから）線を引く
一番最後の工程はなにか？
２．各自が出した工程をグループで共有し
グループで１つの工程一覧表をつくる
３．スケジュール
今日は日数は気にせず、
工程の前後関係
つまりAを決めないとBが始まらない、を
意識することが大切
３．スケジュール
手順を重視してスケジュールを引いてみよう
３０分で支度しな！
某海賊一家の女船長◯ーラ
休憩・・・
ここで15分間の休憩です休憩の後は発表です
今日やったのはWBSの作成
やってみてどう思った？
難しい？ わからない？
一人で抱え込むと正確性も欠け
行き詰まりやすい
WBSをつくるということは、、、
頭のなかで一度プロジェクトを
つくり上げるということ
経験と知識が必要
でも今日やったようにチームでやれば
おぎないあえる
WEBディレクターの仕事おさらい
● 課題のヒアリング
● 企画立案
● プレゼンテーション
● 制作進行管理
● 品質管理
● クライアントとの打ち合わせ
などなど
WEBディレクターに必要な能力
● コミュニケーション能力
● 調整力
● 想像力
ホントにいろいろありますが、つまるところ、、、
これらの能力はディレクターだけのものじゃない
どんなポジションでも、
どの会社にいても、
すべてのビジネスにおいて
重要で重宝されるスキル
このスキルを一言で言うと
プロジェクトを作り出し成功に導く！
プロジェクトの企画をつくりゴールを設定し、
その目的をメンバー（クライアント含む）に理解・浸透させて
プロジェクトを進行・完成へ導き、双方に利益を生み出す
それが ディレクションスキル
求む勇者！
WEBディレクターこそWEB制作の主役である
