2014.08
www.infobahn.co.jp
ディレクターが
知っておくべき
のルール
企画・コンテンツ・デザイン は 一心同体!
デザインディレクション
1
企画・制作:上原潤子
2
デザインディレクションが
できなきゃいけない理由 6
デザインディレクションの肝 !?
「記憶の編集力」の磨き方 2STEP
それじゃー 伝わらない
デザインディレクションの
「見直しポイント」4
6
な
ん
て
言
っ
て
る
場
合
じ
ゃ
な
い
デ
ザ
イ
ン
デ
ィ
レ
ク
シ
ョ
ン
が
で
き
な
き
ゃ
い
け
な
い
理
由
3
人は 9割
WEBも
理由
その1
2
4
理由
その2
でもWEBのクオリティは
デザイナーをはじめ制作パートナーに依存せず
ディレクターの責任において担保しなければ!
毎度プレッシャーですよね、修行ですよね(切) 5
WEBの 2大要素
コピー。コピー。コピー。
コピー。コピー。コピー。
コピー。コピー。コピー。
コピー。コピー。コピー。
コピー。コピー。コピー。
コピー。コピー。コピー。
コピー。コピー。コピー。
コピー。コピー。コピー。
コピー。コピー。コピー。
コピー。コピー。コピー。
デザ
イン
デザ
イン
デザ
イン
デザ
イン
〇
自分でも
なんとか
できる ×
自分では
なんとも
し難い
理由
その3
6
納品物であり
自分の
ポートフォリオ
でもあり
自分の
ポートフォリオ
でもあり
ディレクションしたWEBは
理由
その4
7
理由
その5
作 る = 記憶の編集
作れる
モノ
コト
好きな
モノ
コト
自分のスタイルが
できてくる♪
=
好きな仕事が
できる・くる
ようになる♪♪
仕事が楽しく
なる♪♪♪
なぜなら
8
理由
その5
作 る = 記憶の編集
作れる
モノ
コト
好きな
モノ
コト
自分のスタイルが
できてくる♪
=
好きな仕事が
できる・くる
ようになる♪♪
仕事が楽しく
なる♪♪♪
だから
つまり
9
理由
その5
作 る = 記憶の編集
作れる
モノ
コト
好きな
モノ
コト
自分のスタイルが
できてくる♪
=
好きな仕事が
できる・くる
ようになる♪♪
仕事が楽しく
なる♪♪♪
だから
つまり
言わずもがな
WEBのあるべき方向性や
クライアントの好みが
自分のそれと
あわない場合は
プロとして律すること
いえむしろ
新境地開拓!
と前向きに
チャレンジ!
10
企画でもあり
構成でもあり
編集でもある
デザインディレクション
とは、単なる飾りつけではなく
つまり
誰が
デザイン
するか
が、実は同じくらい大切!
=
誰が
ディレクション
するか
どう どう
企画は
具現化
できなければ
ただの
思いつき
理由
その6
企画段階から
デザイナーはじめ
制作パートナーと
ディスカッション
することも大切
11
デ
ザ
イ
ン
デ
ィ
レ
ク
シ
ョ
ン
の
肝
「
記
憶
の
編
集
力
」
の
磨
き
方
2 !?
12
STEP
1
記憶の
蓄積
好きな
モノやコト
を、たくさん見つける
13
STEP
2
記憶の
編集
= 自分の アイデア や ノウハウ になる
好き! いい! と思ったモノやコトが
なぜいいのか? 分析 する
どう提案されたのか? 想像する
14
通勤中、電車やバスで気になった中吊り広告に
思いをめぐらせたり
突っ込みをいれたりするのも
オススメ
これ面白いー
これビミョー
かなりビミョー
honyarara♪ BUS honyarara♪ TRAIN
でも一見無関係な
組み合わせなのに
なんで?なんで?
これが面白いんです
って提案できる
面白さの
根拠ってなに?
おまけ
それでも
クライアントが
OKした理由って?
15
じ
ゃ
ー
伝
わ
ら
な
い
4
で
き
て
る
つ
も
り
…
わ
か
っ
て
る
つ
も
り
…
デ
ザ
イ
ン
デ
ィ
レ
ク
シ
ョ
ン
16
デザイナーさん選び
POINT
1
17
やりやすさ
デザイン
の
方向性
予 算
デザイナーさん選びの “基準”
18
デザインスキルが高い
デザインスキルが低い
コンテンツへの
コミットが深い
コンテンツへの
コミットが浅い
designer
A
designer
B
designer
D
“やりやすさ” マトリックス
提案型
指示まち型
designer
C
19
designer
A
ある程度の
デザイン知識がないと
ディレクションが難しい
ことも?!
具体的なイメージが
できすぎていると
モチベーションを
さげてしまう
ことも?!
具体的なイメージが
ありつつ
もっと何か違う方向が
あるんじゃないか?
と探りたい場合
ほぼ構成通りが
いい場合
具体的なイメージが
ある場合
具体的なイメージが
ある場合
意外と
上級者向け?!
育て&育てられる
いい関係から
いいパートナーに
designer
B
designer
C
designer
D
デザインスキルが高い人となら勉強できる
低い人となら自分が知恵を絞れるようになる、また切磋琢磨しあうことでいいパートナーに
だから、ABCDすべてのパートナーとのおつきあいを大切に!
デザインスキルが低い人
ではなく、あくまでも
自分にないスキルをもっている人
ということを忘れずに
コミュニケーション
20
諸々の が大切
ディレクターに
できないことが
できる人
という大前提を
忘れずに
相性
や
バランス
改めて、デザインスキルが高ければ高いほどいい!
と言うワケではありません…
このあたりは経験(数・人数)をつんで
肌感覚でつちかっていきましょう。
21
デザインの依頼の仕方
POINT
2
22
参考サイト
通りだなぁ
構成通りだなぁ
なんか違う
わかってないなぁ
デザインがあがってきた際
って、思うこと少なくないですよね?
でもちょっとまってください
それ ディレクター側の原因?! かもしれません
23
いえいえ依頼通り、ですよね?
渡したものの
どこをどう拾ってほしいか
どこをどう広げて欲しいか
を、伝えていますか?
企画主旨は伝えていますか?
構成を正しく&各要素の意図を補足
していますか?
参考サイト
通りだなぁ
構成通りだなぁ
なんか違う
わかってないなぁ
デザイナーがイメージをふくらませるための
“元“ や “バッファー“ を
渡し&伝えていますか?
24
①
企画主旨
④
構 成
②
デザインイメージ
③
競合との
イメージマトリックス
※その他、ガイドラインやレギュレーションなど
デザイン依頼 “基本セット”
25
① 企画主旨
企 画
↓
構 成
↓
デザイン
構成だけ渡すのは伝言ゲーム と同じ
企画書も共有 し、企画主旨をきちんと共有しましょう!
企 画
デザイン構 成
26
② デザインイメージ
参考サイト
A
ズバリな参考サイトを提示
手っ取り早い&確実。
ただし、
その通りに直球であがってきたり
その通りだと思われたくないと変化球であがってくることも。
その
1
参考サイト
A
イメージが近い参考サイトや
デザインTips を提示
少々手間ですが
「参考サイト通りだな…」
「無理して変化球投げてくれなくてもよかったのに…」
という双方の無駄なストレスは軽減できるやも。
その
2
配色は
こんな
感じで
こんな風に
タイトル
+アイキャッチ
を基本ルールに
して
アイキャッチは
こんな
手書き風で
27
キレイ系
カジュアル系
一般的 個性的
年齢高め
年齢低め
③ 競合とのマトリックス
競合 A社
競合 B社
競合 C社 クライアント
競合サイトとの差別化 を意識してもらう!
28
〇〇〇〇〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇
〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇 〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇
●●●
なにが
なんだか…
④ 構成 1/2
29
〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇〇〇〇〇
〇〇〇〇〇〇〇〇〇〇〇〇 〇〇〇〇〇〇
●●●
●new
●new
●new
④ 構成 2/2
正しく
わかりやすく
伝える
3コーナーの
最新コンテンツの
バナーを
自動切換表示
テイストが混在するので
フレームはデザインせず
シンプルに
メインコンテンツとなる
ファッションスナップへの
誘導口
フレームを
デザインするなどして
強調したい
左)
サブコンテンツ
インタビューコーナーへの
誘導口
イメージはプロフィール写真
になる予定
右)
サブコンテンツ
スタッフブログへの
誘導口
イメージはブログ依存
↑↑↑↑↑
構成理解のためのやりとりや
構成の説明相違による
デザイナーさんの
無駄な稼動やストレスは
極力おさえること
30
デザインフィードバック
「?」な場合
「!」な場合
POINT
3
31
まずは、基本から見直してみましょう!
「何かがおかしい…、でもなんだろう ? 」な場合
●見せ方の 強弱・優先順位が、構成とあっているか
(配置、フォントの種類・サイズ、配色等)
●配色ルール、デザインルール、アイキャッチの配置ルールが
構成とあっているか
→あっていない場合は、
ディレクターから正しく伝えられているか? まずは自分を疑う
●余白のとりかた、字下げルール、配置ルールが
統一されているか
→デザイン処理の問題なので、具体的に修正依頼する
32
単色使いのデザインにメリハリが欲しいなぁ……と思ったら
統一感があってキレイ!
なので、同じトーンで色数を増やしてカテゴリ別に使い分けたら
構成もわかりやすくなるんじゃないかと、いかがでしょう?
デザインルールがめちゃくちゃだなぁ……と思ったら
このアイキャッチとか配色がイイと思う ので
タイトルまわりにはアイキャッチ、タイトルとリードをこの配色
と デザインルールを作ったら
構成がグッとわかりやすくなるかと、いかがでしょう?
「ココが ! 」といいたい場合
ポジティブに置き換えて交渉!
直球ではなく、変化球で交渉!
33
自分を信じる!
POINT
4
34
自分が新人であろうと
デザイナーさんがベテランであろうと
あがってきたデザインに対して
「あれれ?」と思ったら
気後れせず
自分を信じてディレクション!
ディレクターとして
理想のゴールは描けているし
クライアントとも握れているし
最低限、1ユーザーとしての
視点・判断基準は
もっているはず。
ただし&もちろん
そこにたどりつくまでの
自分のディレクションに否がないか
謙虚に精査した上で。
デザインがあがってきたら
必ず第3者の意見を聞きましょう。
ターゲットに近い人、そうでない人にも。
ただし、話半分で聞くこと。
みんながOKと言わなければ
むしろOK。
自分の中でピンッとくるものがあるなら
それを信じて!
でなければ
新しいモノ・結果、自分らしさは
つくりだせないから。
そして何より
クライアントとユーザーを
最も理解しているのは
自分です。
総
監
督
で
あ
り
総
責
任
者
で
す
。
DIRECTOR
35
受
け
て
の
心
に
届
く
か
ど
う
か
大
き
く
左
右
す
る
の
は
制
作
者
の
心
づ
か
い
に
よ
る
。
企画・制作:上原潤子(コンテンツディレクター) 36
インフォバーンで
働いてみたい!
という方はこちらへ。
https://js01.jposting.net/infobahn/u/regular/job.phtml
インフォバーンに
問い合わせてみたい!
という方はこちらへ。
http://www.infobahn.co.jp/ask
採用情報
お問い合わせ
37

ディレクターが知っておくべき3つのデザインディレクションのルール