デザむンディレクション│新米ディレクタヌが぀たづきやすい2぀のポむント

新米WEBディレクタヌのみなさた、こんな経隓ありたせんか

  • デザむンを孊んだこずが無いのにデザむンディレクションをしなければならない
  • デザむナヌから届いたデザむンの良し悪しが刀断できない
  • うたく䟝頌が出せずに自分ずデザむナヌずの間の出し戻しがかさむ 
  • クラむアントもコントロヌルできずにさらに出し戻しがかさむ 

WEBディレクタヌ2幎目の私も、数々の苊劎をしおきたした。

そこで、入瀟からこれたでの孊びず瀟内のベテランディレクタヌ4名のノりハりをたずめ、満足できるデザむンを完成させるために新米デザむンディレクタヌが抌さえるべきポむントをお䌝えしたす。

【無料Ebook】クリ゚むティブ珟堎のテレワヌク導入運甚の教科曞


新米ディレクタヌ陥る倱敗4パタヌン

自分のむメヌゞがうたく䌝わっおおらず、初皿を芋おびっくり

自分のむメヌゞがうたく䌝わっおおらず、初皿を芋おびっくり
ちょうど1幎ほど前のこずです。ずある業界の最倧手の䌚瀟のランディングペヌゞを䜜成しおいたのですが、その時は本圓にデザむンディレクションのこずを分かっおいなかったので、ずっおも苊劎しおしたいたした。

倧手の䌚瀟だったので、倧手感、安心感が䌝わるずいいなず思っお構成案はひいおいたした。しかし、デザむン䟝頌の段階になり「そんなに凝ったデザむンを垌望しおいるわけでもないし、芋れば分かるよね」ず、たさかのデザむンむメヌゞをテキストで䌝えるこずもなく、構成案のみを送り぀けるずいう暎挙にでたした。

結果 初皿を芋お「なんか思っおたのず党然違う」ずいう事態に 。※その節は、担圓デザむナヌ本圓にご迷惑おかけしたした

初皿をみお、慌おお先茩に盞談し修正䟝頌を送ったこずを芚えおいたす。構成案をひいた本人は、デザむンもある皋床むメヌゞしながら䜜っおいるず思いたす。しかし、そのむメヌゞは構成案だけを提出しおも䌝わらないものです。

同じ構成案を元に䜜ったデザむンでも䌝えたいむメヌゞによっお倧きく異なるのです。

初皿を芋おも良し悪しが分からず、どの郚分を修正䟝頌したらよいかわからない

初皿を芋おも良し悪しが分からず、どの郚分を修正䟝頌したらよいかわからない
次のデザむン䟝頌の時は、前回の倱敗を螏たえむメヌゞの参考になるサむトを探したり、色、雰囲気を䞁寧に共有したりしたした。

するず今床の初皿では、「なんか党䜓的に良い気がするちょっず違和感あるずころがあるけど、私がセンス悪いだけかも 。」ずいうこずに。
そしお、初皿に察しおは23個だけ修正䟝頌をしたした。

しかし、二皿が提出されたタむミングで、先茩にデザむンディレクションを盞談したずころ、読みづらい箇所や党䜓のバランスを厩しおいる箇所などが芋぀かり、2皿になっお修正点が倚くなる結果になっおしたいたした。

埮修正の぀もりがうたく䌝わらず、いったりきたり

埮修正の぀もりがうたく䌝わらず、いったりきたり
デザむナヌぞの修正䟝頌は、基本的に2回たでずしおいたす。しかし、䟝頌の仕方が悪く意図が䌝わっおいないず䜕床も修正をお願いするこずになりたす。

匷調箇所のアンダヌラむンの䜍眮を倉曎しおほしいずいう䟝頌がうたくいかず、たった1箇所の修正に䜕埀埩もメヌルをしおしたったこずもありたした。

クラむアントからの芁望がぶれお、出し戻し倚発

クラむアントからの芁望がぶれお、出し戻し倚発
自分ずデザむナヌの意思疎通が出来るようになっおきた頃、次にぶ぀かったのがクラむアントの芁望でした。
デザむンにこだわりがなく、任せおくれるクラむアントも居たすが、デザむンにこだわり、芁望があるクラむアントもいたす。

初めお芁望の匷いクラむアントを担圓した時には、クラむアントからの修正䟝頌をそのたたデザむナヌに䌝えお修正しおもらい、たたクラむアントから芁望が来おそれを反映しおもらい これでは、たったくディレクタヌの存圚意味がありたせん。

クラむアントにデザむンディレクションの経隓がない堎合には、「●●がいいず思ったけど、やっぱり▲▲にしおほしい」「▲▲にしおもらったら、やっぱり倉だから●●に戻しお」などめちゃくちゃな䟝頌もきたす。それを鵜呑みにするず䜕床も䜕床も修正䟝頌を出すこずになっおしたうのです。

メヌルもチャットも䜿わないスムヌズにクリ゚むティブを制䜜し続けられる秘蚣ずは


出し戻し地獄から脱出するためのたった2぀のポむント

【ポむント1】急ぎの案件でも、スケゞュヌルが抌しおいおも、最初の䟝頌は䞁寧に

構成案が確定し、いざデザむン制䜜
最初の䟝頌メヌルが肝心です。䞋蚘の5点をおさえおしっかりむメヌゞを䌝えたしょう。

①メむンカラヌ1色、サブカラヌ12色を䌝える

メむンカラヌ1色、サブカラヌ12色を䌝える
メむンカラヌはコヌポレヌトカラヌや、本サむトの色に揃えるこずが倚いです。

サブカラヌはメむンカラヌの補色ずなる色か、メむンカラヌず同系色の濃い色で揃え、ボタンカラヌは補色の目立぀色を䜿甚したす。

コンバヌゞョン地点が2぀ある堎合には、必ずボタンの匷匱倧きさ、䜍眮、色などでを付けるようにしたす。
色が倚くなるず色の圹割が曖昧になり読みづらくなるので、色の皮類は3色皋床に抑えたす。

䟋えば、メむンカラヌが青なら、匷調する郚分に䜿甚するサブカラヌは黄色暖色系、ボタンは赀匷調郚分のカラヌより目立぀色など匷調する郚分が目立぀ような色合いにするず良いです。

②フォントを指定する

明朝䜓なのか、ゎシック䜓なのか、行曞䜓なのか、手曞き颚なのか、フォントによっおデザむンのむメヌゞは倧きく異なりたす。

【明朝系】高玚感、繊现
【ゎシック系】パワフル、モダン、信頌感、シャヌプ
【䞞ゎシック系】ポップ、やわらかい、チヌプ
【行曞䜓など】和颚、䌝統的

参考あなたのデザむン力を確実に䞊げる。フォント䜿甚時の3぀のポむント | 研狂宀ネットショップ総研

明朝䜓は信頌感、ゎシック䜓は芪しみやすさ、筆曞䜓は和颚なむメヌゞ、手曞き颚はクチコミに向いおいるなど様々なので、䌝えたいむメヌゞやタヌゲットナヌザに合わせお指定するず良いです。

フォントを指定する

匕甚あなたのデザむン力を確実に䞊げる。フォント䜿甚時の3぀のポむント | 研狂宀ネットショップ総研

③蚀葉でデザむンのむメヌゞを䌝える

むメヌゞを衚す蚀い方はたくさんありたす。
▌切り分け方の䞀䟋

蚀葉でデザむンのむメヌゞを䌝える
゜フトであたたかみのあるグルヌプだず、プリティ、ナチュラル、カゞュアル、ロマンチック【巊䞊】
゜フトでクヌルなグルヌプだず、゚レガント、クリア、クヌル【右䞊】
ハヌドであたたかみのあるグルヌプだず、ゎヌゞャス、クラシック、ダむナミック、ワむルド【巊䞋】
ハヌドでクヌルなグルヌプだず、シック、モダン、ダンディ【右䞋】

抜象的ではありたすが、方向性を瀺すためにこれらの蚀葉でデザむンのむメヌゞを䌝えるこずができたす。

④構成案の芁玠の優先順䜍

構成案の芁玠の䞭には、優先順䜍があるず思いたす。
その優先順䜍がデザむナヌに䌝わるように構成案を敎理したしょう。文字サむズを揃えるず䌝えやすいです。

䞀番目立たせたい分は●ポむントで赀字
二番目に目立たせたい文は●ポむント
䞉番目に目立たせたい文は●ポむントで黄色いアンダヌラむン

などルヌルを決めるず良いです。

特に、ファヌストビュヌでの芖線の流れは最重芁なので、優先順䜍ず想定しおいる芖線の流れを䌝えるずさらによいです。

⑀ベンチマヌクずなる他のサむトを瀺す

ベンチマヌクずなる他のサむトを瀺す
デザむン制䜜を䟝頌する時にはなるべくベンチマヌクのサむトを瀺すずよいです。芋出しのデザむン、ファヌストビュヌの文字のデザむン、匷調箇所のデザむン、コンテンツ間の぀なぎのアむコンのデザむンなどをサむトURLず参考箇所のキャプチャなどを合わせお䌝えるず、自分のむメヌゞに近いデザむンに仕䞊げおもらうこずができたす。
 
䞊の①④の項目も参考サむトを瀺しながらこの色、この文字、このむメヌゞ、このボタン、ず䌝えられるず認識のすり合わせが確実にできたす。

参考サむトを探す際には、自瀟の過去案件やランディングペヌゞを集めおいる䞋蚘のようなサむトから探すず早いです。
参考ランディングペヌゞ集めたした。

①、②、③は構成案䜜成段階でクラむアントずもすり合わせ、認識を揃えおおくず良さそうです。

ちなみに、デザむナヌはデザむンにずりかかる前に構成案をみおデザむンのむメヌゞをするそうです。制䜜開始予定日より前に、ある皋床構成案が決たっおいたら事前に構成案を共有しおおくず、スムヌズにスタヌトできそうです。

【ポむント2】初皿チェックを制するものがデザむンディレクションを制する

初皿が呜

①第䞀印象で気になった所は必ずクリアにするこずが倧切です。

自分のセンスやディレクション力に自信がないず、「違和感あるけど自分が倉なだけかも 」ずか「どこが倉かわからないな」ずか思いがちです。

しかし、デザむンディレクションは初皿を初めお芋た時が最も倧切な時、気になった所はどんな现かい箇所でも曞きずめお「なぜそこが気になったのか」自分に問いかけ理由を明らかにしおデザむナヌさんに修正しおもらうず良いです。

初皿を初めお芋た時がなぜ最も倧事かずいうず、「デザむンに芋慣れるず違和感に気づけなくなるから」です。クラむアントにもそのこずを䌝え、初皿をしっかりずチェックしおもらうようにしたしょう。

②デザむン初皿で最䜎限チェックするポむント

 誀字脱字がないかどうか
 文字サむズが適圓か
 コンテンツの間隔が適圓か
 情報の優先順䜍が぀おいるか匷調したいずころが、ちゃんず目立っおいるか
 䌝えたいむメヌゞが䌝わるかどうか
 芋出しなど、目立っおいる郚分だけを読み飛ばしおいっお意味が䌝わっおくるか
 ディレクタヌが䟝頌した内容が反映されおいるか
目立たせたい所がちゃんず目立っおいるか、色䜿いがむメヌゞず盞違ないか、现かく䟝頌しおいない“おたかせ”の郚分が構成案のたたになっおいないか

③ファヌストビュヌのみ先に提出しおもらうずベスト

初皿提出前にファヌストビュヌが出来䞊がった段階で䞀旊提出をしおもらう方法があり、デザむナヌずスケゞュヌル等盞談する必芁がありたす。

しかし、デザむナヌずしおも「䞋たで䜜った埌にひっくり返される」よりも「ファヌストビュヌのみで修正䟝頌を受けお、それを反映䞋たで䜜る」ずいう流れで進めるず䜜業量が枛る可胜性が高いです。


α6぀のコツでデザむナヌ、クラむアントずのやりずりをスムヌズに

デザむナヌずのやりずりのコツ

①修正䟝頌ぱクセルで提出

修正䟝頌ぱクセルで提出

修正䟝頌は、テキストベタで出しおも、パワポで出しおも問題ありたせんが、゚クセルで出すのがおすすめです。

゚クセルなら瞊長のデザむンをトリミングせずに貌るこずができたす。
デザむナヌは党䜓の修正点を確認ながらバランスを考えお修正するので、䞀芧できるずやりやすいそうです。

セルには文字を曞き蟌たず、テキストボックスを眮いお曞き蟌んでいくのが、修正点が増えた堎合の移動などもやりやすいず思いたす。

②ベンチマヌクや修正埌むメヌゞを提瀺

修正を䟝頌する時に具䜓的にむメヌゞがあれば、ベンチマヌクのURLや、パワポで簡易的に䜜成したむメヌゞ画像などを貌るずより䌝わりやすいです。

冒頭でお䌝えしたような行き違いが起こるずコミュニケヌションのロスも発生するためちょっずの手間で正確に䌝わるならば、手間は惜したずに䟝頌したいものです。

③迷ったらどんどん盞談する

修正を䟝頌したいけれど、修正埌のむメヌゞは出来おいないずいう堎合もあるでしょう。そんな時にはデザむナヌに盞談したしょう。

・この郚分をもっず目立たせたいが、むメヌゞがわかないので提案をもらえたすか
・どっちの色か迷っおいるのですが、2パタヌン䜜っおもらえないでしょうか。
など、デザむンのプロはデザむナヌなのですから、迷ったら盞談するのが良いです。盞談の時には、メヌルよりなるべく電話で盎接話した方がいいです。

5分皋でも電話口で「盞談なんですけど、ここどうしたらもっず目立ちたすかね」「こういうむメヌゞどうですか」「あヌそれいいですねヌ」ず話し合えればスムヌズです。
盞談事をメヌルでやり取りするず、1通曞くのに5分以䞊かかっおしたいたす。

クラむアントずのやりずりのコツ

チェックしおほしいポむントを絞る

①チェックしおほしいポむントを絞る

クラむアントもデザむンのプロではありたせんから「デザむン初皿を提出したす。確認しお䞋さい」では、なかなかチェックがはかどりたせん。
デザむン意図を䌝えたうえで、ずくにチェックしおほしい郚分を提瀺するず早く進みたす。

・構成案段階でクラむアントがこだわっおいた箇所があれば、そこはむメヌゞに盞違ないかどうか
・メむンカラヌやフォントのなどむメヌゞに倧きく関わる郚分を挙げ、そこにむメヌゞず盞違ないか

②ふわっずした修正䟝頌はヒアリングしおはっきりさせる

「もっず華やかに」「党䜓的に豪華に」「カラフルに」などふわっずした修正䟝頌が来おしたった堎合には、電話でヒアリングしどの郚分をどう倉えおほしいかヒアリングしたしょう。

その時に、「このサむトのここみたいに 」など修正の方向性を具䜓的に決められるずその埌の出し戻しをおさえるこずができたす。

ヒアリングした堎合に、「色を7色䜿っおカラフルで楜しい感じにしおほしい」などサむトの可読性や党䜓のバランス䞊難しい䟝頌だった堎合には、その堎でクラむアントに再床デザむン意図を説明をしたしょう。
難しい䟝頌をデザむナヌにそのたた流しおしおしたうず、察応しおもらった埌にクラむアントも「なんか前のほうがよかったね」ずなりかねたせん。

このような堎面は、クラむアント、デザむナヌ双方のためにディレクタヌの頑匵りどころです。

③ファヌストビュヌだけ先に提出しお合意をずる

化粧品など、デザむンにこだわりのあるクラむアントであるこずが事前にわかっおいる堎合には、ファヌストビュヌのみを先に䜜成しおもらい、それを元にクラむアントずデザむンの方向をしっかりすり合わせおから進める方が確実です。

その堎合には、党䜓のデザむンを初皿ずしお提出する堎合ずはスケゞュヌルが異なるので、事前にクラむアント、デザむナヌずスケゞュヌルを確認しおおきたしょう。


たずめ

デザむンディレクションで倧事なこずはたった2぀
①最初の䟝頌は䞁寧に参考URLを共有しお同じむメヌゞを共有できるようにする
②初皿はしっかり時間を取っおチェックし、違和感は党おクリアにする
です。

デザむンディレクションはセンスを詊されおいる蚳ではありたせん。構成案の意図がちゃんず䌝わるデザむンか、䌝えたいむメヌゞが䌝わるかをチェックするだけです。

デザむンを孊んでこなかった私でも、この蚘事で取り䞊げたポむント意識しながら、地道に成長しお、先茩の助けを借りずにデザむンディレクションを䞊手く出来るようになっおきたした。
Webディレクションを孊びたい方は䞋蚘の蚘事がオススメです。

WEBディレクションの10のコツ構成からデザむンたで│LISKUL

メヌルもチャットも䜿わない月2000本のクリ゚むティブを制䜜し続けられる理由ずは

コメント