WebDesign

【初心者必見!バナーデザインの作り方】Webデザインは説明すると上手くなる。【10の基本でコツを掴め】

Creative21
スポンサーリンク

【初心者必見!デザインの作り方】Webデザインは説明すると上手くなる。【10の基本でコツを掴め】

どうも、エナジードリンクは『モンスターエナジー』より『レッドブル』派の@Nao_Gです。だってレッドブル飲んだら翼生えるらしいじゃないですか?そりゃレッドブル飲むっしょ!

[itemlink post_id=”1105″]

はじめに

この記事は下記の記事「【初心者必見】Webデザインが上手くなる10の方法」の項目を掘り下げた内容になりますので、是非下記の記事も併せてご覧下さい。

【初心者必見!】思い通りのデザインが作れるようになる10の方法今回は私がWebデザインでスキルアップをする為に行っていたことをまとめましたので、参考になれば嬉しいです。デザインを初めて間もない方は、デザインがどうやったら”上手くなるのか”、”出来る様になるのか”ととにかく悩むと思います。ここで挙げた10の方法は私がデザインを作る際に行っていた全てです。...

こちらは一項目前の記事です。

【初心者必見!バナーデザインの作り方】制作イメージを元にデザインを形にせよ!【10の基本でコツを掴め】それでは早速ラフデザインを形にしていきましょう!一番ワクワクする工程ですね!この時に一つ注意してほしい点があります。それはデザインを制作する時に、今なぜその調整を行っているのか?を常に考えて行うことです。...

今ここ

1.参考のデザインを集める
2.それを見てまずはひたすら気づく
3.何故そのデザインが成り立っているのかを考える。
4.答えを組み合わせる
5.作りたいイメージを固める
6.デザイン作成
7.デザインを説明する
8.チェックしてもらう
9.修正をする
10.どこが良くなったのかをまとめて説明する

前回のおさらい


前回は上記の様なデザインを作りました。皆さんもそれぞれのデザインを形にできているはずです。※キャラクターはフリー素材を使用しています。

デザインを説明する

今回はデザインを説明するです。まず説明するってどういうこと?どう切り出したらいいのか分からない!と思われるはずです。分かりやすく言うと細かい部分を指摘された時にその指摘に対して理論的に説明ができるかどうかということです。私が作ったデザインを例に五つほど説明をしていきます、では早速いきましょう。

一つ目


クライアント
クライアント
何故キャラが大きく配置されているんですか?おいこら。

Naoya
Naoya
このバナーはキャラクターを一番に訴求する目的の為、キャラクターは大きくデザインしています。

クライアント
クライアント
なるほど、キャラクターを訴求したかったので助かります。

理論的に説明ができている!

二つ目


クライアント
クライアント
何故、声優名の色はこの色なんだ?おいこら。

Naoya
Naoya
キャラクターの雰囲気に合わせた配色にしています。

クライアント
クライアント
なるほど、確かにキャラクターの雰囲気に合っていますね

理論的に説明ができている!

三つ目


クライアント
クライアント
何故CVと声優名の色を分けているんですか?おいこら。

Naoya
Naoya
CVより声優名を目立たせたかったので強弱をつける為に色を変えています。

クライアント
クライアント
でもCVと声優名はその二つで一括りのはずだ!色を変えたら違うグループに見えちゃうんじゃないの?おいこら。

Naoya
Naoya
そちらに関しては大丈夫です。確かに色も違って文字の雰囲気も違ったら全く別のものに見えてしまうでしょう。ですがそう見えない様にCVと声優名の文字のあしらい(雰囲気)を同じにしていますし配色は同じにしていてトーンで違いを出しています。

クライアント
クライアント
なるほど、だから違和感なく情報が入ってくるのか。やるな貴様

Naoya
Naoya
いえいえ、納得頂けて何よりです。

理論的に説明ができている!

四つ目


クライアント
クライアント
背景は何故青いのですか?おいこら。

Naoya
Naoya
こちらはゲームのトンマナに合わせています。

クライアント
クライアント
なるほど、ゲームの雰囲気が伝わっていい感じです。

理論的に説明ができている!

五つ目


クライアント
クライアント
何故、手前の桜と奥の桜の大きさが違うんですか?おいこら。

Naoya
Naoya
画面に奥行き感を出すためです。また背景の葉も手前は大きく奥は小さくして奥行き感が出る様にしています。

クライアント
クライアント
確かに!背景に関しては気づかなかった!納得しました!

理論的に説明ができている!

何故説明することが必要なのか?

では何故デザインを説明する必要があるのでしょうか?

クライアントに説明する為

先ほどのやり取りではデザインを理論的に説明していたので、クライアントも納得していましたね!ではこれが下記の場合のデザインでクライアントにこうつっこまれたらどうでしょう?


クライアント
クライアント
何故、声優名が青いんですか?おいこら。

Naoya
Naoya
え〜汗。背景に合わせました!

クライアント
クライアント
でもこの青男性っぽくない?しかもCVは何で赤っぽい色何ですか?まとまり感なくないですか?てか青ひつこく感じませんか?

Naoya
Naoya
あ、え〜とすみません!作り直します!

クライアント
クライアント
納期は後ろに倒したくないので頼みますよ

Naoya
Naoya
は、はい!すぐに対応します!

この場合は声優名の色が青いことが一番の問題ではなく、説明が出来ないことが問題なのです。クライアントを納得させられませんでしたね。因みに冒頭でこんなにキレているクライアントは基本いないので大丈夫です。少なくとも私は出会ったことがないです。

方向性を示し合せる為

時には同じ案件もチームで対応することがあります。そんな時に方向性を決める時ってみなさんどうしますか?こんな感じで〜あんな感じで〜と口に出して伝えようとしますよね。そうです、伝えるには説明が必要なのです。その為には自分が説明出来るデザインを作らなければなりません。

デザイン力向上の為

説明がつくデザインを作ると自ずとデザイン力が向上します。それは過去の記事でも書きましたが、デザイナーのデザインには作成者の気づきが散りばめられていて見る人が見れば意図が伝わってきます。裏を返せば、何も考えてないデザインは何も考えてないなと見透かせてしまいます。

【初心者必見!バナーデザインの作り方】Webデザインは気づくことで上手くなる。【10の基本でコツを掴め】この項目は「1.参考のデザインを集める」で集めた自分が作りたいイメージに近い!良い!と思った参考画像を見て“気づく”練習を行います。この気づきが後々デザインをする上で役立ってくるので、今は“気づく”ことだけ考えて下さいね!...

じゃあどうやって説明すればいいの?

じゃあどうすればいいの!そんなこと言われたって分からないよ!難しいこと言うなよ!頭痛いよ!と思われるかも知れませんが皆さんはもうデザインを説明出来るはずです。何故なら前回の記事で常に考えながらデザインをしているからです。その考えたことがそのまま説明になるんです。冒頭にあったクライアントとの対話も私が作りながら考えたことを言っているのです。つまりです!!!!!

考えて作らないと説明出来ない!!!!!

考えて作っていれば、説明が出来るんです。

【初心者必見!バナーデザインの作り方】制作イメージを元にデザインを形にせよ!【10の基本でコツを掴め】それでは早速ラフデザインを形にしていきましょう!一番ワクワクする工程ですね!この時に一つ注意してほしい点があります。それはデザインを制作する時に、今なぜその調整を行っているのか?を常に考えて行うことです。...

チェックをしてもらう時に説明文を作れ

皆さんがどんな目的でこの記事を読んでいただけているのかは分かりませんが、あなたがデザインを作っていてそれをチェックしてもらえる環境にあるのであればデザインを提出する時に説明文を加えて下さい。もしくは自分の言葉でデザインを説明する様に心がけて下さい。これはクライアントに提出する時も同様です。

私が作ったデザインの説明

最後に説明文のイメージが掴みやすい様に私のデザインを説明します。わざとかなり細かく説明しますね。

キャラクターを目立たせてほしかったとのことだったので、キャラクターを一番大きくしています。それに続いて声優名、CVと優先度をつけております。また背景色やモチーフに関してはゲームのトンマナに合わせました。墨のモチーフですが、刀に添わせるていることによって躍動感をつけました。また桜と背景のモチーフを手前から奥に向かうにつれ小さくしているので奥行き感も演出しております。文字の配色はキャラクターに合わせております。

まとめ

まずは読み切っていただいてありがとうございます。稀に見る力説の記事になったと思っております。ここまで読み進めていただいた方の為になっていると嬉しく思います。では私は翼を授かったので空を飛んできます!人類の夢だ!まずは何処へ行こうか!そうだ!京都に行こう!

次の項目へ
【初心者必見!バナーデザインの作り方】Webデザインはチェックしてもらうと上手くなる。【10の基本でコツを掴め】この様にデザインをチェックしてもらう際は、案件の概要や制作意図を説明しましょう。説明をしないとチェックする側も何をつっこんだらいいのか分からないですし、クライアントの要望によってチェックの基準が変わるためです。...

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

ABOUT ME
Naoya
Naoya
Designer
デジタルアーツ東京→デザインプレックス東京→デザイン制作会社→フリーランス
スポンサーリンク
記事URLをコピーしました