20140913 ディレクション講演資料（山盛り）
•
11 gostaram•1,670 visualizações
福岡でやったディレクションセミナーの中身。 4時間ぶっ通しで喋った内容てんこ盛りに入ってるやつ。
Recomendados
Mais conteúdo relacionado
Mais procurados
Mais procurados (20)
Destaque
Destaque (20)
Semelhante a 20140913 ディレクション講演資料（山盛り）
Semelhante a 20140913 ディレクション講演資料（山盛り） (20)
Último
Último (7)
20140913 ディレクション講演資料（山盛り）
- 1. ディレクターに求められるパワー＆スキルと ディレクションのこれから DIRECTION SEMINOR InFUKUOKA hp-eds.jp 日本ディレクション協会福岡セミナー＠エディス
- 2. 中村健太 日本ディレクション協会会長 Webディレクターズマニュアル編集長 Find Job！スタートアップ著者兼編集 株式会社ビットエーCMO
- 3. 普段やってること ・企画立案/実行計画作成 ・情報設計（コンテンツ設計） ・仕様設計（UIワイヤー/システム仕様） ・アートディレクション ・コードディレクション ・アクセス解析と改善提案 ・グロースハック施策提案/実行 ・コンテンツ作成 ・講演活動（年20回くらい） ・書籍執筆etc...
- 4. やってきたこと01
- 5. やってきたこと02
- 7. 株式会社BIT A（ビットエー） リクルートとかソフトバンクとよく仕事してるWebプロダクション 超上流工程（ビジネス検討段階）からの参画が得意
- 8. 今回のお題 01：そもそもディレクターって何やるひとだっけ？ 02：SNSを味方に！コンテンツマーケティングと感情設計 03：提案の「説得力」を上げるダメ出し＆コンセプトシート 04：Google Analyticsの前に。現場で回すグロースハック
- 10. ビジュアルデザイン と プログラミング 以外の全部 by だから、Webディレクターはやめられない―できるWebディレクターの成功戦略（島本大輔）
- 11. 細かく書くとこれ ※ぶっちゃけもっと多いけど 要件まとめ コンセプト 提案資料作成 初期提案と折衝 各種マッピング ワイヤーフレーム 作成 原稿/素材準備 モックアップ作成 コントロール リソース管理 デザイン管理 組み込み仕様指示 動作テスト 修正指示 確認と修正 変更対応 最終調整 リリース 報告・調整 アクセス解析 運用更新提案 要件まとめ 俺たちの冒険はまだ（ｒｙ
- 12. 大まかに言えばこういうこと 企画 情報設計 制作・開発 クオリティ管理 運用 グロースハック他
- 15. なぜか
- 20. なぜなのか
- 21. コンセプトisキングの時代 多分コンテンツis キングよりこっちが正解 ・SEOの陳腐化 ・能動ユーザーの減少 ・受動ユーザーの増加と一般化
- 25. だからより効率良く勝たなきゃ いけないし そのためのコンテンツを発信し たくてしょうがなくなってる
- 26. ディレクターってなにやる人だっけ ディレクションの基本はこの3つ 企画 情報設計 制作・開発 クオリティ管理 運用 グロースハック他
- 27. つまり・・・ コンテンツ を立案し 情報を精査 実際に 作り上げ そして グロース させる これができるディレクターが必要とされている
- 33. なら…応えなきゃね
- 35. 第ニ章 情報設計と 感情設計 コンテンツ マーケとか
- 36. 領域でいうとこのへんの話 企画+制作（ちょっと運用） 企画 情報設計 制作・開発 クオリティ管理 運用 グロースハック他
- 38. 要するに これを決めること サイトに何を載せるか = 情報設計
- 39. そして設計して決まったネタを どうやってカタチにするか これを決めること = 仕様設計
- 40. 先に仕様設計の説明から 施策要件 課題・目的・コンテンツの概要 など 制作要件 必要な素材・制作するページ数 など 機能要件 必要な機能など 手続き要件 他社サービスの利用に必要な手続 きなど 技術要件 対象環境・使用言語など コスト要件 おおよその費用と工数算出など
- 41. ついつい仕様設計から 考えたくなるけれど 何ページ 構成で・・・ 弊社の パッケージ なら・・・ CMSを 使いましょう！ あのAPIを 使ってー
- 42. 仕様設計なんて 情報設計なしには決めようがない （何をどう載せるのか？） 何を？ どう 作るのか
- 43. 多くの人が関わるWebサイト構築 依頼主の担当 依頼主の上長 代理店プランナー Webディレクター デザイナー プログラマー イラストレーター フォトグラファー ライター
- 44. 放っておくといろいろ載せたくなってくる 依頼主の担当 依頼主の上長 代理店プランナー Webディレクター デザイナー プログラマー イラストレーター フォトグラファー ライター 用語集も載せよう！ ライバルの やってるあの機能を！ フォームは別々 がいいのでは？ オウンドメディア！ ソーシャルの反応を コンテンツ化して・・・ フォトギャラリーを 作りましょう ニュースは いるでしょう
- 46. だから、サイトに載せる情報は 選び抜く必要がある 基準になるのは KGI KPI この二つの指標 Key Goal Indicator Key Performance Indicator
- 47. KGI 最終的な利益目標（数値） KPI 上げ続ければKGIが達成 できる！という数値目標 例：ECサイトで言えば • 商品点数の増加率 • 商品詳細ページのPV数 • 商品購入のCVR • サービスの成長 売上の継続的増大
- 48. KPIはユーザーの行動（心理・実態）がないと どうにもならない指標 いつ来ても新しい商品に 出会える喜び 商品点数の増加率 アレもこれも見ちゃう 商品詳細ページのPV数 は！また買っちゃった 商品購入のCVR 心理・気持ち KPI
- 49. 情報設計とはつまり、KPI達成のために 未来 今から未来にかけて どんな情報をユーザーに提供するか？ これを設計すること
- 52. よく使われる手法 • マーケットでの立ち位置（ベンチマーク）調査 • シーズ＆ニーズ調査 • ペルソナ定義
- 53. マーケットでの立ち位置（ベンチマーク）調査 リーダー フォロワー チャレンジャー ニッチャー トップシェアの競合 模倣戦略の競合（要はリーダーのマネ） 差別化戦略の競合（ちょっと違うことやってる） 独自戦略の競合（狭いとこ狙ってる） で、今自分がどこにいて、どこを狙うのか そもそもそこにマーケットはあるのか？など考えて
- 54. シーズ＆ニーズ調査 シーズ ニーズ ニーズに対し提供できそうなもの ユーザーのニーズとして 想定できそうなもの 欲されているものと提供できるものをすりあわせ
- 55. ペルソナ定義 想定ターゲットユーザーの人格や人生観を決めてコンテンツを選ぶ 基本情報 行動特徴 意識特徴 武田良介、36歳、男性、Web系エンジニア、転職経験2回 年収560万、持ち家（ローン支払い中）、既婚（嫁は地元 栃木の元同級生：スーパーのパート） 長女：10歳、長男：7歳 かなり忙しく、帰る日より帰らない日のほうがちょっと多 い仕事は好き でももう少しゆとりのある生活に憧れている 基本的に「中途半端」が嫌いで、やや潔癖より 本人にその自覚は薄いが、周囲からは神経質そうと揶揄さ れることも多い
- 57. でも“できそうなもの”から選び出して 情報を精査（言い換えればカット）して それだけでユーザーを動かすコンテンツは完 成するんだろうか？ 出す 出す カット
- 58. ムダなものがなく、分かりやすい それってつまり ユーザーに「なるほど」としか感じてもらえない とも言えてしまうから
- 59. マインド設計 多分、これから必要なのはこの部分 ～Find Job! 会社訪問メディアの話～
- 60. すべてのサイト、サービスに共通していること ユーザーに サービスを通じて 何かを感じてもらい 何かを してもらう
- 63. 事例紹介
- 64. Find Job ! 好きになれる会社を見つけよう ■コンテンツ的特徴 ・インタビュー形式の求人記事 ・応援ボタンを押すとシェア ・話を聞きに行くボタンで応募 ■数値的特徴 ・1記事あたりのPV：約10,000 ・イイネ数：平均500～700 ・ツイート数：平均100～200 ・はてなブックマーク：約70～90 恐らく単体での求人記事としてはかなり高 水準これをリリースして1日で達成
- 65. 何をやったのか ユーザーのマインド を設計し 設計した マインドを分解 して それに合わせて コンテンツを作った
- 66. ユーザーのマインド設計 「〇〇!!!」 「なるほど」でも「使いやすい」でも「理解しやすい」でもなく、 ユーザーが驚きを持ってその感情に触れる設計が必要だと考えた このメディアの場合「この会社応援したい!!!」
- 67. マインドの要因分解 何があればそんな感情を持つのか？ 感情を生み出す要因を分解 応援したい!!! ゴールへの共感 プロセス アプローチへの共感 タレント（ヒーロー） への憧れ
- 68. この3つの要素を取りに行くために ・対象となる企業と人を分析し ・インタビューの質問内容を決め ・3つの要素を分かりやすく伝える コンテンツに作り変えた
- 70. 結果として・・・ ・多くの人が「応援する」をクリックしてくれた ・シェアが爆発的に広まった ・PVも大きく跳ねた ※KPI ・もちろん応募も集まった ※KGI
- 71. これまでの「情報精査方式」は 出す 出す カット これはこれで大事なことだった
- 75. だから、「感動!!!」そのものを 設計してコンテンツ化する必要がある ■ゴールへの共感 ・何かをなそうとする熱意 ・反体制（対社会悪など） ・大きな理想 ・誰もなしえていない事への挑戦 ■プロセス、アプローチへの共感 ・どん底からのサクセス ・ひたむきな努力 ・仲間のための努力 ・積み重ねた下積み ・徹底的なこだわり ■個人へのフォーカス ・ブレない信念に従った行動 ・不利と言われる戦いを挑む姿勢 ・キャラクターのギャップ コンテンツ
- 76. 膨大な情報をまとめるだけでは もったいない いらない情報をカットするだけ ではまだ足りない
- 77. これから必要なのは 人の感情を分解して 狙った感情を「○○!!!」と 呼び起こすコンテンツ
- 78. 人の感情を動かすコンテンツがあれば… コンテンツ SNSバイラル 結果的にSEOに
- 80. 質疑 応答
- 81. ちょっと休憩しようず
- 83. 領域でいうとこのへんの話 企画+制作（ほぼヒアリング） 企画 情報設計 制作・開発 クオリティ管理 運用 グロースハック他
- 84. ヒアリングってなんだっけ？
- 85. 一般的な解釈 ディレクター 依頼者 何がやりたいの？ あの…なんかあれだよ
- 86. でこうなる 依頼者 依頼内容 ディレクター デザイナー プログラマー 実現するために頑張る
- 87. でも本来はこうあるべき デザイナー プログラマー ディレクター 依頼者 Webで最高の結果だそうぜみんな！
- 88. 依頼を受けてから企画を考えて実現する ではなく 依頼者と一緒に「何を実現するべきか」ま でさかのぼって考える ＝企画前の最上流まで食い込む
- 89. クライアントが 何をやりたいかベース ユーザーが 何を求めているかベース
- 90. クライアントが 何をやりたいかベース ユーザーが 何を求めているかベース
- 93. でも前提として… ディレクターはプロジェクトにおける上の人であるべき ・サイトコンセプト決めるのも ・設計を決めるのも ・レイアウトを考えるのも ・コンテンツ案を出すのも ・原稿や素材を手配する（あるいは作る）のも 全部実際に現場レベルでやるのはディレクター
- 95. 前提がおかしいことの例 ・期間設定がおかしい ・価格設定がおかしい ・やろうとしてる事とリリース方法があってない ・ユーザーのことガン無視してる このままコンセプト引いてプロジェクト動かしたら ・・・死ぬよね※主にデザイナーやコーダー、プログラマー、ライターが
- 97. いきなり依頼者にダメ出ししろって言われても・・・。 無理じゃね？ 入れなくね？ いきなりそんな話 聞いてもらえるわけ なくね？ でも
- 100. 中村がどうやってるか ・最初の相談段階で企画や現行サイトや企画にダメ出し ・それをチームでレポート化して依頼者にぶつける ・そこから返ってきた反論からヒアリングを始める ・コンセプト～プロジェクト骨子を「一緒に決めてしまう」
- 101. 最初の相談段階で企画や 現行サイトにダメ出し 依頼者 こういうサイト 作ってよ こういうサイト にリニュしてよ ディレクター デザイナー プログラマー それじゃダメだよね こうあるべきだよね
- 102. チームでレポート化して 依頼者にぶつける 依頼者 ！ ディレクター デザイナー プログラマー これなら行ける！
- 103. 返ってきた反論から ヒアリングを始める 依頼者 そういうことじゃ ないのだよ！ ディレクター デザイナー プログラマー じゃあどうなの？
- 104. コンセプト～プロジェクトの骨子を 「一緒に決めてしまう」 依頼者 ディレクター デザイナー プログラマー 企画 コンセプト スケジュール 具体施策 設計
- 105. 具体的には何をするの？ ・ダメ出しレポート提出 ・コンセプトの案も一緒に出す ・提案書も一気に出す ・要件定義を一緒に作る ・んで、詰める コンセプトシートの作り方：http://goo.gl/T5wbN RFPの作り方：http://goo.gl/eQEfO
- 106. コンセプトの重要性と作り方
- 107. コンセプトて何？
- 109. たとえば？ ディズニー「夢と魔法の国」 ナナピ「7分でできるライフレシピ」 ⇒「みんなで作るくらしのレシピ」
- 111. ちなみに中村はこんな感じで書きます 要素A 要素B つまり〇〇ならいいんじゃね？ てことは「〇〇」ってことだよね。
- 112. 本来の目的 課題項目 つまり どうなればいい？ 他会場がやってないことをやる。だからユーザーが知る。見る。共有する。そして、買う。 そのため、コンセプトは「当日まで観る価値のあるサイト」と提唱します。 GTの本体サイトにあるコンテンツだからもてぎには要らない。ではなく、一定期間だけでも 「本体サイトよりももてぎのサイトを見る」という状況を作れば目的は達成しやすくなる。 ・より多くのチケットを販売し、来場者数を増やしたい。 ・単品より複数人（ファミリー）で来場して欲しい。 ・予選から決勝まで、できれば泊まり込みで来て欲しい。 ・既に国内最高の観客動員数を誇るレースシリーズだけど、もてぎ での最終戦こそが最高に面白い！と認知を広める。 ・チームやドライバーの情報が見れる（もてぎ戦を見るかどうか を検討しているユーザーに他サイトへの移動を勧めるのはナンセ ンスなので） ・基本的なルール、楽しみ方をしっかり伝える。（辺にPOP路線を 狙う必要ななし。イベントのあり方がハードなのだから） ・チケットの販売数増加（前年比150％取りたい） 必要なのは・・・ チケットが買いやすいこと イベントやおトクなプランが分かりやすいこと 予選日の楽しさが伝わること 例：2012年度SUPER GT サイトの時に書いたもの
- 113. • ワイヤーも • デザインも • 原稿も • インタラクションも • UIも 基本的には全部「コンセプト」を拠り所 にして判断する。
- 115. 理想 クライアント しっかりとした コンセプト提示 発注 ディレクター コンセプトを元に サイトを設計 クライアント コンセプトが曖昧 もしくは無い 発注 ディレクター え？と？何がしたいん？ クライアント ビジネスの目的 （理念や目標）を提示 発注 ディレクター サイトコンセプトを提示 した上でその了承を取っ て 設計をスタートさせる。 なぜディレクターがコンセプトを作るのか よくあるケース だからこうやる
- 116. 根拠含めて、 クライアント（依頼者）と制作チーム全員がコンセ プトを共有し、指標としなければプロジェクトは動 かない。 つか途中で止まる。
- 117. で、ここで質問 いきなり開口一番で… 僕はこのサービスのコンセプトは こうだと思います！ とか言って通用するでしょうか？
- 118. 多分かなりキツイ
- 119. だからこうやる マイナスの共感誘導 課題意識の共有 理想型の提示 コンセプトの提唱 ダメ出しシートで 「だよねー」の共感を 刺激。 解決するにはこうやる べき。企画はこれ。全 てはこのコンセプトの 元に。
- 120. ダメ出しシートやってみよう 今回やるのはリニューアルのケース ビジュアル上の問題点 導線設計上の問題点 コンテンツ展開上の問題点 各課題項目に対する改善施策案 要綱構成
- 122. 本来やりたいこと（KGIor KPI） 課題項目 理想型 コンセプト
- 123. まとめ
- 124. 制作のフローってとにかく やること多い。
- 125. 関わる人の数もまぁ多い
- 126. どれだけマーケットを見て いい企画を立てても メンバーの意識を統一できなけ れば結局なにも起こせない
- 127. そうかと言って「空気読めよ」ばかりで は仕事にならない だからコンセプトを使う 説得するためにダメ出しシートを使う ディレクターが上手く導けなければ、ど んなプロジェクトだって成功なんてしな いんだから
- 128. 質疑 応答
- 129. 第四章 Google Analyticsのその前に 現場で回すグロースハック
- 130. まず前提として Webサイトは完成しない
- 131. 作って終わり⇒× 作ってからが本番⇒○ Plan 企画して Do 実行して Action んで次の一手を･･･ Check 上手く行ってんのか判断して
- 132. 中でもとにかく大事なのが Action んで次の一手を･･･ Check 上手く行ってんのか判断して ここにナイスパスが無いと、 そこでプロジェクトの成長・進行が止まる。と思う。
- 133. Webに当てはめて言うと Check アクセスを解析して Action 改善施策を決める てこと ※すげー大雑把だけど・・・
- 135. 大抵はこんな感じのリアクションになる え？ そーいうのは私の仕 事じゃないから いやほら 忙しくてさ ディレクター デザイナー プログラマ
- 137. 解析の目的 サイトを改善する理由を見つけ成長させる ユーザーニーズを把握して次の施策を考える 上手くいってる施策の加速と 上手くいってない施策の原因究明と改善
- 138. と、言い切るためにやる 平たく言うと このサイトって○○じゃね？（仮説） △△△したほうが良くない？（提唱）
- 139. そう。仮説を取りに行く行為なのよ。 数値データを 調べる仕事じゃ 無いんだよ。
- 140. 仮説が立てば やるべきことが見えてくる このサイトコンバージョン低くね？（課題） フォームがグダグダだからじゃね？（仮説） じゃフォームの導線改善しようか（やるべきこと）
- 141. やるべきことが見えてくれば、 項目をまとめて行動が起こせる。 フォームのどこが悪いんだ？（調査） そうか。長すぎて途中で逃げちゃうのか（問題発見） じゃ短くしよう（方針決定） これとこれとこれはカットしても問題ないな（施策草案） じゃ短くなったバージョンのワイヤー書くわ（設計） デザインやり直しだから3営業日はかかるな（工数算出） プログラムは処理変えるだけだから1日だな（工程決定） じゃやるか！（実行）
- 142. アナリストやディレクターだけが 数字を追ってたんじゃこうはいかない 全職種の人間が「興味」を持っていることが 結構重要だったりする。
- 143. 大事なことなのでもう一度 解析は、PDCAサイクルのCからAに つなげる大事なポイント。 P D C A Cで止めちゃう＝膨大な数値データをキレイに並べて満足しちゃう Aにつながらない＝「このサイトじゃダメです」みたいなどーにもな らん結論を出しちゃう
- 145. 具体的なやりかた4ステップ。 理想の導線を考える 仮説と取るべき数値を決める 何をどの順番でやるのか決める このサイトはダメだ！と決める
- 146. サイトは完成しない であれば完璧なサイトなんて存在しない だから、まずは「未完成なものである」 という前提で数字に向きあいます このサイトはダメだ！と決める いいサイトなのにねぇ なんで上手くいかない んだろうねぇー この考え方を捨てる
- 147. 検索 一覧 個別ページ フォーム 完了画面 そのサイトにおける「こういう道筋を辿ってくれたらいいなー」 という導線を考えて、そのパターンを洗い出す 理想の導線を考える 初見 2回目 3回目 男女 会員 流入元別 広告 乖離日数 別アクション
- 148. もしかしてこのサイトがダメなのって 〇〇が▲▲だからじゃない？ 仮説と取るべき数値を決める これが仮説 〇〇 取るべき数値の項目 ▲▲ その数値の実測データ
- 149. 〇〇 取るべき数値の項目 ▲▲ その数値の実測データ ＝ これがいわゆるKPI てやつなのよ
- 150. 問題は どのデータをとるのか？ その選別が難しい ということ
- 152. まだデータになっていない でも確かに その数値が分かればビジネスを加速させるもの これを仮説で想定できるようになると すんげー強い
- 153. Twitterの事例
- 154. スヴェンソンの事例
- 156. そのビジネスにとって どの数字を伸ばせば成長につながるのか （＝KPIの把握） その数字を伸ばすために知るべき項目はなにか （＝課題数値の把握） これをやらなきゃ解析なんてできない。
- 157. 解析結果データに書いてある数字は数字じゃない 誰かが、それぞれの事情や悩みや欲求にそって行動 したその履歴だもの 数字の向こう側に人間を見なければ、 解析はうまくいかない
- 159. 膨大な情報を ターゲットに合わせて 取捨選択すること 情報設計ってなんだっけ？
- 160. つまり・・・ どんな競合がいる マーケットで なにをウリと していて 誰に価値を 感じて貰うのか すべての勝ちサイトにはこれが ちゃんと定義されてるってこと。
- 161. 何度も言うようだけど ただ解析するだけなら いらない 欲しいのはキレイなデータじゃなく そのサイトを成長させる 提案なのよ
- 162. だから、まず分解する このサイトは ・どこのマーケットで ・何をウリとしていて ・誰をターゲットに ・なにをしようとしているのか
- 163. すると・・・ 何がKPIなのか見えてくる あとはそのKPIをどうやってあげるのか？を 仮説と合わせて提案すればいい
- 164. その仮説を「なんとかする」ために 「何をするべきか？」を考える 考えた結果を並べて、優先度を付ける 何をどの順番でやるのか決める
- 165. 中村が良く使う判断基準 ・ユーザーに届くスピード ・数字に対するインパクトの大きさ ・施策の簡易さと実装の早さ ようするに安く早く出来る順てことよ
- 167. まとめ
- 169. 数字の先にあるユーザーの 気分と気持ちと想いと理由を妄想できる イメージング能力。 それが最も重要
- 173. 以上 ご清聴ありがとうございました。
- 174. 質疑 応答