UIデザイン

デザインコンセプトの作成方法|キーワードの決め方など

デザインコンセプトとは、新しくアプリやWebサイトを製作する際、または、ゼロからアプリやWebサイトをリニューアルする際などに決めるデザインの指針のことを言います。
競合との差をつけ、サービスや企業の独自の価値を表現するには、このデザインコンセプトを決めることが非常に重要です。

そこで、この記事では、デザインコンセプトの意義を解説するとともに、実際に弊社で行われているデザインコンセプトの作成プロセスを例とともに紹介していきたいと思います。
コーポレートサイトのリニューアルを考えている方、デザインコンセプトの作成方法を知りたい方に是非読んでいただきたいです。

デザインコンセプトの意義とは?

コーポレートサイトのデザインには必ず、その企業価値を表現するための軸があります。
デザインコンセプトとは、チームでデザインする際に、この軸がブレないように可視化するためのものです。

また、デザインの軸を可視化することで、デザインの方向性や道が見えるため、チーム全体で何をやるべきかが常にわかる状態でデザインを進めることができるというメリットもあります。

デザインコンセプト作成プロセス

ここで、弊社でのデザインコンセプトの作成プロセスを簡易的な例とともに紹介していきたいと思います。

今回は、あるコーポレートサイトのデザインを例として、デザインコンセプトの作成プロセスを次の5つにまとめました。

  1. 企業が持っているキーワードを全て付箋に書き出す
  2. キーワードから表現すべきテーマを考える
  3. テーマを要素ごとにデザインコンセプトとして書き出す
  4. デザインコンセプトが表現としてふさわしいのか判断する
  5. デザインコンセプトシートを作る

これらのプロセスをそれぞれ解説していきます。

1.企業が持っているキーワードを全て付箋に書き出す

まず、企業が持っている“fact”と“emotion”での価値をキーワードとして全て付箋に書き出していきます。
コーポレートサイトの場合、この“fact”と“emotion”を、「会社について」・「人について」という2つの視点から書いていきます。

まず、「会社について」の“fact”には、企業が提供するサービスや商品、会社についての事実を書きます。(低価格、高品質…など)
それに対して、“emotion”には、顧客がそのサービスや商品、会社に触れた時の「経験価値」を書いていきます。(親しみやすさ、信頼感…など)


また、「人について」は、その企業に務める従業員の人柄や行動についての“fact”、その起因となる“emotion”を書きます。

このように、機能面、感情面での企業価値を全てキーワードにすることで、コーポレートサイトとして表現したいコンセプトの軸が明確になるのです。

キーワードの決め方

ここで、弊社でのキーワードの決め方を紹介したいと思います。
キーワードを決める上で重要なのは、誰にとってもわかりやすいものを作る、ということです。

コーポレートサイトは、その企業の顧客、取引先、投資家…といった様々な人が見るものです。
仲間内でしかわからないキーワードをもとにデザインとして表現しても、そういった多様な人に伝わらない可能性が高い上、デザイナー目線から言うと、提案する時に取引先にコンセプトが説明ができなくなってしまいます。

よって、内々でわかる共通言語ではなく、誰にでも伝わりやすくイメージしやすい、一番的確なそのサービスや会社を表現できるキーワードを探すことが重要なのです。

また、このキーワードは、キャッチコピーとは違ってキャッチーである必要はなく、コンセプトの軸としてどれだけ的確にキーワードとして表現できるかに重きを置いています。

2.キーワードから表現すべきテーマを考える

次に、コーポレートサイトとして、“fact”と“emotion”をどう表現するか、そのテーマを考えていきます。
ここで重要なのは、誰に何を感じて欲しいかを考えることです。
ステークホルダーが3人いれば、各3つのステークホルダーにどんなことを感じて欲しいかを書き出してから進めていきます。例えば、ステークホルダーが就職活動中の学生であれば、こんな会社に入りたい、と思わせるようなデザインテーマが必要です。

架空のデザインテーマを考えるのは非常に難しいのですが、食品会社だったらこのような感じでしょうか。

3.テーマを要素ごとにデザインコンセプトとして書き出す

ここで、コンセプトを最大限引き出すために、前段階で考えたキーワードを、どのようなビジュアルなら表現できるのか、5つの側面から落とし込みたいイメージにアプローチしていきます。

テーマがデザインの出発点だとしたら、コンセプトはそのテーマを最大限表現するためのデザイン要素です。
ここを更に詰めていくにあたって、イメージとはかけ離れてしまうシンボルも考えておくと軸のブレない表現ができるようになります。

  • イメージ
    可愛らしさや、かっこよさといった大まかなイメージから、もしそれが食品会社だった場合、チョコレート、野菜ジュースなどといった具体的なイメージまで書いていきます。
  • シンボル
    シンボルとは、基本となるパーツの形です。
    例えば、イメージが「可愛らしい」なら、シンボルは「大きめの角丸」などがシンボルの一つとして考えられます。
  • タイポグラフィー
    タイポグラフィーは、文字の太さ、フォントのイメージ、セリフ体なのか、といったところまでコンセプトを決めていきます。例えば、イメージが「エレガント」であったら、文字の太さは細め、英字はセリフ体になるでしょう。

  • イメージとなる色を考えます。なんとなく赤と決めるのではなく、明るめの赤なのか、鮮やかな赤なのかというところまで色のイメージを詰めていきます。
  • インタラクション
    Webデザインなどのインタラクションは、動きの多いものからシンプルなものまで様々なものがありますよね。
    ここでは、そういった動きのイメージを固めていきます。
    チームでインタラクションのイメージを共有する場合は参考サイトなどを貼るのがおすすめです。

思考と造形をここで繰り返し、表現したいテーマとデザインのギャップがなくなるように突き詰めていきます。
このように、細かなところまで向き合うことで的確な表現のアウトプットができるようになります。

4.デザインコンセプトが表現としてふさわしいのか判断する

経験則から考えた判断基準をもとに、前段階で考えた表現がふさわしいかを見極めます。
ここで一例として、あるコーポレートサイトのデザインコンセプトを考えた際の判断基準を紹介します。

  • 伝えたいことがそのデザインコンセプトで表現できているか
  • 誰が聞いてもわかる表現になっているか
  • 最大限ビジュアルに落とし込む際に具体的な表現になっているか
  • コンセプトに辿り着くまでのプロセスがクリアになっているか

デザインコンセプトを細かく決めていく際、表現するビジュアルがブレないように、以上の4つのような判断軸を予め決めることが重要です。

5.デザインコンセプトシートを作る

デザインを進めていく中で、立ち返る場所として、デザインコンセプトシートを作ります。
例として食品会社のデザインコンセプトシートを作ってみました。

今回は架空なので簡易的に作りましたが、実際は、企業の歴史、文化など、その企業にしか表現できない価値をデザインコンセプトに落とし込むことが重要になります。

おわりに

ここまでデザインコンセプトについて書いてきましたが、デザインコンセプトの意義や考え方が伝わったでしょうか。

コーポレートサイトなどのデザインは、一つ一つのデザイン要素をこだわり抜くことで、企業の価値を表現することができます。

こちらの記事では、デザイン要素の一つとして、「色」という視点からUIデザインを更に深掘りしているので是非ご覧ください。