こんにちは！Grow Groupのデザイナーさとおです。
業務としてはWebサイトのデザインだけでなく、ロゴマークやパンフレットなど、デザイン全般を担当しております。
早速ですがディレクターの皆さん、デザイナーにこんなことを言った経験はありませんか？
「とりあえず作ってみて」 実はこれ、デザイナーにとってはとっても困るセリフなんですね。
そこで今回は、普段デザイナーが考える、クライアントに本当はどんなことを聞いてきてほしいのか、どんな情報やデータがあるとデザインしやすいのかというデザイン部分のディレクションについて、ディレクターの皆さんに知っておいてほしいなぁと思ったことを書いていこうと思います。
はじめに
デザイナーにとって、クライアントの要望を聞き出すための ヒアリング 工程が非常に重要と言えます。
Webサイトのデザインでは、見た目の美しさはもちろん、 クライアントの要望を元に目的を達成するため の構造や、そこにたどり着くための動線、アニメーションなども考える必要があります。 プラス、レスポンシブデザインともなれば頭の中をフル回転させながらデザインしなければなりません。
そして、そのヒアリングの内容から設計に落とし込んでいくわけですが、特にデザインの方針を決める部分が曖昧な場合は次のような事態を引き起こす可能性があります。
大幅なデザイン修正の原因
そもそも、大幅なデザイン修正をする羽目になる原因はどこにあるのでしょうか？
よくある例として、冒頭でもお話しした「とりあえず作ってみて」という言葉が挙げられます。
この言葉から読み取れる一番最悪の事態は、とりあえず少ない情報からデザイナーが何とか意図を汲み取ってデザイン
→ クライアントが確認して「違うなぁ、もっとこう何ていうか…」
→ デザイナーはほぼ作り直し
ディレクションの中でもデザイン部分は曖昧になる場合が多く、このように後々で認識の相違が生まれてしまうことも少なくありません。
このような事態を避けるためには、今後どのように進めていくのが良いのかを、デザイナーの立場から共有していきたいと思います。
クライアント側とのイメージ共有のために
クライアントからのデザイン修正を最小限に留めるためには、やはりクライアントからのヒアリングや、社内に持ち帰ったあと担当デザイナーに受け継ぐ際のMTGで、 いかに同じイメージを共有できるかが大事だと思います。
曖昧なまま進めず、ここにしっかり時間をとって丁寧にやるかやらないかで、成果物の質にも影響してくると思いますし、しっかりイメージ共有できた上で改めて提案することによって、提案自体もより的を得た的確なものになります。
デザインの目的を整理する
よくやりがちですが、「ターゲットは40代女性なので落ち着いた感じで！よろしく！」と曖昧なイメージで指示するのはNGです。
まずはwebサイトを作る目的に従って、デザインの方向性を整理しましょう。
一つ知っておくべきなのが、クライアントはとにかく目的（お問い合わせを増やしたい、知名度を上げたいetc…）を達成するために依頼していて、デザインに詳しいわけではないので、そもそも的確なイメージを共有してもらえることはほとんどないということです。
そんなクライアントから核心を聞き出すためには、設計の段階で ユーザに伝えたい事に順位づけをすることも一つの方法です。
構成の中でどこを目立たせたいのか、そのクライアントが「お問い合わせを増やしたい」という目的でWebサイトを作るのであれば、1番に目的である「お問い合わせ」を設定しますよね。
そして2番目にはどこを目立たせたいのか、3番目には…と決めていきます。
こののような、目的がはっきりしている場合はスムーズに組み立てることができますね。
ですが例えば「初めて会社を立ち上げたから、とにかく子どもからお年寄り、取引先にも信頼を得たい」というような少し欲張りな要望について、この順位づけは力を発揮します。
広いユーザ層を満足させる製品を作ろうとしたら、理屈から言えば、機能をなるべく多くして、最大の人間に対応できるようにするべきだということになる。この理屈は間違っている。たった一人のためにデザインした方が、ずっと成功するのだ。-アラン
という言葉があるのですが、その通り、情報やコンテンツを詰め込みすぎて結局何が言いたいのかわからなくなってしまっては意味がありません。
目的に順位をつけて、下層に来てしまったコンテンツに関しては、カラーでカバーすることも一つの手段です。
カラーイメージを明確にする
「ピンク」と一言で言ってもたくさんの種類があります。
薄いピンクは優しいイメージを与えますし、濃いピンクは若さや奇抜さ、シアンをプラスすると渋い印象になったりと、同じ「ピンク」でもカラートーン・彩度・明度によって与える印象が全然違ってきます。
カラーイメージが明確になれば、フォントの選定やサイズ感も汲み取りやすくなるので、しっかり決めておくことをおすすめします。 ついでに、カラー選定に役立つツールをいくつかご紹介します。
カラーにはそれぞれ意味があって、意外と深いんです。詳しくはまたブログに書きたいと思います！
より具体的に伝える
こちらもカラーと同じ原理ですが、例えば「明るい感じ」という言葉。
カラー的になのか、もしくは内面の気持ち的な意味なのかで、作るデザインは全く違うものになります。
前者の場合は彩度を上げるか明度を上げるかを考え、後者の場合は構造や装飾を考え考えます。
また、言葉で伝えるのが難しい場合などは、参考サイトを提示する方法もあると思います。
ここにも1つ注意点を上げるとすれば、そのサイトの参考にしてほしい部分はどこなのかを明確にしておくことです。
全体のカラートーンはこのサイト、フォントの使い方や大きさはこのサイト、ただこのサイトのフォントだとうるさすぎる、というようにNGな部分も上げつつ、指示するとより正確なイメージを比較的うまく伝えることができるのではないかと思います。
大雑把な指示ではイメージと違うデザインになってしまう可能性もあるので、具体的に指示するようにしましょう。
デザイン方針定義書の作成
上記内容が固まったら、デザイン作業の前にデザインの仕様書を作って、見える形でお互いの認識を一致させるとなお良いと思います。
クライアントからの要件や目的を洗い出し、配色やフォントの方針、参考サイトやUIの方針、デザインする中での注意点（レスポンシブデザインの場合は、画像の比率を気をつけるなど。）まで具体的に仕様を作成することで、後からデザインがブレる可能性も防ぐことができます。
ちなみにGrow Groupでも「デザイン方針定義書」をデザイナーが作成し、ディレクターからその方針で問題ないというOKが出てからデザインしていくというフローを業務の中に組み込んでいます。
さいごに
デザインは感覚的なものなので、具体的に認識を統一することが比較的難しい分野です。
デザインの表現方法は無限にありますが、そこから最善の方法を選び出すことが成果につながります。
だからこそヒアリングというインプットの情報が多ければ多いほどで表現方法が絞れるので、より的を得たものを、スピーディーに作ることができます。
また、その後のデザイン方針もきっちり詰めておく事で、デザイン管理も驚くほどスムーズにいきます。
イメージの共有を曖昧にせず、デザイン方針定義書を作成して具体的に認識を統一することが、デザイン部分のWebディレクション（クライアント→ディレクター→デザイナーまで）を円滑に進めていく最重要事項だと思います。
Udemyを実際に体験した方の感想記事もぜひご覧ください♪
- 【体験談】主婦が「自宅で働きたい」を叶えるために、広告バナー制作を学んでみた
- 【体験談】全くの初心者がUdemyでモーショングラフィックスを学んでみた
- 【体験談】Udemy「みんなのAI講座 ゼロからPythonで学ぶ人工知能と機械学習」を実際にやってみた感想
- 【体験談】無料！？Udemyで学ぶはじめてのAI（ディープラーニング、機械学習）
- 【体験談】UdemyでWeb開発を学びました【コスパ最強】
