SlideShare una empresa de Scribd logo
1 de 49
Descargar para leer sin conexión
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
1
0からのWebディレクション講座
設計編 version5.3
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
2
氏名
高瀬 康次(タカセ ヤスジ)
略歴
2000年頃にウェブ制作の技術を独学で習得し、個人
で制作を受託するなどして活動。
その後、不動産と広告の業界で営業職を経験し、2006
年にウェブディレクターに転身。
2008年にフリーランスとして独立し、デジタルマー
ケティングオフィスDCHSを設立。
2013年より日本ディレクション協会に参画し、主に
講師として活動。
2014年より株式会社BITAに所属し、某大手就職情報
サイトの制作ディレクションを担当している。
2015年1月より、日本ディレクション協会デジタル
マーケティング推進室の室長に就任。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
3
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
ここから本題
4
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
5
まえがき
ウェブに関する用語については、概念的なものが多く、常に諸説あり、
人により、意味が全く異なることがあります。
本講における各用語の使い方は、講師である高瀬の主観、および経験に
基づいて定義されており、実際の業務の場において扱いやすいよう、あ
えて狭義的に用いていることが多くあります。
本講義を受講される方には、ご自身の理解、または職場での用法に置き
換えていただき、ご理解くださいますようお願いいたします。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
ウェブディレクターって何者?
6
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
7
ウェブディレクターの主な仕事
要件 と 人員 と 工期 とを統括し、

その 進行管理 をする人です。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
8
ウェブディレクターの主な仕事
?
何をやるのか
?
誰がやるのか
?
いつやるのか
要件 と 人員 と 工期 とを統括し、

その 進行管理 をする人です。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
9
オーケストラにおける

指揮者
建設現場における

現場監督
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
10
ウェブディレクションの流れ
①設計 ②構築 ③運用
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
11
本日のテーマ
①設計 ②構築 ③運用
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
ウェブにおける設計とは何か?
12
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
13
ウェブにおける設計とは何か?
?
何をやるのか
?
誰がやるのか
?
いつやるのか
要件
その
要件
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
14
何のために設計をするのか?
動感
インプット
アウトプット
Feel Action
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
15
何のために設計をするのか?
ウェブサイトにおける設計とは、
ユーザーの「感動を設計」すること。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
16
設計のステップ
①情報設計 ②仕様設計
主に戦術面の設計を行います。
ワイヤーフレーム、外部設計 など
主に戦略面の設計を行います。
コンセプトワーク、マーケティングプラン など
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
情報設計
17
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
18
カスタマーの定義(ペルソナモデル)
Domain(分類・区分) Mind(意識・性格)
Behavior(行動・習慣)Visual(外見・服装)
Customer(人物)
?
カスタマーはどのような人物なのか?
カスタマーの人物像を、

具体的に想定する。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
19
バリューの定義(ポジションマップ)
Value(価値)
?
カスタマーにとっての価値は何か?
Position(優位性)
競合のサービスと比較して、

目指すポジションを明確にする。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
20
ゴールの定義(KPI/KGI)
Goal(KGI)
?
最終的に達成したい目標は何か?
Step(KPI)
目標を達成するために、

積み上げるべき数値を設定する。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
21
ミッションの定義(スローガン)
Customer(人物) Goal(KGI)Value(価値)
カスタマーは

どのような人物なのか?
カスタマーにとっての

価値は何か?
最終的に達成したい

目標は何か?
Mission(Slogan)
共通理念として掲げる言葉
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
設計してみた
恋愛編
22
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
23
エロ偉い人が大事なことを言っていました。
マーケティングとは、恋愛である。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
24
恋愛における登場人物
オレ アイツら
あの娘
恋敵
片想い 片想い
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
25
マーケットにおける登場人物(3C)
自社
Company
競合
Competitor
顧客
Customer
商売敵
訴求 訴求
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
26
背景/課題/目的
気になるあの子は同期入社のマドンナ。

昨年末、彼氏に浮気して別れて以来、ひとりでいるらしい。

入社して2年、最近仕事の壁にぶつかっていて悩んでいるみたいだ。
あの子を狙っているのはオレだけじゃない。

ひとりは同期入社の脳筋野郎、

もうひとりは彼女と同じ部署の主任で、クールなスポーツマンだ。
最近、あの子は知的で渋いあの上司が気になっているみたいだけど、

彼には奥さんがいるから、オレにもまだチャンスがあるはずだ。
なんとしてもあの子の気を惹いて、恋人にするんだ!
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
27
カスタマーの定義(ペルソナモデル)
Domain(分類・区分) Mind(意識・性格)
Behavior(行動・習慣)Visual(外見・服装)
Customer(人物)
?
新卒入社2年目、23歳、女性、

彼氏なし、営業職、年収250万円
和やかなムードが好き、勉強家、
問題を抱え込みがち
黒髪、ポニーテール、メガネ 世話好き、

人の話を聞くときはもの凄く目を見る
根が明るく、まじめで、物事を真剣に考える人
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
オレ上司
28
バリューの定義(ポジションマップ)
Value(価値)
?
クール ファニー
インテリジェンス
スポーツマン
Position(優位性)
主任 同期
悩みを吹き飛ばし、笑顔の絶えない日々
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
29
ゴールの定義(KPI/KGI)
Goal(KGI)
?
Step(KPI)
Lineトーク:50件/day
 ↓
Line通話:2件/Week
 ↓
デート:2回/Month
交際の承諾:1件
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
30
ミッションの定義(スローガン)
Customer(人物) Goal(KGI)Value(価値)
Mission(Slogan)
根が明るく、まじめで、
物事を真剣に考える人
悩みを吹き飛ばし、

笑顔の絶えない日々
交際の承諾:1件
頼りがい!遊びがい!安心と楽しさの相乗効果!
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
設計してみた
ウォッチブランド編
31
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
32
背景/課題/目的
参加者にのみ公開
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
33
バリューの定義(ポジションマップ)
参加者にのみ公開
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
34
カスタマーの定義(ペルソナモデル)
参加者にのみ公開
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
35
施策
参加者にのみ公開
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
36
ゴールの定義(KPI/KGI)
参加者にのみ公開
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
37
ミッションの定義(スローガン)
参加者にのみ公開
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
仕様設計
38
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
39
仕様設計において重視すべきこと
1秒の追求
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
40
1秒でサイトの価値を伝える①
description
title
og: title
og: image
og: description
メタ情報は、集客導線上、非常に重要な役割を担っています。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
41
1秒でサイトの価値を伝える②
タグライン
サイトの機能やメリット
を簡潔な文言で紹介する
ものです。
キービジュアル
近い将来像を、ビジュア
ルで具体的に伝える役割
をもつものです。
ナビゲーション
サイトの機能や得られる
情報を単語レベルの文言
で伝えるものです。
ファーストビューは、ユーザーの興味を最大化する最重要ポイントです。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
42
1秒で進路を伝える
ユーザーの属性別ナビゲーション
クレジットリンク(信頼性を担保するナビゲーション)
ユーザーの興味別

ナビゲーション
ナビゲーションのグルーピングにより、自然な理解を促します。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
43
1秒で目的地へ導く
サイトマップは階層を浅くシンプルな構造にします。
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
44
1秒で内容の理解を得る
コンテンツのグルーピングにより、自然な理解を促します。
A-① / B-①

タイトルエリア
A-③、B-⑥

コンタクトエリア
B-④

セールスエリア
B-⑤

サービスエリア
A-① / B-②

ステータスエリア
B-③

ナビゲーションエリア
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
45
でも一番大事なのは
Customer Value Goal
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
46
ワイヤーフレームを学ぶなら!
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
情報設計

ワークショップ
47
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
48
お題
参加者にのみ公開
(C) 2015 DCHS / CONFIDENTIAL
0からのウェブディレクション講座
設計編
おわり
49

Más contenido relacionado

La actualidad más candente

0からのwebディレクション講座 福岡 設計編_150117
0からのwebディレクション講座 福岡 設計編_1501170からのwebディレクション講座 福岡 設計編_150117
0からのwebディレクション講座 福岡 設計編_150117direkyo-kyusyu
 
Web制作 あとで揉めないための確認のポイント
Web制作 あとで揉めないための確認のポイントWeb制作 あとで揉めないための確認のポイント
Web制作 あとで揉めないための確認のポイント高本 徹
 
ディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルールディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルールINFOBAHN.inc(株式会社インフォバーン)
 
Webディレクション講座 - 初級編 -
Webディレクション講座  - 初級編 -Webディレクション講座  - 初級編 -
Webディレクション講座 - 初級編 -Colorkrew
 
ウェブディレクションの基礎(第1回:設計編) 先生:高瀬 康次
ウェブディレクションの基礎(第1回:設計編) 先生:高瀬 康次ウェブディレクションの基礎(第1回:設計編) 先生:高瀬 康次
ウェブディレクションの基礎(第1回:設計編) 先生:高瀬 康次schoowebcampus
 
現役Web ディレクターに聞く Webディレクターという仕事
現役Web ディレクターに聞く Webディレクターという仕事現役Web ディレクターに聞く Webディレクターという仕事
現役Web ディレクターに聞く Webディレクターという仕事masaki sukeda
 
Webディレクターの実績を可視化する方法
Webディレクターの実績を可視化する方法Webディレクターの実績を可視化する方法
Webディレクターの実績を可視化する方法Yasuji Takase
 
ディレクターが身につけておきたいチームビルディング
ディレクターが身につけておきたいチームビルディングディレクターが身につけておきたいチームビルディング
ディレクターが身につけておきたいチームビルディングeriko yamada
 
Web制作者に向けた学習セルフマネジメントのすすめ(現状を把握する)
Web制作者に向けた学習セルフマネジメントのすすめ(現状を把握する)Web制作者に向けた学習セルフマネジメントのすすめ(現状を把握する)
Web制作者に向けた学習セルフマネジメントのすすめ(現状を把握する)Mariko Hayashi
 
あなたの価値を高めるWebアクセシビリティ
あなたの価値を高めるWebアクセシビリティあなたの価値を高めるWebアクセシビリティ
あなたの価値を高めるWebアクセシビリティ力也 伊原
 
GREE Creators Meetup_Closing
GREE Creators Meetup_ClosingGREE Creators Meetup_Closing
GREE Creators Meetup_ClosingSatoru MURAKOSHI
 
凡人のための論理設計アプローチ
凡人のための論理設計アプローチ凡人のための論理設計アプローチ
凡人のための論理設計アプローチYasuji Takase
 
【0からのディレクション講座:運用編】Vol3 中村健太のスライド
【0からのディレクション講座:運用編】Vol3 中村健太のスライド【0からのディレクション講座:運用編】Vol3 中村健太のスライド
【0からのディレクション講座:運用編】Vol3 中村健太のスライドKenta Nakamura
 
0からのウェブディレクション講座:制作・開発編 ver 3.00
0からのウェブディレクション講座:制作・開発編 ver 3.000からのウェブディレクション講座:制作・開発編 ver 3.00
0からのウェブディレクション講座:制作・開発編 ver 3.00Yusuke Kojima
 
0からのwebディレクション講座 製作・開発編5.0
0からのwebディレクション講座 製作・開発編5.00からのwebディレクション講座 製作・開発編5.0
0からのwebディレクション講座 製作・開発編5.0Kazuki Iwai
 
WEBディレクターとは?
WEBディレクターとは?WEBディレクターとは?
WEBディレクターとは?mishikawa
 
groundwork-pasona-tech
groundwork-pasona-techgroundwork-pasona-tech
groundwork-pasona-techmasaaki komori
 
20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)Kenta Nakamura
 

La actualidad más candente (20)

0からのwebディレクション講座 福岡 設計編_150117
0からのwebディレクション講座 福岡 設計編_1501170からのwebディレクション講座 福岡 設計編_150117
0からのwebディレクション講座 福岡 設計編_150117
 
Web制作 あとで揉めないための確認のポイント
Web制作 あとで揉めないための確認のポイントWeb制作 あとで揉めないための確認のポイント
Web制作 あとで揉めないための確認のポイント
 
ディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルールディレクターが知っておくべき3つのデザインディレクションのルール
ディレクターが知っておくべき3つのデザインディレクションのルール
 
Webディレクション講座 - 初級編 -
Webディレクション講座  - 初級編 -Webディレクション講座  - 初級編 -
Webディレクション講座 - 初級編 -
 
ウェブディレクションの基礎(第1回:設計編) 先生:高瀬 康次
ウェブディレクションの基礎(第1回:設計編) 先生:高瀬 康次ウェブディレクションの基礎(第1回:設計編) 先生:高瀬 康次
ウェブディレクションの基礎(第1回:設計編) 先生:高瀬 康次
 
現役Web ディレクターに聞く Webディレクターという仕事
現役Web ディレクターに聞く Webディレクターという仕事現役Web ディレクターに聞く Webディレクターという仕事
現役Web ディレクターに聞く Webディレクターという仕事
 
Webディレクターの実績を可視化する方法
Webディレクターの実績を可視化する方法Webディレクターの実績を可視化する方法
Webディレクターの実績を可視化する方法
 
ディレクターが身につけておきたいチームビルディング
ディレクターが身につけておきたいチームビルディングディレクターが身につけておきたいチームビルディング
ディレクターが身につけておきたいチームビルディング
 
Web制作者に向けた学習セルフマネジメントのすすめ(現状を把握する)
Web制作者に向けた学習セルフマネジメントのすすめ(現状を把握する)Web制作者に向けた学習セルフマネジメントのすすめ(現状を把握する)
Web制作者に向けた学習セルフマネジメントのすすめ(現状を把握する)
 
あなたの価値を高めるWebアクセシビリティ
あなたの価値を高めるWebアクセシビリティあなたの価値を高めるWebアクセシビリティ
あなたの価値を高めるWebアクセシビリティ
 
GREE Creators Meetup_Closing
GREE Creators Meetup_ClosingGREE Creators Meetup_Closing
GREE Creators Meetup_Closing
 
凡人のための論理設計アプローチ
凡人のための論理設計アプローチ凡人のための論理設計アプローチ
凡人のための論理設計アプローチ
 
【0からのディレクション講座:運用編】Vol3 中村健太のスライド
【0からのディレクション講座:運用編】Vol3 中村健太のスライド【0からのディレクション講座:運用編】Vol3 中村健太のスライド
【0からのディレクション講座:運用編】Vol3 中村健太のスライド
 
0からのウェブディレクション講座:制作・開発編 ver 3.00
0からのウェブディレクション講座:制作・開発編 ver 3.000からのウェブディレクション講座:制作・開発編 ver 3.00
0からのウェブディレクション講座:制作・開発編 ver 3.00
 
20150806_UXnama_Goodpatch
20150806_UXnama_Goodpatch20150806_UXnama_Goodpatch
20150806_UXnama_Goodpatch
 
0からのwebディレクション講座 製作・開発編5.0
0からのwebディレクション講座 製作・開発編5.00からのwebディレクション講座 製作・開発編5.0
0からのwebディレクション講座 製作・開発編5.0
 
WEBディレクターとは?
WEBディレクターとは?WEBディレクターとは?
WEBディレクターとは?
 
20150404 講演資料
20150404 講演資料20150404 講演資料
20150404 講演資料
 
groundwork-pasona-tech
groundwork-pasona-techgroundwork-pasona-tech
groundwork-pasona-tech
 
20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)20140913 ディレクション講演資料(山盛り)
20140913 ディレクション講演資料(山盛り)
 

Destacado

ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識
ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識
ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識Tsutomu Sogitani
 
お金をかけないランディングページのつくりかた
お金をかけないランディングページのつくりかたお金をかけないランディングページのつくりかた
お金をかけないランディングページのつくりかたSatoru Yamamoto
 
株式会社LIGを事例に学ぶ、実践的アクセス解析
株式会社LIGを事例に学ぶ、実践的アクセス解析株式会社LIGを事例に学ぶ、実践的アクセス解析
株式会社LIGを事例に学ぶ、実践的アクセス解析webcampusschoo
 
Sexyなリスティング広告プレイヤーになるために…
Sexyなリスティング広告プレイヤーになるために…Sexyなリスティング広告プレイヤーになるために…
Sexyなリスティング広告プレイヤーになるために…Keiji Abe
 
WordPress を使いこなそう
WordPress を使いこなそうWordPress を使いこなそう
WordPress を使いこなそうWataru OKAMOTO
 
もうやりきったと思ってませんか?まだまだやれるEFO-マルチデバイス時代のウェブフォーム顧客体験最適化
もうやりきったと思ってませんか?まだまだやれるEFO-マルチデバイス時代のウェブフォーム顧客体験最適化もうやりきったと思ってませんか?まだまだやれるEFO-マルチデバイス時代のウェブフォーム顧客体験最適化
もうやりきったと思ってませんか?まだまだやれるEFO-マルチデバイス時代のウェブフォーム顧客体験最適化tanakayoshikif-code
 
コンテンツ マーケティング革命
コンテンツ マーケティング革命コンテンツ マーケティング革命
コンテンツ マーケティング革命Tactus Associates
 
コンテンツマーケティングの正しい活用方法 心を動かすオウンドメディアのつくり方 Ver.02
コンテンツマーケティングの正しい活用方法 心を動かすオウンドメディアのつくり方 Ver.02コンテンツマーケティングの正しい活用方法 心を動かすオウンドメディアのつくり方 Ver.02
コンテンツマーケティングの正しい活用方法 心を動かすオウンドメディアのつくり方 Ver.02INFOBAHN.inc(株式会社インフォバーン)
 
ユーザエクスペリエンスを正しく理解する-UXとUXデザイン
ユーザエクスペリエンスを正しく理解する-UXとUXデザインユーザエクスペリエンスを正しく理解する-UXとUXデザイン
ユーザエクスペリエンスを正しく理解する-UXとUXデザインMasaya Ando
 
クックパッドのグロースハックについて 20140218 ver1.1(更新版)
クックパッドのグロースハックについて 20140218 ver1.1(更新版)クックパッドのグロースハックについて 20140218 ver1.1(更新版)
クックパッドのグロースハックについて 20140218 ver1.1(更新版)Kato Kyosuke
 
リスティング広告の為のデータフィード勉強会
リスティング広告の為のデータフィード勉強会リスティング広告の為のデータフィード勉強会
リスティング広告の為のデータフィード勉強会Keiji Abe
 
LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜典子 松本
 
有名サイトのGrowth hackテクニック色々〜Quora、facebook、twitterなど〜
有名サイトのGrowth hackテクニック色々〜Quora、facebook、twitterなど〜有名サイトのGrowth hackテクニック色々〜Quora、facebook、twitterなど〜
有名サイトのGrowth hackテクニック色々〜Quora、facebook、twitterなど〜Kazuhide Harada
 
「アクセス解析思考の磨き方」CSS Nite LP, Disk 19
「アクセス解析思考の磨き方」CSS Nite LP, Disk 19「アクセス解析思考の磨き方」CSS Nite LP, Disk 19
「アクセス解析思考の磨き方」CSS Nite LP, Disk 19Yasuki Ichishima
 
200以上のwebサービス事例から見えてきた鉄板グロースハック ~傾向と対策~ 先生:須藤 憲司
200以上のwebサービス事例から見えてきた鉄板グロースハック ~傾向と対策~ 先生:須藤 憲司200以上のwebサービス事例から見えてきた鉄板グロースハック ~傾向と対策~ 先生:須藤 憲司
200以上のwebサービス事例から見えてきた鉄板グロースハック ~傾向と対策~ 先生:須藤 憲司schoowebcampus
 
Wo! vol.23 米Coca-Colaサイトにみるコンテンツ・マーケティング
Wo! vol.23 米Coca-Colaサイトにみるコンテンツ・マーケティングWo! vol.23 米Coca-Colaサイトにみるコンテンツ・マーケティング
Wo! vol.23 米Coca-Colaサイトにみるコンテンツ・マーケティングthinkjam.Inc.
 
コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意Yasuhisa Hasegawa
 

Destacado (20)

SEOに効くコンテンツの作り方 ver1.1
SEOに効くコンテンツの作り方 ver1.1SEOに効くコンテンツの作り方 ver1.1
SEOに効くコンテンツの作り方 ver1.1
 
ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識
ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識
ビジネスマン必見!キレイな提案書を作るためのデザインの基礎知識
 
お金をかけないランディングページのつくりかた
お金をかけないランディングページのつくりかたお金をかけないランディングページのつくりかた
お金をかけないランディングページのつくりかた
 
カヤックコピー部のコピー講座
カヤックコピー部のコピー講座カヤックコピー部のコピー講座
カヤックコピー部のコピー講座
 
株式会社LIGを事例に学ぶ、実践的アクセス解析
株式会社LIGを事例に学ぶ、実践的アクセス解析株式会社LIGを事例に学ぶ、実践的アクセス解析
株式会社LIGを事例に学ぶ、実践的アクセス解析
 
Sexyなリスティング広告プレイヤーになるために…
Sexyなリスティング広告プレイヤーになるために…Sexyなリスティング広告プレイヤーになるために…
Sexyなリスティング広告プレイヤーになるために…
 
WordPress を使いこなそう
WordPress を使いこなそうWordPress を使いこなそう
WordPress を使いこなそう
 
もうやりきったと思ってませんか?まだまだやれるEFO-マルチデバイス時代のウェブフォーム顧客体験最適化
もうやりきったと思ってませんか?まだまだやれるEFO-マルチデバイス時代のウェブフォーム顧客体験最適化もうやりきったと思ってませんか?まだまだやれるEFO-マルチデバイス時代のウェブフォーム顧客体験最適化
もうやりきったと思ってませんか?まだまだやれるEFO-マルチデバイス時代のウェブフォーム顧客体験最適化
 
コンテンツ マーケティング革命
コンテンツ マーケティング革命コンテンツ マーケティング革命
コンテンツ マーケティング革命
 
コンテンツマーケティングの正しい活用方法 心を動かすオウンドメディアのつくり方 Ver.02
コンテンツマーケティングの正しい活用方法 心を動かすオウンドメディアのつくり方 Ver.02コンテンツマーケティングの正しい活用方法 心を動かすオウンドメディアのつくり方 Ver.02
コンテンツマーケティングの正しい活用方法 心を動かすオウンドメディアのつくり方 Ver.02
 
ユーザエクスペリエンスを正しく理解する-UXとUXデザイン
ユーザエクスペリエンスを正しく理解する-UXとUXデザインユーザエクスペリエンスを正しく理解する-UXとUXデザイン
ユーザエクスペリエンスを正しく理解する-UXとUXデザイン
 
クックパッドのグロースハックについて 20140218 ver1.1(更新版)
クックパッドのグロースハックについて 20140218 ver1.1(更新版)クックパッドのグロースハックについて 20140218 ver1.1(更新版)
クックパッドのグロースハックについて 20140218 ver1.1(更新版)
 
リスティング広告の為のデータフィード勉強会
リスティング広告の為のデータフィード勉強会リスティング広告の為のデータフィード勉強会
リスティング広告の為のデータフィード勉強会
 
コンテンツ作りの三原則
コンテンツ作りの三原則コンテンツ作りの三原則
コンテンツ作りの三原則
 
LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜LPデザインに関して〜作成のセオリーとコツ〜
LPデザインに関して〜作成のセオリーとコツ〜
 
有名サイトのGrowth hackテクニック色々〜Quora、facebook、twitterなど〜
有名サイトのGrowth hackテクニック色々〜Quora、facebook、twitterなど〜有名サイトのGrowth hackテクニック色々〜Quora、facebook、twitterなど〜
有名サイトのGrowth hackテクニック色々〜Quora、facebook、twitterなど〜
 
「アクセス解析思考の磨き方」CSS Nite LP, Disk 19
「アクセス解析思考の磨き方」CSS Nite LP, Disk 19「アクセス解析思考の磨き方」CSS Nite LP, Disk 19
「アクセス解析思考の磨き方」CSS Nite LP, Disk 19
 
200以上のwebサービス事例から見えてきた鉄板グロースハック ~傾向と対策~ 先生:須藤 憲司
200以上のwebサービス事例から見えてきた鉄板グロースハック ~傾向と対策~ 先生:須藤 憲司200以上のwebサービス事例から見えてきた鉄板グロースハック ~傾向と対策~ 先生:須藤 憲司
200以上のwebサービス事例から見えてきた鉄板グロースハック ~傾向と対策~ 先生:須藤 憲司
 
Wo! vol.23 米Coca-Colaサイトにみるコンテンツ・マーケティング
Wo! vol.23 米Coca-Colaサイトにみるコンテンツ・マーケティングWo! vol.23 米Coca-Colaサイトにみるコンテンツ・マーケティング
Wo! vol.23 米Coca-Colaサイトにみるコンテンツ・マーケティング
 
コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意コンテンツで改善する UI デザインの極意
コンテンツで改善する UI デザインの極意
 

Similar a 0からのウェブディレクション講座:設計編 v5.3

2004チームspec_紹介資料
2004チームspec_紹介資料2004チームspec_紹介資料
2004チームspec_紹介資料masaki sukeda
 
はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験Daichi Aoki
 
デザイン屋なりにいろんな人を応援してみた結果
デザイン屋なりにいろんな人を応援してみた結果デザイン屋なりにいろんな人を応援してみた結果
デザイン屋なりにいろんな人を応援してみた結果Kazunori Tateyama
 
重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱Yuya Toida
 
0からのウェブディレクション講座:制作・開発編 V02.01
0からのウェブディレクション講座:制作・開発編 V02.010からのウェブディレクション講座:制作・開発編 V02.01
0からのウェブディレクション講座:制作・開発編 V02.01Yusuke Kojima
 
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロYoshiaki Kaneda
 
0からのwebディレクション講座 製作・開発編4.0
0からのwebディレクション講座 製作・開発編4.00からのwebディレクション講座 製作・開発編4.0
0からのwebディレクション講座 製作・開発編4.0Kazuki Iwai
 
0からのWebディレクション for Students 3月講義 WBS編
0からのWebディレクション for Students 3月講義 WBS編0からのWebディレクション for Students 3月講義 WBS編
0からのWebディレクション for Students 3月講義 WBS編Takehiko Goshi
 
0 d4s 20140323_共有用
0 d4s 20140323_共有用0 d4s 20140323_共有用
0 d4s 20140323_共有用Takehiko Goshi
 
SPEC - 人と組織のスペックをあげていこう支援
SPEC - 人と組織のスペックをあげていこう支援SPEC - 人と組織のスペックをあげていこう支援
SPEC - 人と組織のスペックをあげていこう支援masaki sukeda
 
ポートフォリオ公開後のマーケティング法
ポートフォリオ公開後のマーケティング法ポートフォリオ公開後のマーケティング法
ポートフォリオ公開後のマーケティング法schoowebcampus
 
【横浜型リビングラボ】子育てママ☆リビングラボの事例紹介
【横浜型リビングラボ】子育てママ☆リビングラボの事例紹介【横浜型リビングラボ】子育てママ☆リビングラボの事例紹介
【横浜型リビングラボ】子育てママ☆リビングラボの事例紹介Takashi Fujimoto
 
小さなPDCAの回し方と才流から学ぶBtoBサイト運用
小さなPDCAの回し方と才流から学ぶBtoBサイト運用小さなPDCAの回し方と才流から学ぶBtoBサイト運用
小さなPDCAの回し方と才流から学ぶBtoBサイト運用ssuser1f3c8d
 
230615_ApparelNight_アダストリアさま.pdf
230615_ApparelNight_アダストリアさま.pdf230615_ApparelNight_アダストリアさま.pdf
230615_ApparelNight_アダストリアさま.pdfriehashimoto3
 
About Design Manager
About Design ManagerAbout Design Manager
About Design ManagerMarino Yokoi
 
ポジティブ・ライティング講座 / 第4回オウンドメディア勉強会
ポジティブ・ライティング講座 / 第4回オウンドメディア勉強会ポジティブ・ライティング講座 / 第4回オウンドメディア勉強会
ポジティブ・ライティング講座 / 第4回オウンドメディア勉強会鈴木 健介
 
2016/11/16セキビズ ビジネスブログ講座(ポエジー・オカビズ水野)
2016/11/16セキビズ ビジネスブログ講座(ポエジー・オカビズ水野)2016/11/16セキビズ ビジネスブログ講座(ポエジー・オカビズ水野)
2016/11/16セキビズ ビジネスブログ講座(ポエジー・オカビズ水野)Keysuke Mizuno
 
VC側からみたアドテク最前線
VC側からみたアドテク最前線VC側からみたアドテク最前線
VC側からみたアドテク最前線直彦 波多江
 
IxD of AWA - インタラクションの考え方
IxD of AWA - インタラクションの考え方IxD of AWA - インタラクションの考え方
IxD of AWA - インタラクションの考え方hidetoshi murohashi
 

Similar a 0からのウェブディレクション講座:設計編 v5.3 (20)

2004チームspec_紹介資料
2004チームspec_紹介資料2004チームspec_紹介資料
2004チームspec_紹介資料
 
はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験はじめてのLeanUXから学んだ実体験
はじめてのLeanUXから学んだ実体験
 
デザイン屋なりにいろんな人を応援してみた結果
デザイン屋なりにいろんな人を応援してみた結果デザイン屋なりにいろんな人を応援してみた結果
デザイン屋なりにいろんな人を応援してみた結果
 
重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱重要なのはリサーチ・プランニング・プロトタイプの三本柱
重要なのはリサーチ・プランニング・プロトタイプの三本柱
 
0からのウェブディレクション講座:制作・開発編 V02.01
0からのウェブディレクション講座:制作・開発編 V02.010からのウェブディレクション講座:制作・開発編 V02.01
0からのウェブディレクション講座:制作・開発編 V02.01
 
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
ワンカレ|フリーランスWebディレクターから見た”クリエイティブ”と”ビジネス”の使いドコロ・落としドコロ
 
0からのwebディレクション講座 製作・開発編4.0
0からのwebディレクション講座 製作・開発編4.00からのwebディレクション講座 製作・開発編4.0
0からのwebディレクション講座 製作・開発編4.0
 
0からのWebディレクション for Students 3月講義 WBS編
0からのWebディレクション for Students 3月講義 WBS編0からのWebディレクション for Students 3月講義 WBS編
0からのWebディレクション for Students 3月講義 WBS編
 
0 d4s 20140323_共有用
0 d4s 20140323_共有用0 d4s 20140323_共有用
0 d4s 20140323_共有用
 
SPEC - 人と組織のスペックをあげていこう支援
SPEC - 人と組織のスペックをあげていこう支援SPEC - 人と組織のスペックをあげていこう支援
SPEC - 人と組織のスペックをあげていこう支援
 
1840
18401840
1840
 
ポートフォリオ公開後のマーケティング法
ポートフォリオ公開後のマーケティング法ポートフォリオ公開後のマーケティング法
ポートフォリオ公開後のマーケティング法
 
【横浜型リビングラボ】子育てママ☆リビングラボの事例紹介
【横浜型リビングラボ】子育てママ☆リビングラボの事例紹介【横浜型リビングラボ】子育てママ☆リビングラボの事例紹介
【横浜型リビングラボ】子育てママ☆リビングラボの事例紹介
 
小さなPDCAの回し方と才流から学ぶBtoBサイト運用
小さなPDCAの回し方と才流から学ぶBtoBサイト運用小さなPDCAの回し方と才流から学ぶBtoBサイト運用
小さなPDCAの回し方と才流から学ぶBtoBサイト運用
 
230615_ApparelNight_アダストリアさま.pdf
230615_ApparelNight_アダストリアさま.pdf230615_ApparelNight_アダストリアさま.pdf
230615_ApparelNight_アダストリアさま.pdf
 
About Design Manager
About Design ManagerAbout Design Manager
About Design Manager
 
ポジティブ・ライティング講座 / 第4回オウンドメディア勉強会
ポジティブ・ライティング講座 / 第4回オウンドメディア勉強会ポジティブ・ライティング講座 / 第4回オウンドメディア勉強会
ポジティブ・ライティング講座 / 第4回オウンドメディア勉強会
 
2016/11/16セキビズ ビジネスブログ講座(ポエジー・オカビズ水野)
2016/11/16セキビズ ビジネスブログ講座(ポエジー・オカビズ水野)2016/11/16セキビズ ビジネスブログ講座(ポエジー・オカビズ水野)
2016/11/16セキビズ ビジネスブログ講座(ポエジー・オカビズ水野)
 
VC側からみたアドテク最前線
VC側からみたアドテク最前線VC側からみたアドテク最前線
VC側からみたアドテク最前線
 
IxD of AWA - インタラクションの考え方
IxD of AWA - インタラクションの考え方IxD of AWA - インタラクションの考え方
IxD of AWA - インタラクションの考え方
 

0からのウェブディレクション講座:設計編 v5.3

  • 1. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 1 0からのWebディレクション講座 設計編 version5.3
  • 2. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 2 氏名 高瀬 康次(タカセ ヤスジ) 略歴 2000年頃にウェブ制作の技術を独学で習得し、個人 で制作を受託するなどして活動。 その後、不動産と広告の業界で営業職を経験し、2006 年にウェブディレクターに転身。 2008年にフリーランスとして独立し、デジタルマー ケティングオフィスDCHSを設立。 2013年より日本ディレクション協会に参画し、主に 講師として活動。 2014年より株式会社BITAに所属し、某大手就職情報 サイトの制作ディレクションを担当している。 2015年1月より、日本ディレクション協会デジタル マーケティング推進室の室長に就任。
  • 3. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 3
  • 4. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 ここから本題 4
  • 5. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 5 まえがき ウェブに関する用語については、概念的なものが多く、常に諸説あり、 人により、意味が全く異なることがあります。 本講における各用語の使い方は、講師である高瀬の主観、および経験に 基づいて定義されており、実際の業務の場において扱いやすいよう、あ えて狭義的に用いていることが多くあります。 本講義を受講される方には、ご自身の理解、または職場での用法に置き 換えていただき、ご理解くださいますようお願いいたします。
  • 6. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 ウェブディレクターって何者? 6
  • 7. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 7 ウェブディレクターの主な仕事 要件 と 人員 と 工期 とを統括し、
 その 進行管理 をする人です。
  • 8. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 8 ウェブディレクターの主な仕事 ? 何をやるのか ? 誰がやるのか ? いつやるのか 要件 と 人員 と 工期 とを統括し、
 その 進行管理 をする人です。
  • 9. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 9 オーケストラにおける
 指揮者 建設現場における
 現場監督
  • 10. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 10 ウェブディレクションの流れ ①設計 ②構築 ③運用
  • 11. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 11 本日のテーマ ①設計 ②構築 ③運用
  • 12. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 ウェブにおける設計とは何か? 12
  • 13. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 13 ウェブにおける設計とは何か? ? 何をやるのか ? 誰がやるのか ? いつやるのか 要件 その 要件
  • 14. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 14 何のために設計をするのか? 動感 インプット アウトプット Feel Action
  • 15. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 15 何のために設計をするのか? ウェブサイトにおける設計とは、 ユーザーの「感動を設計」すること。
  • 16. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 16 設計のステップ ①情報設計 ②仕様設計 主に戦術面の設計を行います。 ワイヤーフレーム、外部設計 など 主に戦略面の設計を行います。 コンセプトワーク、マーケティングプラン など
  • 17. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 情報設計 17
  • 18. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 18 カスタマーの定義(ペルソナモデル) Domain(分類・区分) Mind(意識・性格) Behavior(行動・習慣)Visual(外見・服装) Customer(人物) ? カスタマーはどのような人物なのか? カスタマーの人物像を、
 具体的に想定する。
  • 19. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 19 バリューの定義(ポジションマップ) Value(価値) ? カスタマーにとっての価値は何か? Position(優位性) 競合のサービスと比較して、
 目指すポジションを明確にする。
  • 20. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 20 ゴールの定義(KPI/KGI) Goal(KGI) ? 最終的に達成したい目標は何か? Step(KPI) 目標を達成するために、
 積み上げるべき数値を設定する。
  • 21. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 21 ミッションの定義(スローガン) Customer(人物) Goal(KGI)Value(価値) カスタマーは
 どのような人物なのか? カスタマーにとっての
 価値は何か? 最終的に達成したい
 目標は何か? Mission(Slogan) 共通理念として掲げる言葉
  • 22. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 設計してみた 恋愛編 22
  • 23. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 23 エロ偉い人が大事なことを言っていました。 マーケティングとは、恋愛である。
  • 24. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 24 恋愛における登場人物 オレ アイツら あの娘 恋敵 片想い 片想い
  • 25. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 25 マーケットにおける登場人物(3C) 自社 Company 競合 Competitor 顧客 Customer 商売敵 訴求 訴求
  • 26. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 26 背景/課題/目的 気になるあの子は同期入社のマドンナ。
 昨年末、彼氏に浮気して別れて以来、ひとりでいるらしい。
 入社して2年、最近仕事の壁にぶつかっていて悩んでいるみたいだ。 あの子を狙っているのはオレだけじゃない。
 ひとりは同期入社の脳筋野郎、
 もうひとりは彼女と同じ部署の主任で、クールなスポーツマンだ。 最近、あの子は知的で渋いあの上司が気になっているみたいだけど、
 彼には奥さんがいるから、オレにもまだチャンスがあるはずだ。 なんとしてもあの子の気を惹いて、恋人にするんだ!
  • 27. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 27 カスタマーの定義(ペルソナモデル) Domain(分類・区分) Mind(意識・性格) Behavior(行動・習慣)Visual(外見・服装) Customer(人物) ? 新卒入社2年目、23歳、女性、
 彼氏なし、営業職、年収250万円 和やかなムードが好き、勉強家、 問題を抱え込みがち 黒髪、ポニーテール、メガネ 世話好き、
 人の話を聞くときはもの凄く目を見る 根が明るく、まじめで、物事を真剣に考える人
  • 28. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 オレ上司 28 バリューの定義(ポジションマップ) Value(価値) ? クール ファニー インテリジェンス スポーツマン Position(優位性) 主任 同期 悩みを吹き飛ばし、笑顔の絶えない日々
  • 29. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 29 ゴールの定義(KPI/KGI) Goal(KGI) ? Step(KPI) Lineトーク:50件/day  ↓ Line通話:2件/Week  ↓ デート:2回/Month 交際の承諾:1件
  • 30. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 30 ミッションの定義(スローガン) Customer(人物) Goal(KGI)Value(価値) Mission(Slogan) 根が明るく、まじめで、 物事を真剣に考える人 悩みを吹き飛ばし、
 笑顔の絶えない日々 交際の承諾:1件 頼りがい!遊びがい!安心と楽しさの相乗効果!
  • 31. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 設計してみた ウォッチブランド編 31
  • 32. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 32 背景/課題/目的 参加者にのみ公開
  • 33. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 33 バリューの定義(ポジションマップ) 参加者にのみ公開
  • 34. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 34 カスタマーの定義(ペルソナモデル) 参加者にのみ公開
  • 35. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 35 施策 参加者にのみ公開
  • 36. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 36 ゴールの定義(KPI/KGI) 参加者にのみ公開
  • 37. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 37 ミッションの定義(スローガン) 参加者にのみ公開
  • 38. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 仕様設計 38
  • 39. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 39 仕様設計において重視すべきこと 1秒の追求
  • 40. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 40 1秒でサイトの価値を伝える① description title og: title og: image og: description メタ情報は、集客導線上、非常に重要な役割を担っています。
  • 41. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 41 1秒でサイトの価値を伝える② タグライン サイトの機能やメリット を簡潔な文言で紹介する ものです。 キービジュアル 近い将来像を、ビジュア ルで具体的に伝える役割 をもつものです。 ナビゲーション サイトの機能や得られる 情報を単語レベルの文言 で伝えるものです。 ファーストビューは、ユーザーの興味を最大化する最重要ポイントです。
  • 42. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 42 1秒で進路を伝える ユーザーの属性別ナビゲーション クレジットリンク(信頼性を担保するナビゲーション) ユーザーの興味別
 ナビゲーション ナビゲーションのグルーピングにより、自然な理解を促します。
  • 43. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 43 1秒で目的地へ導く サイトマップは階層を浅くシンプルな構造にします。
  • 44. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 44 1秒で内容の理解を得る コンテンツのグルーピングにより、自然な理解を促します。 A-① / B-①
 タイトルエリア A-③、B-⑥
 コンタクトエリア B-④
 セールスエリア B-⑤
 サービスエリア A-① / B-②
 ステータスエリア B-③
 ナビゲーションエリア
  • 45. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 45 でも一番大事なのは Customer Value Goal
  • 46. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 46 ワイヤーフレームを学ぶなら!
  • 47. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 情報設計
 ワークショップ 47
  • 48. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 48 お題 参加者にのみ公開
  • 49. (C) 2015 DCHS / CONFIDENTIAL 0からのウェブディレクション講座 設計編 おわり 49