デザインのこと、日常のこと―ワカイ日報III

何事も、数をこなさなければ、身に付かない。
実践すること、何度も何度も実践することが大切だ。
そして無意識にできるようになったときに、初めて身に付いたと言える。

自転車の乗り方を本で読んで勉強しただけでは、乗れるようにはならない。

何度も転び、何度もチャレンジし、少しずつ乗れるようになる。
乗れるようになれば、もう忘れることは無い。

英語の発音についての本をいくら読んでも、いくら知識を増やしても、それだけでは聞き取れるようにはなれない。

TAB譜（ギターの楽譜）をいくら眺めても、うまいギタリストをいくら見ても、それだけではギターはうまくならない。

LとRの発音が聞き取れなかったり、ギターのチョーキングがうまくできないなど、難しいを感じるところは、よりいっそう数をこなす必要がある。

もちろん、本を読むことは非常にためになる。いろいろな本をどんどん読んで欲しい。そして、読みながら実践して欲しい。手を動かすと、読んでわかった気になっていたことが数倍理解できるようになり、新しい発見もあり、新しい疑問も生まれる。

ブランドのロゴマークひとつ見ても、実物を見ながら字間調整してみると、どのように調整されているのかを知ることができる。本を読んだだけではさらっと忘れてしまうことでも、体験することで少しだけ身に付く。

身に付いていないことを繰り返すのは、パワーがいる。
無理矢理にでも、自分をそういう環境下に置き、数をこなそう。体が覚えるまで。

書籍、雑誌、チラシ、WEBサイトなど、さまざまな媒体での本文の役割は、内容を伝えることだ。そこにはひっかかるもの―ノイズが無いほうがいい。過度な装飾や個性は、ノイズになる。本文だけでなく、デザイン全体にも言える。

もう少し具体的に言うと、読者に「なんか読みにくいな」と感じさせてはいけないし、「きれいにデザインしてあるな」とすら思わせないほうがいいということだ。あくまで主役は文章の内容である。
本文のフォント、文字サイズ、色、行間、段組、見出しなどなど、細部まで調整することによって、読者はそれを感じなくなる。

さて、実はノイズには、2種類ある。

ひとつは、意図せずに生じてしまったもの。もうひとつは、意図したことで、ノイズになってしまうものだ。

意図せずに生じたものは、経験を積めば減らすことができる。フォントの選び方や行長、マージンなどなど。感覚とロジックを身につけよう。

意図したことで生じるものとは、過度な装飾や個性（を出そうとすること）だ。「普通だとつまらない」とばかりに、奇をてらったフォントを使用したり、太字、赤字、下線その他の装飾をむやみに使ったりしてはいけない。それは、読みにくくなるだけだ。伝えようとするばかりに、結果として、伝わらないデザインとなってしまう。
牛肉本来の味を伝えたいのに、調味料を使いすぎてはいけないのだ。（逆に言えば、牛肉が粗悪品なら、調味料でごまかすしかない）

無味無臭にするためにどうすればよいかは、偉大な先人たちが試行錯誤して残してくれているので、それをひとつずつ身に付けて行くのが近道だね。

田んぼの田。
この字をモリサワ：新ゴ Boldのフォントで表示してみると、見慣れた「田」が出てくる。実は、この田の文字を構成する正方形はひとつとして同じ形は無い。

上画像の赤色の矩形（くけい：長方形のこと）は、すべて同サイズだ。田んぼの各矩形（稲を植える部分）が、微妙にサイズが異なっているのがわかる。また、水色は正方形で、田の字の横線は縦よりも横のほうが若干長いとわかる。さらに、緑色の矩形に着目すると、田の字の真ん中の垂線が最も細く、右が一番太いことがわかる。

これは、フォントベンダー（フォントの会社）のモリサワが手を抜いてこうなってしまったわけではなく、人の錯視を考慮し、緻密に調整された結果だ。

この錯視にはさまざまなケースがある。

上の画像は、Helvetica  BoldのKとXだが、それぞれのパーツが直線ではなく、交差する点で若干細くなっている。

また、下の画像は、左が純粋な半円とそれにつづく直線だが、矢印の部分が微妙にとがっているように感じられる。
右が直線をやや膨らませて調整したものだ。こちらのほうが自然に見える。

これらの調整は、感覚に頼るしかない。
整列ツールを使ったり、グリッドに揃えたりして機械的に調整した後に、バランスが悪いと感じたならば、その感覚を信じて調整する必要があるのだ。

この微妙なニュアンスは、今回のようにフォントを分解してみると参考になる。そして、それがロゴ・マークなどを作るときに生きてくるだろう。

デザインに必要なのは、デザイナーの個性ではない。
そして、クライアント（依頼者）の好みを満たすことでもない。

要望、目的、ゴールを満たすことが最重要で、そのためにはクライアントの個性を引き出したり、目的にあわせて変化させる必要がある。

あなたが赤が好きで、クライアントが青が好きでも、目的を満たすためには黄色、ということがあるのだ。

美容師のあなたがショートカットが好きだからと言って誰にでもショートカットすすめるのではなく、似合うヘアスタイルにできてこそ、プロだ。これを美容業界では“似合わせ”と言う。

具体的にしよう。

あなたはパンク系ファッションが好きで、いつもモヒカンにボンデージパンツだ。アツシにもパンクは似合うんじゃないかと思う。（デザイナーの好み）
アツシはハードロックが好きで、バンドTシャツにジーンズというスタイルが多い。（クライアントの好み）

ここで服を選ぶと、少々パンクテイストが入りつつハードロックな雰囲気のものを選んでしまいそうだ。アツシが気にいってくれればよければそれでいいが、気に入らなければ、何度でも選びなおす必要がある。しかも、実はあまり似合ってない。

そこでターゲット。アツシは清楚で可憐な雰囲気のメグさんにアプローチしたいらしい。（ターゲット）
メグさんはまじめでありながらもユーモアのある男性が好きそうだ。（リサーチ）

となると、フォーマルな雰囲気がありながらも、小物やアクセサリーにはちょっとしたハズシを加えてみてはどうだろうか。（提案）
アツシ（クライアント）の好みではなく、あなた（デザイナー）の好みでもなく、メグさん（ターゲット）にもっとも近づけるような、そしてアツシのキャラクターと顔、体型にベストフィットする服を選ぶのだ。

恥ずかしがりながらも 試着してみると、アツシはまんざらでもないようだ。

その後、アツシがメグさんとうまくいくかどうかはわからないが、少なくともハードロックにパンクテイストを織り交ぜたファッションよりは可能性は高い。

美容業界の“似合わせ”はなかなか経験とセンスが必要そうだが、デザインはもう少し論理的に攻めることができる。

色を選ぶときも、その色の背景（バックボーン）を語ることができれば、選択に説得力が出る。
フォントも、レイアウトも、クライアントの要望の本質をとらえていれば、好みという人による誤差の大きいものではない部分で決定できる。

そうしてできたものは、クライアントの個性（らしさ）になり、デザイナーの個性が多少残っているのも、それはそれでOKだ。

行送りとは、行の頭と次の行の間のことで、行間とは、行と行の間のこと。文字の大きさを含まないかの違いだ。

行間を広めにすれば、ゆったりとするが、広すぎてもおかしい。

最適な行間は、行の長さ、つまり一行の文字数によって変わる。

行間は行長の3%という理論がある。それで考えてみると、

1行15文字の場合は100％×15文字×3%＝45%　（行送り145%）

1行20文字の場合は100％×20文字×3%＝60%　（行送り160%）

1行30文字の場合は100％×30文字×3%＝90%　（行送り190%）

このようになる。15文字以下や30文字以上（縦書き書籍は50字以上）は読みにくいので除外。1行の文字数は20文字前後が読みやすいが、縦組みではもう少し長くても問題ない。

行間は厳密に3%と言うよりも、見た感じで設定する。制作物の雰囲気にもよるし、文字サイズにも影響される。文字サイズが大きいほど、行間は狭くしたほうがバランスがいい。

一連の誌面のなかでは行間を統一するようにしたい。雑誌などはレイアウトに動きがあるので1行の文字数は変わることもあるが、なるべく近い文字数にしておいたほうがよい。

余談：
2000年前後のWEBサイトは、スタイルシートが普及していなかったので、行間0%で非常に読みにくかったが、現在の芸能人ブログのようなやたらと改行し、行間をあけるのもまた読みにくいと思う。ネット特有の文化とも言えるが。

絞り込むことが重要であることは、自己啓発やマーケティング、ビジネスに興味がある人は大抵知っているだろう。具体的なターゲットをイメージしながらデザインをすると、デザインにマニアックさや深みが出て、ダイレクトに響くものになる。デザインにおいてターゲット選定は必須だ。

しかし、なかなかできていないのではないだろうか。

絞り込むということは、それ以外を捨てるということだ。それには、数ある選択肢の中からひとつを選ばなければならない。そして、ひとつを選ぶには、確固たる信念、あるいは決心が必要になる。

たとえば、何か商品を開発するとき、年齢層も所得もさまざまな多種多様な人をターゲットにしたくなる。
そこには、いろんな可能性がある、と思いがちだ。しかし、ユーザー目線に立ってみると、そんな曖昧なターゲットの商品が魅力的だろうか？　そもそも、そんな商品があるだろうか？

あなたの身の回りにあるものすべての商品はターゲットが絞られているはずだ。
誰もが食べているお米を例に見ても、高級なブランド米と低価格なノーブランド品ではターゲットが違う。販売店も違う。

ターゲットを絞ったつもりでも、女子高生やサラリーマン、というくらいでは絞れていない。女子高生にもサラリーマンにもいろいろある。電車で通うまじめな女子高生と、egg系ギャルでは違うし、家族第一のマイホームパパなサラリーマンと、輸入車が好きな独身サラリーマンではかなり違う。
年齢で絞れる場合もあるが、趣味でしぼったほうがいい場合も多い。

では、どうやってターゲットを絞り込むかというと、自社（クライアント）の得意分野から伸ばすのがいい。客観的に見た強みや個性も大事だ。

無骨なバイカーのライフスタイルをウリとしているハーレーダビッドソンが、カジュアルラインやガーリーポップなラインを出したら、ブランドイメージを壊すことになる。
吉野家が富裕層向けの5,000円以上の高級牛丼を出しても売れないだろう。

自社（クライアント）の強みを知り、それに呼応する顧客ターゲットを絞り、デザインに活かす。

Jack of all trades, master of none.-多芸は無芸-
昔から言われてることだね。

デザインには、伝統的な美しさだけでなく、トレンド（流行）をとりいれることも意識したい。

伝統的な美しさとは、先人たちが美のイデアとして追い求めてきたもので、人間の脳の中にもともとある美的感覚とも言える。デザインのセオリーとして研究されてきており、いつの時代も変わらない美しさである。
たとえば、黄金比がなぜ美しいのかはわからない。美しいと感じると比率の一つを確立し、黄金比と呼んでいる。

これに対し、トレンドというものもある。少し前にはWEB2.0なデザインというものがトレンドだった。反射、角丸、やわらかめなグラデーション、ポップなカラー、ストライプパターンなどだ。とくに反射は簡単にそれっぽく見えるので、いたるところで見かけた（上の画像が反射の実例）。
当時はそれがクールだったが、今はどうだろう。かえって野暮ったく見えるかもしれない。

所詮、これらは小手先の技なので、簡単に真似できるがゆえに、簡単に廃れる。
かと言って、基礎だけでは目新しさがない。

デザイン、とくに広告では、的確に伝えることだけでなく、目を引くことが求められるので、新鮮さやインパクトは不可欠と言える。

それを実現するためには、常にアンテナを張りながら、トレンドをきちんと知っておく必要がある。

よく、20代後半をすぎた人で、自分が若い格好をしていると思っている人でも、実際の若い人からは古いファッションに見えているということがある。それはつまり、その人の時代の若い格好であり、今の若い格好では無いのだ。

流行は繰り返すが、まったく同じではなく、常に新しい要素が盛り込まれながら繰り返す。華美なものが流行し、シンプルなものが流行し、そしてまた装飾の多いもの、と洗練されながら繰り返す。パンクファッションも、現代風にアレンジされたものと当時のものとは違う。

デザイナーは、伝統的なもの、基礎などを固めながらも、時代の流行に敏感であることが求められる。

ちなみに今は手書や自然素材を使ったアナログ感が多いね。

何事においても、できるようになるまでに、3つのステップがある。
今回は気分を変えて、料理に例えてみる。オムライスにしてみよう。

１．なんとなくわかる

そのオムライスがおいしいかどうかがわかるということ。
たとえば、コンビニのオムライスと、レストランのオムライスのどちらがおいしいかを判断できるかどうか。
例外はあるかもしれないが、ここではレストランのほうがおいしい、ということにしておく。
この段階が判断できる人は多い。とくに大人になると舌が肥えてくる。

デザインで言えば、いいものを見分ける目だ。

２．どこが違うかわかる

なぜ、そのオムライスがおいしいのか。
ソースの分量、チキンライスがパサパサしているかどうか、タマゴが半熟かどうかなどのわかりやすい違いもあれば、ソースにフルーティーな甘みがあり、やさしくふわふわなタマゴとジューシーなチキンライスに絡み合うことでとろけるような食感を感じさせるという複合的で感覚的な場合もある。
ソースやチキンライスの違いはわかりやすいが、ふわふわ半熟タマゴにおいては、ソースとチキンライスと絡めて食べることが多いので、よほど気にして味わわなければ、違いはなかなかわからない。ほんの少し生クリームを入れたり、かき混ぜ方が異なったり、タマゴ自体にこだわっていたり、些細なことに思われるようなことが、最終的なおいしさに大きく影響する。
フルーティーなソースの素材はなんだろう？　ジューシーなチキンライスはどうやって作ってるのだろう？　と思いをめぐらせてみる。

デザインで言えば、なぜいいのかという理由だ。写真に統一感がある、文字詰めが美しい、全体の色使いなどなど。具体的な理由を多く言えるほうがいい。
理由を見つけることが大事。

３．作ることができる

違いがわかるようになったら、作ることができるようになるまであと少しだ。いや、結構長い道のりかもしれないが、違いがわからなければ作ることができない。自分で作ったオムライスが、コンビニ以下なのか、レストランレベルなのかわからなければ、レストランの味は出せるはずが無い。
違いのわからない人は、安いタマゴで見た目だけマネするだろうが、それでは絶対に越えられない壁がある。そして、その壁があることにすら気づかない。
形だけマネしても、それはできるとは言わない。味の判断ができない人に対してはごまかせるかもしれないが、結構味の違いが判断できる人は多いのだ。

デザインでも同じ。形だけマネしても、一部の人はごまかせても、「何か違う」と感じる人は多い。

しかし、世の中には形だけマネする、ということを徹底したものもある。
レシピやマニュアルやセオリーだ。これについては、別の機会に。

カーニング（文字詰め）は文字と文字の間を調整してバランスを整えることで、グラフィックデザインにおいて必要不可欠だ。文字を美しく効果的にレイアウトすることをタイポグラフィと言い、フォントの良し悪しもさることながら、文字の間隔次第でぐっと美しくなる。

文字はそれぞれ形状が異なるので、隣りあう文字によって空き具合が異なる。
日本語では、とくにカタカナの「ト」は横組みの場合に左のスペースが空いて見える。他にも「イ」「ナ」の後に「ノ」「ム」が続く場合（「ナノ」や「イム」）はベタ組みだと空いて見える。
欧文も同様にいろいろなパターンがあるが、もともと横書き文化なので横書きには強く、リガチャという合成文字（合字）もある。fi、flなどでfのでっぱり（フック：fook）とiの点がfとくっついたりするのがリガチャだ。
ちなみに日本語も縦書きのリガチャがあり、麻呂（麿）がこれにあたる。使うことはほぼ無いだろうが。

日本語フォントも欧文フォントも優良フォントには詰め情報が入っているが、それだけでは完璧ではないのでデザイナーの調整が必要になる。

上画像の１はそのまま打ち込んだだけの状態。２は字間を全体に調整し、３で各文字の間を微調整した。欧文はもともとカーニングがされていてきれいだが、日本語はトの左の隙間が気になる。
日本語（ムスコット）は詰め気味に調整したが、欧文（MUSCOTTO）はやや字間をあけて調整した。
調整方法は用途による。同じフォントでも、詰め方次第で上品にも活発にもなる。

カーニングやリガチャが使えなければ、こういったタイポグラフィはできない。
そこがグラフィックデザイン系のソフトとそうでないソフトの大きな違いだ。

文字を詰めよう。

デザインの基本として、文字を小さめに組むときれいに見える。しかし、小さすぎると読みにくくなる。そこで、可読性を保てる最小文字サイズを知っておくと 何かと都合がいい。基本的にはゴシック体（欧文ははサンセリフ）のほうが可読性は高いので、明朝体（欧文はセリフ）に比べて若干小さくできる。
人によって多少異なるだろうが、自分の中の基準を紹介する。

まず、WEBは基本は12pxで、最小で10px。アンチエイリアスのON・OFFによっても可読性は異なるが、10px以下は使用しない。テキストならブラウザで文字を拡大できるが、画像の場合は、拡大しても読めないのでとくに意識しておきたい。
私がWEB歳とを作るときは、本文は12pt、小さい文字で10ptを基準にしている。

印刷物の場合は、9Q≒6ptが普段使える最小サイズだ。印刷物は近づけば判別できるので、意外と小さいサイズでも読める。7Qくらいまでは使うことがある。
単純に文字サイズだけじゃなく、色にもよる。6pt以下の場合は、K60％などだと、網点で字形が崩れるから、リッチグレーにするか、版ズレが気になる場合はグレーは使わない。
自分の例で言うと、ブラザー印刷の社内報は本文11Q、キャプションや注釈で9Q。名刺の住所などは6pt～5.5ptで使うことが多い（名刺はイラストレーターで作るのでpt）。

WEB、印刷物ともに、場合によってはもっと小さいサイズで使用することもある。読ませるための文字ではなく、グラフィックデザインの一部として使用する場合だ。欧文でごにょごにょっと何か文字が書いてあるとそれっぽく見えるので、装飾的に使うのだ。

当然だが、読ませる文字として使用できる最小文字サイズは、ターゲットユーザーやテイストによって異なる。高齢向けや子供向けなら大きめになる。重要のは、ひとつのプロジェクトに対して一貫したコンセプトを持って決めておくことだ。

身近な印刷物の最小文字サイズを気にしてみると、結構面白い。

—