SlideShare uma empresa Scribd logo
1 de 43
Baixar para ler offline
0からのウェブディレクション講座
制作・開発編
V02.01
日本ディレクション協会
自己紹介
小嶋裕亮
ウェブ制作をやるようになって6年。
企業向けのクライアントワークを中心に制作を
行ってきた。
オペレータ、デザイナー、エンジニアを経て、現
在フリーランスのディレクター。
所属:日本ディレクション協会
講師について
0
1
2
3
4
マーケティング
プロデュース
プランニング
クリエイティブ
システム
オペレーション
ショッピングセンター ウェブマガジン
ウェブメディア
EC系 コーポレートサイト
ブランドサイト ランディングページ
講師の構成比
制作・開発編
0からのウェブディレクション
扱う範囲
設計→開発→運用
扱う範囲
設計→開発→運用
ディレクションとはなにか?
コミュニケーション構築
以上。
やっていること
• ワイヤーを切る
• 電話連絡
• メール書く
やっていること?
• ワイヤーを切ればディレクション?
• 電話連絡がディレクション?
• メール書くのがディレクション?
果たす役割で考えてみよう
果たすべき役割
• 計画に基づいて
• 成果が出る仕組みを作る
果たすべき役割
• 計画に基づいて
• 成果が出る仕組みを作る
コミュニケーションで実現
関わる人
デザイナー
イラスト
レーター
フォトグラ
ファー
ライター
クライアント
アート
ディレクター SE
プログラマー
マークアップ
エンジニア
関わる人
デザイナー
イラスト
レーター
フォトグラ
ファー
ライター
クライアント
アート
ディレクター SE
プログラマー
マークアップ
エンジニア
開発フロー
ライティング デザイン マークアップ プログラミング
スケジュール
WBS
画面仕様書の作成
素材手配
進捗管理
クオリティマネジメント
ディレクション
デザイナー
イラスト
レーター
フォトグラ
ファー
ライター
クライアント
アート
ディレクター SE
プログラマー
マークアップ
エンジニア
みんな~、
あっちいくよ~
目的
ディレクションの役割
• 計画に基づいて
→目的を示して
• 成果が出る仕組みを作る
→人と人、工程と工程を整理し、
つなげること
→目的に引き戻すこと
タスク意味
• ワイヤーを切る
• メールのやり取り・電話応対
タスク意味
• ワイヤーを切る
→目的の伝達・管理
• メールのやり取り・電話応対
→コミュニケーションの設計・管理
ディレクションとは
• 誰に対して
• 何をつたえるのか
• いつ伝えるのか
• どう伝えるのか
• なにをするのか
• どんなツールを
使うのか
組織の形によってやるべきこと
は変わる
一人で出来ていた時代
クライアント デザイナー
小規模制作チーム
クライアント ディレクター
デザイナー
プログラマー
デザイナーで賄いきれない、
顧客対応やプログラミングを
プロが補うように。
中規模制作会社
クライアント 広告代理店
各工程の分業が進み、専門技術の質
が上がり、各工程内での作業効率が
あがる。
ケース1
ケース1
コミュニケーション量は
増えるが、まだ単純。
ケース2
ケース2
専門性は高くなり、各工程の作業効率はあが
るが、コミュニケーションが複雑化
ケース2
複雑すぎるコミュニケーションを裁くので手
一杯に。。。
使用するツール
WBS
ワーク・ブレークダウン・ストラクチャー
スケジューリングとチャート
画面仕様書と修正指示書
• 指示内容指示内容指示内容
• 指示内容指示内容
• 指示内容指示内容指示
• 指示内容指示内容指示内容指示内容
• 指示内容指示内容指示内容
• 指示内容指示内容
• 指示内容指示内容指示
• 指示内容指示内容指示内容指示内容
クオリティチェックリスト
ワークショップ
画面仕様書を書いてみよう
あなたはサイトの運用担当のディレクターです。
クライアントから来月掲出開始の特集ページの作成を依頼されまし
た。
• 1ページものの特集ページの作成をお願いします。
• 企画名、掲載期間、リードなどもご提案ください。
• 商品は少なくとも20品掲出してください。
• 各商品について、「商品名」・「価格」・「簡単な説明」・「商品
写真」を掲出してください。
• スマホページ作成は予算的に作成できません。
クライアントに決裁をもらうための画面仕様書、及びデザイナーにデ
ザインしてもらうための作業指示書を作成してください。
• 指示内容指示内容指示内容
• 指示内容指示内容
• 指示内容指示内容指示
• 指示内容指示内容指示内容指示内容
• 指示内容指示内容指示内容
• 指示内容指示内容
• 指示内容指示内容指示
• 指示内容指示内容指示内容指示内容
クライアント提案用ワイヤー
• 特集ページの目的
• 特集ページ名
• リード
• 掲載商品(もしあれば)
• 掲載期間
• メインビジュアルの構成
デザイナー用仕様書
• このページで達成すべきこと
• 伝えるべきメッセージ
• それぞれの情報の優先順位
• ビジュアルに掲載する要素
• 使う色の指定
• 要素のサイズ指定
• プログラムでつける動き
コミュニケーションで仕組みをつくろう
ありがとうございました
日本ディレクション協会
http://direkyo.org/

Mais conteúdo relacionado

Mais procurados

始めよう!Webディレクション 制作・開発現場を活性化するディレクション
始めよう!Webディレクション 制作・開発現場を活性化するディレクション始めよう!Webディレクション 制作・開発現場を活性化するディレクション
始めよう!Webディレクション 制作・開発現場を活性化するディレクションYusuke Kojima
 
【7月21日ヒカラボ】webディレクターが知るべきwebプロモーション設計
【7月21日ヒカラボ】webディレクターが知るべきwebプロモーション設計【7月21日ヒカラボ】webディレクターが知るべきwebプロモーション設計
【7月21日ヒカラボ】webディレクターが知るべきwebプロモーション設計本間 和城
 
【ゼロからのディレクション講座】サイト設計編
【ゼロからのディレクション講座】サイト設計編【ゼロからのディレクション講座】サイト設計編
【ゼロからのディレクション講座】サイト設計編本間 和城
 
20130920 講演資料
20130920 講演資料20130920 講演資料
20130920 講演資料masaki sukeda
 
日本ディレクション協会流企画のレシピ
日本ディレクション協会流企画のレシピ日本ディレクション協会流企画のレシピ
日本ディレクション協会流企画のレシピ本間 和城
 
0からのwebディレクション講座 制作編5.1
0からのwebディレクション講座 制作編5.1 0からのwebディレクション講座 制作編5.1
0からのwebディレクション講座 制作編5.1 Kazuki Iwai
 
About Design Manager
About Design ManagerAbout Design Manager
About Design ManagerMarino Yokoi
 
【配布用】Web広告の成功法則_広告の設計と運用改善
【配布用】Web広告の成功法則_広告の設計と運用改善【配布用】Web広告の成功法則_広告の設計と運用改善
【配布用】Web広告の成功法則_広告の設計と運用改善本間 和城
 
【設計編Ver2】0からのディレクション講座
【設計編Ver2】0からのディレクション講座【設計編Ver2】0からのディレクション講座
【設計編Ver2】0からのディレクション講座本間 和城
 
0からのwebディレクション講座 製作・開発編5.0
0からのwebディレクション講座 製作・開発編5.00からのwebディレクション講座 製作・開発編5.0
0からのwebディレクション講座 製作・開発編5.0Kazuki Iwai
 
0からのディレクション講座[プロモーション設計編]
0からのディレクション講座[プロモーション設計編]0からのディレクション講座[プロモーション設計編]
0からのディレクション講座[プロモーション設計編]本間 和城
 
【中村】サイト運用編スライドVer.3.0
【中村】サイト運用編スライドVer.3.0【中村】サイト運用編スライドVer.3.0
【中村】サイト運用編スライドVer.3.0Kenta Nakamura
 
20130928 ゼロディレ運用編スライド
20130928 ゼロディレ運用編スライド20130928 ゼロディレ運用編スライド
20130928 ゼロディレ運用編スライドKenta Nakamura
 
0からのwebディレクション講座 製作・開発編4.0
0からのwebディレクション講座 製作・開発編4.00からのwebディレクション講座 製作・開発編4.0
0からのwebディレクション講座 製作・開発編4.0Kazuki Iwai
 
20151011_出版記念講演:クオリティとスキルの話
20151011_出版記念講演:クオリティとスキルの話20151011_出版記念講演:クオリティとスキルの話
20151011_出版記念講演:クオリティとスキルの話Kenta Nakamura
 
凡人のための論理設計アプローチ
凡人のための論理設計アプローチ凡人のための論理設計アプローチ
凡人のための論理設計アプローチYasuji Takase
 
20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)Kenta Nakamura
 
0からのwebディレクション講座 運用編4.0
0からのwebディレクション講座 運用編4.00からのwebディレクション講座 運用編4.0
0からのwebディレクション講座 運用編4.0Kenta Nakamura
 

Mais procurados (20)

20130216 講演資料
20130216 講演資料20130216 講演資料
20130216 講演資料
 
始めよう!Webディレクション 制作・開発現場を活性化するディレクション
始めよう!Webディレクション 制作・開発現場を活性化するディレクション始めよう!Webディレクション 制作・開発現場を活性化するディレクション
始めよう!Webディレクション 制作・開発現場を活性化するディレクション
 
【7月21日ヒカラボ】webディレクターが知るべきwebプロモーション設計
【7月21日ヒカラボ】webディレクターが知るべきwebプロモーション設計【7月21日ヒカラボ】webディレクターが知るべきwebプロモーション設計
【7月21日ヒカラボ】webディレクターが知るべきwebプロモーション設計
 
【ゼロからのディレクション講座】サイト設計編
【ゼロからのディレクション講座】サイト設計編【ゼロからのディレクション講座】サイト設計編
【ゼロからのディレクション講座】サイト設計編
 
20130920 講演資料
20130920 講演資料20130920 講演資料
20130920 講演資料
 
日本ディレクション協会流企画のレシピ
日本ディレクション協会流企画のレシピ日本ディレクション協会流企画のレシピ
日本ディレクション協会流企画のレシピ
 
0からのwebディレクション講座 制作編5.1
0からのwebディレクション講座 制作編5.1 0からのwebディレクション講座 制作編5.1
0からのwebディレクション講座 制作編5.1
 
About Design Manager
About Design ManagerAbout Design Manager
About Design Manager
 
【配布用】Web広告の成功法則_広告の設計と運用改善
【配布用】Web広告の成功法則_広告の設計と運用改善【配布用】Web広告の成功法則_広告の設計と運用改善
【配布用】Web広告の成功法則_広告の設計と運用改善
 
【設計編Ver2】0からのディレクション講座
【設計編Ver2】0からのディレクション講座【設計編Ver2】0からのディレクション講座
【設計編Ver2】0からのディレクション講座
 
0からのwebディレクション講座 製作・開発編5.0
0からのwebディレクション講座 製作・開発編5.00からのwebディレクション講座 製作・開発編5.0
0からのwebディレクション講座 製作・開発編5.0
 
0からのディレクション講座[プロモーション設計編]
0からのディレクション講座[プロモーション設計編]0からのディレクション講座[プロモーション設計編]
0からのディレクション講座[プロモーション設計編]
 
【中村】サイト運用編スライドVer.3.0
【中村】サイト運用編スライドVer.3.0【中村】サイト運用編スライドVer.3.0
【中村】サイト運用編スライドVer.3.0
 
20130928 ゼロディレ運用編スライド
20130928 ゼロディレ運用編スライド20130928 ゼロディレ運用編スライド
20130928 ゼロディレ運用編スライド
 
0からのwebディレクション講座 製作・開発編4.0
0からのwebディレクション講座 製作・開発編4.00からのwebディレクション講座 製作・開発編4.0
0からのwebディレクション講座 製作・開発編4.0
 
20150404 講演資料
20150404 講演資料20150404 講演資料
20150404 講演資料
 
20151011_出版記念講演:クオリティとスキルの話
20151011_出版記念講演:クオリティとスキルの話20151011_出版記念講演:クオリティとスキルの話
20151011_出版記念講演:クオリティとスキルの話
 
凡人のための論理設計アプローチ
凡人のための論理設計アプローチ凡人のための論理設計アプローチ
凡人のための論理設計アプローチ
 
20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)
 
0からのwebディレクション講座 運用編4.0
0からのwebディレクション講座 運用編4.00からのwebディレクション講座 運用編4.0
0からのwebディレクション講座 運用編4.0
 

Semelhante a 0からのウェブディレクション講座:制作・開発編 V02.01

ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮schoowebcampus
 
重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱Yuya Toida
 
はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験Daichi Aoki
 
信頼されるWeb担当者の仕事術120421
信頼されるWeb担当者の仕事術120421信頼されるWeb担当者の仕事術120421
信頼されるWeb担当者の仕事術120421Tsuyoshi Ishihara
 
0からのウェブディレクション講座:設計編 v5.3
0からのウェブディレクション講座:設計編 v5.30からのウェブディレクション講座:設計編 v5.3
0からのウェブディレクション講座:設計編 v5.3Yasuji Takase
 
パソナテック Find Your Ability 講演資料 「ディレクターにとってのWeb業界って? 」
パソナテック Find Your Ability 講演資料 「ディレクターにとってのWeb業界って? 」パソナテック Find Your Ability 講演資料 「ディレクターにとってのWeb業界って? 」
パソナテック Find Your Ability 講演資料 「ディレクターにとってのWeb業界って? 」naoki ando
 
【SDNJ】Ligtning talk on sdnj meetup#4
【SDNJ】Ligtning talk on sdnj meetup#4【SDNJ】Ligtning talk on sdnj meetup#4
【SDNJ】Ligtning talk on sdnj meetup#4Yuichi Inobori
 
ウェブディレクションの基礎(第3回:運用編) 先生:中村 健太
ウェブディレクションの基礎(第3回:運用編) 先生:中村 健太ウェブディレクションの基礎(第3回:運用編) 先生:中村 健太
ウェブディレクションの基礎(第3回:運用編) 先生:中村 健太schoowebcampus
 
デザイナーが複業でデザイナーしてる話
デザイナーが複業でデザイナーしてる話デザイナーが複業でデザイナーしてる話
デザイナーが複業でデザイナーしてる話Yuya Toida
 
Wit wdm01
Wit wdm01Wit wdm01
Wit wdm01wit
 
いいデザインのために組織の一人ひとりができること
いいデザインのために組織の一人ひとりができることいいデザインのために組織の一人ひとりができること
いいデザインのために組織の一人ひとりができることMasahiko Yoshikawa
 
費用対効果を追求するFacebookコンサルティング
費用対効果を追求するFacebookコンサルティング費用対効果を追求するFacebookコンサルティング
費用対効果を追求するFacebookコンサルティングsaito
 
2015年のWebを考える
2015年のWebを考える2015年のWebを考える
2015年のWebを考えるkenji goto
 
受託開発の会社が自社サービスを開発・運営する中で見つけた自分たちにあったスタンス
受託開発の会社が自社サービスを開発・運営する中で見つけた自分たちにあったスタンス受託開発の会社が自社サービスを開発・運営する中で見つけた自分たちにあったスタンス
受託開発の会社が自社サービスを開発・運営する中で見つけた自分たちにあったスタンスYusuke Tamukai
 
090601 担当者のコトバに振り回されるな!
090601 担当者のコトバに振り回されるな!090601 担当者のコトバに振り回されるな!
090601 担当者のコトバに振り回されるな!Ryohei Katayama
 
Z会のマーケティング戦略を実現させるウェブリニューアル
Z会のマーケティング戦略を実現させるウェブリニューアルZ会のマーケティング戦略を実現させるウェブリニューアル
Z会のマーケティング戦略を実現させるウェブリニューアルloftwork
 
ユーザーエクスペリエンスに基づいた指標設計と改善の考え方
ユーザーエクスペリエンスに基づいた指標設計と改善の考え方ユーザーエクスペリエンスに基づいた指標設計と改善の考え方
ユーザーエクスペリエンスに基づいた指標設計と改善の考え方Taku ogawa
 
福井で「しあわせデザイナー」になるために
福井で「しあわせデザイナー」になるために福井で「しあわせデザイナー」になるために
福井で「しあわせデザイナー」になるためにMiho Yamamori
 
インタラクティブクリエイターズ会社概要 201204glbl
インタラクティブクリエイターズ会社概要 201204glblインタラクティブクリエイターズ会社概要 201204glbl
インタラクティブクリエイターズ会社概要 201204glblInteractive Creators Tokyo
 
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロYoshiaki Kaneda
 

Semelhante a 0からのウェブディレクション講座:制作・開発編 V02.01 (20)

ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
ウェブディレクションの基礎(第2回:制作・開発編) 先生:小嶋裕亮
 
重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱
 
はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験
 
信頼されるWeb担当者の仕事術120421
信頼されるWeb担当者の仕事術120421信頼されるWeb担当者の仕事術120421
信頼されるWeb担当者の仕事術120421
 
0からのウェブディレクション講座:設計編 v5.3
0からのウェブディレクション講座:設計編 v5.30からのウェブディレクション講座:設計編 v5.3
0からのウェブディレクション講座:設計編 v5.3
 
パソナテック Find Your Ability 講演資料 「ディレクターにとってのWeb業界って? 」
パソナテック Find Your Ability 講演資料 「ディレクターにとってのWeb業界って? 」パソナテック Find Your Ability 講演資料 「ディレクターにとってのWeb業界って? 」
パソナテック Find Your Ability 講演資料 「ディレクターにとってのWeb業界って? 」
 
【SDNJ】Ligtning talk on sdnj meetup#4
【SDNJ】Ligtning talk on sdnj meetup#4【SDNJ】Ligtning talk on sdnj meetup#4
【SDNJ】Ligtning talk on sdnj meetup#4
 
ウェブディレクションの基礎(第3回:運用編) 先生:中村 健太
ウェブディレクションの基礎(第3回:運用編) 先生:中村 健太ウェブディレクションの基礎(第3回:運用編) 先生:中村 健太
ウェブディレクションの基礎(第3回:運用編) 先生:中村 健太
 
デザイナーが複業でデザイナーしてる話
デザイナーが複業でデザイナーしてる話デザイナーが複業でデザイナーしてる話
デザイナーが複業でデザイナーしてる話
 
Wit wdm01
Wit wdm01Wit wdm01
Wit wdm01
 
いいデザインのために組織の一人ひとりができること
いいデザインのために組織の一人ひとりができることいいデザインのために組織の一人ひとりができること
いいデザインのために組織の一人ひとりができること
 
費用対効果を追求するFacebookコンサルティング
費用対効果を追求するFacebookコンサルティング費用対効果を追求するFacebookコンサルティング
費用対効果を追求するFacebookコンサルティング
 
2015年のWebを考える
2015年のWebを考える2015年のWebを考える
2015年のWebを考える
 
受託開発の会社が自社サービスを開発・運営する中で見つけた自分たちにあったスタンス
受託開発の会社が自社サービスを開発・運営する中で見つけた自分たちにあったスタンス受託開発の会社が自社サービスを開発・運営する中で見つけた自分たちにあったスタンス
受託開発の会社が自社サービスを開発・運営する中で見つけた自分たちにあったスタンス
 
090601 担当者のコトバに振り回されるな!
090601 担当者のコトバに振り回されるな!090601 担当者のコトバに振り回されるな!
090601 担当者のコトバに振り回されるな!
 
Z会のマーケティング戦略を実現させるウェブリニューアル
Z会のマーケティング戦略を実現させるウェブリニューアルZ会のマーケティング戦略を実現させるウェブリニューアル
Z会のマーケティング戦略を実現させるウェブリニューアル
 
ユーザーエクスペリエンスに基づいた指標設計と改善の考え方
ユーザーエクスペリエンスに基づいた指標設計と改善の考え方ユーザーエクスペリエンスに基づいた指標設計と改善の考え方
ユーザーエクスペリエンスに基づいた指標設計と改善の考え方
 
福井で「しあわせデザイナー」になるために
福井で「しあわせデザイナー」になるために福井で「しあわせデザイナー」になるために
福井で「しあわせデザイナー」になるために
 
インタラクティブクリエイターズ会社概要 201204glbl
インタラクティブクリエイターズ会社概要 201204glblインタラクティブクリエイターズ会社概要 201204glbl
インタラクティブクリエイターズ会社概要 201204glbl
 
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
 

0からのウェブディレクション講座:制作・開発編 V02.01