2015年11月28日＠東京 2016年4月30日＠東京 開催の「0からのディレクション講座設計編」資料です。 サイト設計・ペルソナ・ターゲット・導線設計などなど

1. 日本ディレクション協会
本間和城

3. 本 間 和 城
ホ ン マ カズシロ
日本ディレクション協会 副会長
株式会社インタースペース 新規事業担当
株式会社レジュプレス STORYS.JP プロデューサー
 Google AdWords 認定資格保有者
 Yahoo!プロモーション広告 プロフェッショナル認定 トップレベルスコア
保持
 GAIQ
 (危険物取扱資格乙種1~6類・電気工事士・色彩検定2級など‥)

5. 『設計編』
・企画
・情報設計
・マーケティング調査
・ワイヤー作成
・原稿・素材準備
などなど
『制作編・開発編』
・実装方法策定
・チーム編成と座組
・進行管理
・クリエイティブ管理
などなど
『運用編』
・更新 / 修正懸案管理
・Web解析と報告
・改善企画立案
・計画策定と実行
1 2 3

6. 『設計編』
・企画
・情報設計
・マーケティング調査
・ワイヤー作成
・原稿・素材準備
などなど
『制作編・開発編』
・実装方法策定
・チーム編成と座組
・進行管理
・クリエイティブ管理
などなど
『運用編』
・更新 / 修正懸案管理
・Web解析と報告
・改善企画立案
・計画策定と実行
1 2 3

7. クライアントの求める「目的」を
Web上で最大限提供するため
成果物を作る事

8. クライアントの求める「目的」を
Web上で最大限提供するため
成果物を作る事

9. １ 設計ってそもそも何？
２ 失敗しない設計を「本質」から考える
３ ４つのステップで、４つの設計をする
４ 実践で学ぶ

10. Webサイトとは
誰かに・何かを伝え・何かをさせる
ツール
それを設計するだけ。
簡単でしょ?

12. は設計じゃない

13. 誰に・何を伝え・何かをさせる
仕組みをWeb上に用意することが
サイト設計である

14. 理想
ゴール
どう
させる？
なに
やる？
誰に？

15. 理想
ゴール
どう
させる？
なに
やる？
誰に？
コンセプト設計
ターゲット設計
導線設計・感情設計
仕様設計

16. 理想
ゴール
どう
させる？
なに
やる？
誰に？
コンセプトの設計
ターゲット設計
導線設計・感情設計
仕様設計

17. 順を追って見ていこう

18. 理想
ゴール コンセプト設計

19. Webサイトを使って何したいの？
を問う
リード
の獲得
店舗への
来店促進
キャンペーン
の応募増
商品認知

20. リード
の獲得
店舗への
来店促進
キャンペーン
の応募増
商品認知
企業が持っている資産を問う
良質な
商品
企業の文化
効率的な
生産工程
ブランド力
Webサイトを使って何したいの？
を問う

21. 競合他社にはない、競争上で優位になる独自資産

22. 独自資産を「強み・ユーザーへの価値」へ変換

23. 独自資産を「強み・ユーザーへの価値」へ変換

24. Webサイトを使って何がしたいのかを明確にし
その企業が持つ独自資産を洗い出し
「強み・価値」という武器に変えたうえで
その武器を最大限生かし、
理想に近づく為のWebサイトを考える

31. を
一番魅力的に感じてくれる人は誰だろう？
感じさせたい人は誰だろう？

32. よくあるペルソナ設計
山田太郎29歳 都内在住でIT系企業の営業マン
地方の大学を出て、6年前に上京
休みの日は一人で出かけることが多く、
よくカフェで一日中仕事をしたり、
本を読んだりしている。
行動するより考える派。何事も慎重に決める。
Webのリテラシーは高いが、人と違う事にかっこよさを感じる
だからMBAよりWindows。IT系でWindows使ってる。
渋いかっこいい。
身に着けるモノにはあまりお金をかけない。

33. よくあるペルソナ設計
山田太郎29歳 都内在住でIT系企業の営業マン
地方の大学を出て、6年前に上京
休みの日は一人で出かけることが多く、
よくカフェで一日中仕事をしたり、
本を読んだりしている。
行動するより考える派。何事も慎重に決める
Webのリテラシーは高いが、人と違う事にかっこよさを感じる
だからMBAよりWindows。IT系でWindows使ってる。
渋いかっこいい。
身に着けるモノにはあまりお金をかけない

41. 例えば・・・ダイエット商品なら

42.  24歳女性、地方の中堅企業で事務。一人暮らし
 仕事が終わる時間が遅いため、食生活が偏りがち
 最近体重が増えた。彼氏にも「太ったね」と言われる
 体重の増加
 夏で水着になるのが怖い！
 彼氏にフラれたくない！

45. ここまで考えればこのターゲットに
何をどう伝え・何を感じさせるべきか
見えてくる

47. 「なりきる」ことが大切

50. 年齢や性別、どんな生活をしているのか、
モノを選ぶときに何を一番大切にするか
どんな悩みを抱えているの？
なんでそれが悩みなの？

51. どうなりたいの？明確に。
なんでその理想に近づけないでいるの？阻んでいるものはなに？
どういうタイミングで、何を伝えることで、そのユーザーをどうさせたいの？

53. 感
動
ターゲットの 情を
欲しい！に かす導線作り

54. 決めたターゲット像の人は
朝起きてから、寝るまで同じ感情ですか？

55. 決めたターゲット像の人は
朝起きてから、寝るまで同じ感情ですか？
どんな順番で、どんな情報を見せていくと
Webサイトでの目標達成に近づくのか
を設計していこう！

56. 決めたターゲット像の人は
朝起きてから、寝るまで同じ感情ですか？
交際前のデートみたいなもん
どんな順番で、どんな情報を見せていくと
Webサイトでの目標達成に近づくのか
を設計していこう！

57. このサイクルの連続によって
Webサイトの目的を達成させる

58. 考え方のフレームワーク
サービスの理解度
ニーズ
サービスを理解してもらい、欲しいと思わせる。
2軸で設計を行う

59. 考え方のフレームワーク
サービスの理解度
ニーズ
サービスを理解してもらい、欲しいと思わせる。
2軸で設計を行う
感情と
コンテンツ・導線を
一緒に考える

60. の設計：旅行の例
サービスの理解度
ニーズ

61. サービスの理解度
ニーズ
感情から行動を設計
サイトに入る前の行動も考えよう

62. 感情の設計：旅行の例
サービスの理解度
ニーズ

63. コンテンツ・導線の設計
サービスの理解度
ニーズ

64. コンテンツ・導線の設計
サービスの理解度
ニーズ
理想的な導線を
ユーザー主体で考える

65. フレームで考えるメリット
１ 本当に必要な情報が見えてくる
２ どんな感情のステータスでも、ゴールに
持って行ける力を持ったサイトになる
３ サイト解析しやすい！
理想的な導線の離脱場所から、
ダメなところが見えてくる

67. １
２
３

68. ワイヤー
サイト導線
機能
どの情報の優先度を上げるか
内部リンクの優先度、
どういう遷移が理想的なのか
各機能はどういう挙動をすべきか

69. 理想
ゴール コンセプト設計

70. 1秒の追究
1秒でサイトの価値を伝える
1秒で理解させる

71. 1秒でサイトの価値を伝える
メタ情報の設計

72. 1秒でサイトの価値を伝える
メタ情報の設計

73. 1秒で理解させる
サイトの構造とワイヤー

74. 理想
ゴール
どう
させる？
なに
やる？
誰に？
コンセプト設計
ターゲット設計
導線設計・感情設計
仕様設計

75. 一番大切なのは
に向かって
を設計する事

78. Web制作は
課題解決のために最適な解の成果物
設計し、作る事が目的ではなく、
ビジネスを成長させる手段だと認識しよう
最後に、忘れないでほしい事