Webデザイン

コンセプトメイキングとは?手法や具体例は?決めておいた方が良いポイントまとめ

color-patterns

Webデザイナーとして依頼を受けると、「コンセプトは…」という話が出ることがたまにあります。

ただし、この「コンセプト」について良くわからない…といった方もいらっしゃるかと思います。

そこで、今回はコンセプトやコンセプトメイキングの説明から、コンセプトシートの作り方やメイキング方法・運用法などをお伝えしようと思います。

コンセプトとは?

まず、コンセプトとは何かについておさらいをしておきましょう。

コンセプトとは「全体を貫く基本的な概念」です。

たとえば「清潔感」とか「明るさ」「暖かさ」「優しさ」みたいに表現をする方もいれば、もっと具体的にする方もいます。

ただし、筆者が個人的に感じているのは、マーケティング用語として「コンセプト」と言っている時と、Webデザイナーに向けて「コンセプト」という時は、意味合いがちょっと違うかな?ということです。

Webデザインにおけるコンセプトとは?

基本的に、マーケティングだろうとWebデザインだろうと、クライアントが依頼してくる「コンセプト」は一緒です。

つまり、提出してくるコンセプトの文言が変わるわけではないということです。

ただし、Webデザイン的な意味で使われるコンセプトとしては、「お客さんにどんな印象を持ってもらいたいか?」という意味合いが強いように思うのです。

一方で、マーケティング用語としては、「お客さんに最終的にどうなって欲しいか?」の方が強いように思います。

デザインのみを重視した場合と、マーケティングを重視した場合とで、若干のズレがあるようには思われます。

コンセプトメイキングとは?その具体例は?

とはいえ、コンセプトがどのようなものか?、コンセプトメイキングとはなんなのか?、まだイメージがつきにくいと思うので一つ例を紹介します。

「価値の交換をよりシンプルにし、世界中の人々が最適な経済活動を行えるようにする」

base - コンセプトメイキングとは?手法や具体例は?決めておいた方が良いポイントまとめ

たとえば、これはECショップを提供する「BASE」さんのミッションです。

こちらはコンセプトというよりミッションですが、例えば、このミッションからサイトのコンセプトを作るとします。

その場合、そのサイトには「シンプルさ」や「先進性」などが必要になったりするのかなと思います。

このように、実際にコンセプトからwebデザインに落とし込んでいく過程を、コンセプトメイキングと言います。

コンセプトメイキングの手法(手順)

それでは、実際にコンセプトからwebデザインに落とし込んでいく過程(=コンセプトメイキング)についてお伝えします。

1.コンセプトを書き出す

まずは、紙か何かに「コンセプト」を書き出します。

「コンセプト」を口で言っただけだったりしますと、お客様から見た印象が分かりにくい上に、時間が経つと細部の表現が変わってしまう時があります。

特に、表現が変わってしまう時が怖いので、実際に文字として形に残しておくことをオススメします。

2.カラーシートを作成する

次は、カラーシートのようなものを作ります。

カラーシートと呼ばれている訳ではないですが、要は「サイトに使う色をまとめておいたもの」です。

カラーコードまで含めて、全て保存しておきます。エクセルやスプレッドシートにまとめておくのがおすすめです。

3.デザイン規定(のようなもの)を作る

次は、サイト全体のデザイン規定を作ります。デザイン規定とは言っても、そんなに固くならなくて大丈夫です。

例えば、「グラデーションは使うかどうか?」「アニメーションはいれるかどうか?」などは最低限決めておくのがおすすめです。

このデザイン規定がないと、特定のページだけ雰囲気が異なったり、印象の違うボタンができたりしてしまいます。

参考程度にGoogleのマテリアルデザインのガイドラインを見てみるのもおすすめです。こういう規定があると、一気にデザイン案が決めやすくなります。

4.画像を選抜する

最後に、画像を選抜します。なお、画像を最後に選ぶようにしたのには理由があります。

画像を決めてからカラーシートを作ったり、デザイン規定を考えたりすると、その画像にあわせたものを作りかねないからです。

ですので、基本的には画像は最後に選ぶのがオススメです。

ヒアリングシート+コンセプトシートを用意しておく

ここからはwebデザイナーとして筆者が働く上で、個人的に行っていることを紹介します。

今回のようにコンセプトから色を決めたり、デザインを決めたりしていると、毎回同じような手順で具体化していくことに気づくはずです。

そこで、Webデザイナーとしての準備物として、「ヒアリングシート」に加えて「コンセプトシート」を揃えておくのがおすすめです。

コンセプトシートの構成

コンセプトシートの構成はオリジナルで作ってかまわないと思うのですが、筆者が入れているのは

  • コンセプト(無ければミッション)
  • サイトを通してユーザーに与えたい印象
  • メインカラー・サブカラーの指定(無ければ無し)
  • 動きを入れたいか入れたくないか

みたいなものです。

コンセプトメイキングからサイトの運用までについて

実際の所、コンセプトをもとにサイトを作った後、その後の運用はクライアント様が全て行うのが普通です。

ただし、Webデザイナーが運用部分も一緒にやることもありますので、その運用の際に気をつけておくべきポイントをお伝えします。

運用中に気をつけておかないといけないポイントは、“後から追加する要素”です。

Webサイトを立ち上げる頃は、コンセプトを意識して画像を選んだり、文章を選んだりするので、まとまりが良いです。

ですが、運用していく間に、コンセプトを含めて色々とごちゃごちゃになってしまうことがあります。

筆者らwebデザイナーとしてできることは、Web担当者にアドバイスしておくことくらいですが、言うのと言わないのでは全然違うかと思いますので、気づいたことがあればお伝えした方が良いとは思われます。

コンセプトメイキングに関するまとめ

以上、いかがでしたか?

今回は、サイトのコンセプトの話しから、コンセプトメイキング、コンセプトシートや実際のサイトの運用についても少しだけご紹介しました。

今後はWebデザイナーはデザインの知識だけでなく、こういったマーケティング的な話しも理解できる人が求められていくようには思われます。

プログラミングスクールのTechAcademyなどではWebマーケティングについても学べますので、デザイン以外の知識を身につけたい方にはおすすめです。

最後までお読み頂き、ありがとうございました。