デザイナーの学習法!pinterestを使ったトーン分析の具体的な方法をご紹介

デザイナーの学習法!pinterestを使ってトーン分析の具体的な方法をご紹介

今回はデザイナーの学習にオススメなpinterestを使ってのデザイントーンの分析方法をご紹介します。今回の作業工程は以前にこちらの記事で雑誌を解体したのとほぼ同様のアプローチで進めます。

初心者デザイナーにオススメのデザイン分析を行おう

初心者デザイナーにオススメのデザイン分析を行おう

2020.11.13


内容としては、パッと見たときにどんなデザイントーンなのか、というイメージを形作っている細部の構成要素にスポットを当て、どういった要素が集まってデザインができ、みている人たちがどのようにそのデザイントーンを感じているのか?といったところを注目し分析していきます。

この分析でデザインを形作っている要素やレイアウトが理解できれば、実際に自分でそのトーンのデザインを作る時に大きな助けになる、ということです。

B級デザイナー
デザインを作るときにそのデザインの部品を調べてどのような組み合わせで作られているのか、作り方を覚えるようなイメージですね!

 

pinterestで素材を収集

 
まずはpinterestを使って素材の収集を行っていきます。まずは今回分析を行うトーンである「日本らしい、和っぽい」と感じるデザインを収集していきます。

こちらのボードを参考に


ちなみにpinterestを使ったデザインの分析作業をこれから始めるに当たって、可能であれば新しいアカウントで収拾をすることをオススメしています。これは、新しくアカウントを開設して始めた方が、既存のアカウントにボードを追加して収集するよりも収拾効率がよくなるためです。

これは新しいアカウントの方がpinterestのレコメンド機能を最大限に活用できるため。

例えば今回のように和のデザインを収拾するつもりであれば新しいpinterestのボードに、和のデザインをピン(リピン)していく方が、スムーズに収集できます。

すでにアカウントをお持ちの方の場合、様々な内容、テイストのボードを作っていると思うので、このレコメンド機能を最大限に使えない(=すでにあるボードなどのレコメンドも含んでしまうため)ということですね。

収集にあたっては、pinterestのサブボードの機能を生かして作っていくと後からの管理もしやすいのでオススメ。こちらのpintarestの機能についてはまた別の記事にまとめます。

収集後、分析を行う

収集したら集めたものを分析していきます。まずは収集したボードを俯瞰で見ていきましょう。俯瞰で見ることで各ピンに共通したデザインやパーツ、要素の傾向が見つけやすくなります。

俯瞰で画像を見たあとは個別の画像、さらに個別の画像のさらに細部の細かいデザインへ、とどんどんズームインしていくように見ていきます。

見ていく内容としては

・写真の使い方
・書体使いは
・レイアウト
・ホワイトスペースの使い方
・他のトーンのデザインでは見られない固有の特徴があるか

など。検証サンプルは多ければ多いほど気づきが増えるので、なるべくたくさんのデザインをボードにピンしていると作業がしやすくなりますよ。
 

和のデザインの構成要素

 それでは具体的に和のデザインにの構成要素ついて分析をしていきましょう。
 

和のデザインの特徴

和のデザインは、写真やオブジェクトなど構成アイテムにわりと特徴がでやすいデザインです。それらを理解して取り入れていくことで「和っぽさ」のテイストを取り入れやすくなっていきます。

ただし、和のデザインは余白とバランスがとても重要。これらをきちんとコントロールできないと野暮ったいデザインになってしまいます。
 

画面のメリハリ

まず、和のデザインの特徴は「メリハリが強い」デザインが多いということ。

参考の下のデザインではタイトルや飾りのオブジェクトが強い印象を与えます(「挑」の字だけが大きく、さらに傾いており画面内に大きな動きを与えています)

さらにその下のデザインも伊万里の写真とタイトルがとても大きく、テキスト情報は小さく抑えられており、さらにキレイに整列されているので伊万里とタイトルとの強いメリハリを生んでいます。

そのほかの要素はかなり抑えられていて、静と動を感じるようなメリハリを感じます。これによって画面内に緊張感が生まれています。
 
f:id:toraneko-design:20180327031716j:plain
 
f:id:toraneko-design:20180327031730j:plain

画面の構図

画面構成には四角や円などのシンプルな形を取り込んだデザインが多く見られます。ガイドの赤い線で表現していますが、和のデザインではシンプルな形状が多く取り入れられています。

下記のように四角や正円などシンプルな形状を画面内に取り入れるとグッと日本らしさが増してみえます。そういえば、日本の文様のデザインなども円や線のシンプルな形状で表現されています。それらの印象も強く影響をしているかもしれません。

下の画像の該当部分を赤で囲っています。


f:id:toraneko-design:20180327063946j:plain
f:id:toraneko-design:20180327063950j:plain
f:id:toraneko-design:20180327063953j:plain
f:id:toraneko-design:20180327063956j:plain
 
 
f:id:toraneko-design:20180327064023j:plain
f:id:toraneko-design:20180327064026j:plain
 

レイアウト

和のデザインはスッキリしつつメリハリを持たせるため、キッチリとバランスをとった配置を行う必要があります。特に経験が浅いデザイナーは要素のメリハリがつきにくく、全体の印象がモッサリとしがちなので、余白をしっかりと作って全体のバランスをとる意識が必要となります。
 
f:id:toraneko-design:20180327092400j:plain
 
f:id:toraneko-design:20180327092415j:plain
 
f:id:toraneko-design:20180327092446j:plain
 

日本には”間(ま)”という言葉があり、独特の空間を重要視する意識がある。デザインでもこのような”間(ま)”を意識して作ることで、余白をただの空間だけでなく意味のあるスペースとして見せることができる。

”間(ま)”はデザインの「バランス感覚」に大いに関係する内容になるので、一度深堀りしてみることをオススメします。

和のデザインが上手になってくるとデザインのバランス感覚も上手くなります。これまで仕事を教えてきた経験的にも、和のデザインを組めるようになった子が余白などを効果的に使えるようになったところを何度も見てきました。

和のデザインは意識的に取り組んでいくとバランス感覚の身につけやすいデザインなのかもしれませんね。

フォント

和のデザインで使用されるフォントは圧倒的に明朝体が多いです。

こその理由は文字の歴史を辿っても明らか。wikipediaによると日本の印刷物にゴシック体が使われ始めたのはここ100年前後ということ。

ゴシック体が正確にいつ出現したかは明らかでない。しかし、『朝日新聞で読む20世紀』(1999年1月1日発行の『知恵蔵』の別冊)に掲載されている朝日新聞の記事を読むと、1919年1月1日付のヴェルサイユ条約について報じる記事で「講和問題」の文字が小さいながらもゴシック体で表記されているのが確認できる(p38より)。また、1936年8月12日ベルリンオリンピックにおける水泳の記事で小さいながらもゴシック体で見出しを付けていることから、この頃には使われる機会が増えていたことが伺える。

wikipedia : https://ja.wikipedia.org/wiki/%E3%82%B4%E3%82%B7%E3%83%83%E3%82%AF%E4%BD%93

 
一方、明朝体が使われたのは、室町時代以降ということになります。仏典や四書などを輸入したものを日本で再版したとされており、その際に明朝体が使われていました。

明朝体はゴシック体に比べると圧倒的に日本に根付いてからの歴史が長いということになります。そのぶん日本の文化に馴染んできたという歴史的背景もあり他の書体に比べ、和のイメージにつながりやすい書体なのかもしれません。

f:id:toraneko-design:20180327092735j:plain
 
f:id:toraneko-design:20180327064256j:plain
 
f:id:toraneko-design:20180327064211j:plain
 
ほかには筆文字のような書体や、
 
f:id:toraneko-design:20180327064240j:plain
 
f:id:toraneko-design:20180327064354j:plain
 

また、図形を連想させるような造形の書体も多く見られます。図形を生かしているのは先ほどの文様と理由は重なるのかもしれませんね。文様のような四角や円を使ったデザインは和的なイメージを連想しやすくなります。


f:id:toraneko-design:20180327064337j:plain
 
f:id:toraneko-design:20180327064421j:plain
 

テクスチャ

背景はベタではなくテクスチャが入ったものがよく使われます。ベタの色に乗算で和紙の質感や文様など、和テイストの素材を入れるだけでグッと和っぽさ(風合い)が増します。和のデザインを作っているけどなんとなく締まらない、と悩んだ時にはとりあえずテクスチャを下に敷いてみることをオススメします。
 
f:id:toraneko-design:20180327093946j:plain
f:id:toraneko-design:20180327093949j:plain
f:id:toraneko-design:20180327093952j:plain
 

和の色味は全体的に渋めの色味が多くなります。和の色味については下記のような本もでてるので一度目を通すといいかもしれません。

また、深みのある色や金色といったような色が使われるのも和の色味の特徴です。

このサイトでも日本の伝統色を紹介しています。動きもあってとても綺麗で見やすいです。もちろんCMYKやRGBの数値も記載されています。

書籍ではこちらの本が和の配色をたくさん収録していて参考になります。

また、和の色味ではグラデーションが使われやすいのもポイント。テクスチャを敷くことでもそうでしたが、和のデザインでは奥行きを意識した表現を心掛けるとよりそれらしく作ることができます。


f:id:toraneko-design:20180327100037j:plain
 
f:id:toraneko-design:20180327100040j:plain
 

まとめ

今回は和のデザインを作るにあたっての参考デザインの収集→分析→制作にあたってのポイントをまとめてみました。pinterestなどでの収集が大事なのはもちろんのこと、さらにそれらのデザインを分析することと、実際に手を動かして作ってみることによって上達につながっていきます。


和のデザインを作る時に特に大切なのは画面内のメリハリ、これは「静と動」や「緊張と緩和」といったような空気感を表現すること、そして画面内の奥深さを表現していくことがポイントになります。

メリハリは配置やレイアウト、奥深さはレイアウト全体や色味、テクスチャなどの多くの要素が関わってきます。そういったポイントをふまえても和のデザインは奥が深く、作っていて勉強になるうえに、楽しいデザインです。

それでは今回はこのへんで。
 
※今回の記事の写真はpinterestで集めたデザインを使用して説明しています。