この記事では、
- 市場価値を高めるためのWebディレクタースキルを知りたい
- もっとWebディレクターとしてのスキルを高めたい
こんな人に向けた記事になっています。
【結論】Webディレクターは、マルチな能力があったほうがいい
Webディレクターはデザイナーやフロントエンジニアのように専門的知識を極めるスペシャリスト的なキャリアではありません。
だからその分、広範なスキル・知識が要求されます。
特に僕のように専門分野の職種からディレクターになっていない身からしたら特にそうです。
実際Webディレクターは資格も必要ないですし、専門知識がなくてもやっていけます。
つまり誰でもなれるくらい扉は広いです。
今回紹介するスキル・知識を身につけていくことが、イコールでディレクターとしての市場価値を高めることにつながります。
逆に不足している部分は学習を通じて、身につけていく必要があります。
Webディレクターのスキル解剖！
あくまでたかりょーの経験の中で現場で必要だと思うスキルを記載しています。
実践で感じたスキルではあるので活用はしやすいはずです。
下記の全てがあるディレクターは最強です。
完全に補いきれているわけではないですが、ある程度網羅的には記載しています、
営業的スキル（基礎的ススキル）
ここで紹介するのはWebディレクターの土台となる、営業的なスキルです。
イメージとしては「対人」と話す時の能力です。
このスキルはビジネスマンであれば、必須のスキルとなっているので、Webディレクターに限らずとも身につけていくと良いです。
コミュニケーション能力
コミュニケーション能力は、Webディレクターには必須の能力です。
なぜならば、社内外のさまざまな関係者とやりとりする機会が非常に多く、プロジェクトをスムーズに進行させるためには必要だからです。
なおコミュニケーション能力は
「聞く力」
「伝える力」
「読み解く力」
の３つで構成されます。それぞれ説明していきますね。
コミュニケーション能力が高い人は下記のような特徴があります。
- クライアントに伝えたい情報を齟齬なく伝えられる
- 質問能力が高い
- クライアントやメンバーのプロジェクト意欲を高められる
- 相手が話しやすいような環境を作る（→話を引き出すのが上手い）
- 共感力が高い（目の前の人が求めていることをなんとなく察することができる）
- 話をまとめるのが上手
聞く力＝傾聴力
話す力がある人ほど、スキルが高いと思われがちです。
ところが、傾聴する力こそWebディレクターでは必須の技術です。
なぜなら、クライアントから話を引き出しながら、相手への理解や共感を生むことで、信頼関係を築きやすくなるからです。
例えば、クライアントが伝えたい内容や質問の意図を正しく理解できていなかったらどうでしょうか？
「私のことを理解してくれない」「この人にWebサイトをお願いして大丈夫かな？」と不信感につながります。
特にWeb制作を依頼するクライアントはデジタルの知識に乏しい人が多く、割と僕たちプロに丸ごとおまかせ・寄りかかってくることが多いです。
だからこそ、クライアントの気持ちに寄り添いながら、彼らの事業や伝えたい内容をしっかりと把握し、それらをWebサイトでコンテンツ化して表現することで、クライアントの信頼を得ることができます。
■テクニックをご紹介！
傾聴力で必要なのは反復です。
具体的には彼らが話した後に、「このような理解で合っていますか？」などと確認すると良いです。
この確認作業が、後の認識違いが生まれないようになります。
伝える力（提案力）
Webディレクターはデザイン提案時含めて、クライアントに伝えるシーンがめちゃくちゃ多いです。
例えば、下記のような
・どのような仕様のサイト（制作メンバー、クライアント向け）
・Webサイト戦略の説明
・コンテンツの見せ方の説明（どんな強みを押していった方がいいか？）
・デザイン提案、フォント・カラーリングの理由
・仕様変更で、追加で費用がかかる点
そのためある事柄を他者に分かりやすく納得できる形で、伝える力は非常に重要です。
テクニックをご紹介！
伝える力が「何を伝えたいのか？」を常に意識するようにしましょう。
なぜなら、筋道立てて話すには「何を」＝「ゴール部分」を意識しなければ、伝え方が全く変わってしまうからですね。
そのためには事前に情報や思考を整理して、ゴール部分の「何」を伝えたいのか？をまとめておくことが大切。
そしてそのゴールに向けて、「じゃあどのように説明すると説得力が増すのかな？」を考えながら話の筋道たてていくのです。
質問力
質問力は、簡単にいえば引き出す力だと考えてください。
質問力が高いと、質のいい情報を引き出すことができます。
クライアントの製品やサービスの強みや特徴を引き出すには必須のスキルです。
実際、質問力が低いディレクターだと、会社の魅力を引き出せてなくて、コンテンツを作る際にありきたりな内容になりがちです。
テクニックをご紹介！
なぜこのサービスが生まれたのか？という深い部分まで質問できるといいです。
聞き方と角度が大事。
トラブル解決力
Webディレクターの仕事をしていると、トラブルばっかりおきます。
仕様の認識違い（最初の会議で言ってたことと違う）、修正がなおってない、テストサイトが動いてないんだけど・・・
このように問題が起きたときに、原因はなんなのか？どうやって対処するべきなのか？を考えられなければなりません。
逆にWebディレクターの腕の見せ所は問題解決力にあるといっても過言ではありません。
ファシリテーション能力
Webディレクターはあらゆる調整役です。
なので”場を仕切る”という能力は非常に重要です。
ファシリテーションと聞くと「会議で進行する役でしょ？」的なニュアンスを強く感じるかもしれませんが、ここでいうファシリテーション能力はもっと広い意味です。
つまりある議論の場で、Webサイトの多様な意見を促し、それらを整理しながら、議論を広げつつ、合意形成をサポートする能力ということです。
実際、Webサイトを制作する時に、クライアントとの話をしていると、あれを見せたい、これをしたいというケースもあります。
それに対して優先順位をつけて、「どれをやるべきか？」という部分を考えながら議論を進めていくのもファシリテーション能力になります。
マーケター的スキル（Webマーケティングスキル）
続いてマーケティングです。ここからは割と実践的な力になってきます。
ここのスキルでは実践的に必要となってくるスキルです。
このスキルを持っていると、企業の売り方・見せ方まで話ができて、成果に直結させることができる実力型のWebディレクターになれます。
そもそもマーケティングとは「企業の商品やサービスの価値を見定めて、それを見える化し、その価値を必要としているターゲットに届ける行為」のことです。
Webマーケティングスキルとは、Webの特性を踏まえた上で、マーケティングの効果を最大化していく能力のことです。
業界理解力
マーケターとしてクライアントがどの業界に属していて、どんな仕組みでビジネスが成り立っているのか？ポジション的にはどこにいるのか。どこで利益が発生するのか。
こういった業界への理解がないと、クライアントの価値の見定めて、Webサイトでどう表現していくかが分かりません。
情報を扱う力（リサーチ力と解釈力）
上記に直結してくるのが、情報収集力です。
Webディレクターは情報が命。
なぜならいつも新しい情報（業界知識やシステム、デザイン）に触れる機会がたくさんあるからです。
だからアンテナをつねに貼りながら調べる癖をつけ、最新情報をキャッチアップし、解釈する技術が必要。
ちなみにWebディレクターは情報をただ集めるだけではダメです。
情報を活かす力が求められます。
具体的に言えば、ある情報を、自らの判断材料や物事の理解に生かして、それをWebサイト内に還元できなければなりません。
ちなみに外山滋比古さんの著書『思考の整理学』には、情報には一次情報、二次情報、三次情報の３種類があります。
そしてWebディレクターは特に一次情報（事実）を要約した、二次情報を扱う技術が求められます。
抽象化能力
抽象化能力とは、「物事の本質を抜き出す力」です。
例えば会議の中で複数人が「私はこう思う」「私はこういう見方もしている」というふうに意見が錯綜するケースがあります。
こういったこんがらがった情報を、「つまり〇〇が言いたいんですよね？じゃあこういうふうにしたらどうですか？」と抽象化して、整理してあげる力が求められます。
POINT
抽象化をするには、つねに大きな視点から状況を眺める努力が必要です。
なぜなら視座を高くしておくことで、２つの悩みがあった時に、Bとは関係ないなと判断ができるからです。
抽象化能力が高いことで、クライアントのビジネスや課題を理解するスピードや正確度も一段と高まります。
SEO知識
SEO知識は絶対に必要というわけではありませんが、知っていると非常に有利に働きます。
なぜなら、どのクライアントもWebサイトを上位表示させたい気持ちがあるので、最適化の方法を知っているだけで、信頼されるからです。
ちなみに僕もSEOは割と知識を持っていて、クライアントに話してあげると「なるほどね〜」と喜ばれるケースが多いです。
Web広告知識
Web広告の知識も基礎知識おさえておけばOKです。
リスティング広告とSNS広告と純広告などの違いがわかるなど。
なお目的やターゲットをヒアリングして、どのWeb広告を使うべきかまで提案できるとなお良いです。
アナリティクス（アクセス解析力）
WEBサイトは作っただけでは終わりません。
その後運営していく必要があります。
その際、どこを改善していけばいいのか、そう言ったサイト解析ができると強いです。
データ分析・仮説立証能力もあるとなおいいです。
SNS運用
SNSは活用の仕方次第で、企業・商品のブランディングやプロモーションまでできます。
SNSごとの特性を知り（どんなターゲットに良いか）、何ができるかまでわかっていると、非常に有効なスキルとなります。
３つのクリエイタースキル
続いて実際のクリエイター的なスキルについても解説します。
クリエイタースキルには、
- ライタースキル
- デザイナースキル
- エンジニアスキル
の３つの要素があります。それぞれ解説します。
【番外編】クリエイター要素って全部必要？
「３要素とも全部持っていないといけないの？」
このような質問がきそうですが、実際全部持っていなくてもいいです。
Webディレクターとしての市場価値を上げたいのなら、上の３つの要素の中で、どれを尖らせるのか？を考えるべきでしょう。
つまり、３要素のうち、どれかの要素に特化できれば非常に市場価値の高いWebディレクターになると思っています。
ちなみに僕はライター要素が強いと思っています。
そしてWebディレクターとして活躍するには、ライター能力こそもっとも重要です。
ライティングスキル
企業・商品を魅せる力
企業や商品は「魅せ方」の角度を変えるだけで、ガラッとイメージをかえることができます。
具体的に魅せ方とは、企業の価値を深堀・整理した後に、「じゃあどうやってこの価値を見せていくか？」を考えること。
企業は長く経営を続けていれば、必ず一つや二つ、優れている点・魅力があります。
そこを見つけ出してWebサイトのコンテンツとして売り出す力が必要となります。
構成力・言語化能力（ライティングスキル）
魅せ方を考えた後に、それをどうやって構成して、言語化していくのかもライティングスキルです。
Webサイトはあくまでもデジタルコンテンツの一つなので万能ではありません。
デザイナースキル
ここでいうデザイナースキルとは、デザインを語れる知識のこと。
Webディレクターはほとんど手を動かしてデザインすることはありません。（デザイナー兼Webディレクターだと話は別ですが）
ただメンバーに対して「こういうデザインにしたい」というような要望を出したり、クライアントにデザインを説明したりする時に、求められる知識となります。
Webデザインは細かく要素分解すると下記で構成されています。
・UI・UXデザイン
・配色
つまりこれらについて、クライアントとデザイナーとある程度話ができれば十分です。
UI・UXデザイン
デザインの基礎となるのは、UI・UXデザインの知識。
Webサイトを利用するユーザーの体験を考えられるもので、このベースがなければWebサイトはただかっこいいやかわいいといった印象が先行されることになります。
具体的にどういうところに目をつけるかというと、
サボタン
メニューや目次などの一覧表示、ボタンやチェックボックスの
配色
Webデザインは基本的にベースカラー、メインカラー、アクセントカラーという３つのカラーリングで構成されます。
ベースカラーは「背景・余白」に使用することが多い。彩度は明るめにする
メインカラーは主役級のカラー。ロゴの色だったり、ユーザーに与えたい印象だったりで決めることが多いです。
アクセントカラーはメリハリをつけるため、コンバージョンポイント等目を惹きつけたいところで使うケースが多い
ちなみにWebサイトではメインカラーから考えて、ベースカラー、アクセントカラーという順番で決めることが多いです。
そして比率としては
・ベースカラー70
・メインカラー25
・アクセントカラー5
というのが一般的です。
メインカラーよりも彩度を落とした感じのサブカラーを考えたりもします。
フォント
フォントなんてなんだっていいじゃん。という人がいるかもしれませんが、実際フォントによってWebサイトの印象はめちゃくちゃ変わってきます。
いろんな参考サイトなんか見ていると、レイアウトや写真はすごいたっているのに、フォント選びが間違っていて、全体の仕上がりがいまいちなんてサイトもあるくらい
撮影ディレクション
撮影はめちゃくちゃ重要です。
写真の雰囲気で、デザインが全然異なってくるからです。
僕は割と撮影ディレクションは得意です。
撮影ディレクションはどれだけ現場でスムーズに回せて、想像しているカットを撮れるかが重要です。
エンジニアスキル
エンジニアのスキルは割と重要。
なぜならプログラムの理解がないと、クライアントやエンジニアから質問を受けたときに答えに窮してしまうらかです。←これマジです。
じゃあ具体的にどれくらい知ってればいいかというと、例えば下記ができればOK
- 自分で簡単にコードをかける（HTMLやCSSの知識）
- JavaScriptで何ができるのかの理解
- 構造化データやリッチスニペットなどSEOに必要な知識を有している
- 品質チェックするときにコーディングチェックができる
また技術の進化スピードはめちゃくちゃ早いので、開発領域における理解は、当然ディレクターの市場価値にも直結してくるので、自分でカリカリとコードをかけなくても、話ができるように学び続けていくと良いです。
話せないとクライアントから質問された時に答えに窮してしまいます。
例えば下記ができればOK
・コーディングのチェック、デバッグができる ・自分で簡単なコーディングができる ・HTML5の仕様を理解している ・CSS、JavaScriptで可能なことを理解している ・構造化データ、OGP、リッチスニペットなど、SNSやSEOで重要な要素を理解している
なのでWebサイトの仕組みを理解する意味でもこれから説明する内容はある程度おさえておいたほうがいいです。
HTML
HTML（hypertext markup language）はフロントエンドの基本中の基本でマークアップ言語です。
ブラウザでWeb ページがどのように表示されるか、その”構造部分”を記述します。
ちなみに今はHTML5なので、その仕様を理解していると強いです。
HTMLを理解していると、SEOで必要な構造化データ（Googleの検索エンジンにサイトを理解しやすいようにするタグ）を記述する際に理解があると良いです。
POINT
HTMLは、ベースとなるサイト構造を記述
キーワード
・サイトの構造化
・リッチリザルト(リッチスニペット)
CSS
CSS（Cascading Style Sheets）はWebサイトのスタイルを設定することで、サイト全体に装飾する機能のことです。
実際Webディレクターが構築することはほとんどありませんが、クライアントと話すときに
そのためある程度のCSSの仕組みを知っていなければなりません。
POINT
CSSは、ブラウザ上にサイトを表示するときの装飾部分の記述
CMS
CMS（Content Management System）はブラウザやアプリケーションから管理画面を通じて、コーディングなしでブログや記事コンテンツを更新できるようにするシステムのことです。
Webサイトはコンテンツですから、それを簡単に管理するシステムが必要になってきます。
種類としては例えば、WPやMovable typeがあります。
最近はほとんどのWebサイトではWPが使用されています。
WebディレクターがCMSの仕様と設計を考えなればなりません。
例えば、
- 入力側の設計（CMSの設計 管理画面からWebコンテンツ内のどこを編集できるかを考える、どんなカスタムフィールドを使うのか）
- 出力側の設計（動的コンテンツをどのようにWebサイト内に吐き出すのか0
です。
JavaScript
JavaScriptはWebサイトを表示するブラウザ上で動くプログラム（クライアントサイド・スクリプト） です
具体的にはHTMLやCSSに指示を出して、
JavaScriptでは特にできることを覚えていた方がいいです。
例えば下記の通り。
- Google マップ
- 画像スライダー
- エラーメッセージの表示
- ポップアップウィンドウ
- フォームに入力された項目のチェック
- ソート機能
- 検索機能 など
これらを知っておくだけで、「〇〇をしたいんだけど」とお客さんから要望があったときに、可否不可の話ができます。
ECサイト知識
最近はネットショップが増えていて、E Cサイトを構築したいというケースが増えています。
そんな時にどんなお客さんの資金ややりたいことを踏まえてECを提案するケースがあります。
BASEやらカラーミーショップやらショッピファイやら。
CMSによってできることは違うので、それぞれのサービスでどんな機能の違いがあるかは頭の中に入れておくべきです。
Webディレクターで大切なこと
デザインツールを使いこなすスキルは不要
デザインスキルというと、PhotoshopやIllustratoを使いこなせる
実際、まじで不要です。
なぜならWebディレクターは手を動かす人ではないからです。
実際に制作するのはデザイナーになるので、デザインを語れるスキルさえあればいいです。
