Astronaut

暮らしを豊かにするWebメディア。科学、ポルトガル語、アニメ、ブラジル、生活の知識etc、取り扱っております。

【独学デザイン】センスゼロのノンデザイナーがデザインを学ぶ超具体的な4ステップ

【スポンサーリンク】

どんな職種の人でもデザインの基本はある程度マスターしておきたいもの。一度身につけてしまえば一生使えるものもあるだろうし、会社勤めの人でも見やすい資料やPowerPointを作成する時にはデザインの知識は役に立つ。
僕の場合ははてな界隈では有名なtsukuruiroiroさんの影響でグラフィックデザインを少しずつ学び始めたが、今までずっと理系で来ていたので、同じようなルートで来た人はデザインというものに触れる機会はめったになかったのではないだろうか。
ただ、いざデザインについて学んでみようと思っても、ネットで調べてみれば、デザインに関する記事はいくらでもあるし、いきなり作り始めるわけにもいかず、どのように学べばいいか分からずに立ち止まってしまう人も結構いるのではないだろうか?
この記事はそんな人を対象にしてある。すなわち全くデザインの知識がゼロの人が迷わず最速でデザインセンスを身につけられる、そんな具体的な方法を書いていこうと思う。これはあくまで僕がある程度実践し、今なお継続的に練習している内容であるのでもっとこの方がいいというものがあればいくらでも自身で考えてやってもらえばいい。
それでは。

センスゼロのノンデザイナーでもデザインセンスを身につける
具体的な4ステップ

①デザインの基礎、ルールを学ぶ
②良いデザインを模倣する。
③自分で作ってみる
④更に良くする方法を探し実践する。

このようなステップで学んでいく



STEPⅠ:デザインの基礎、ルールを学ぶ。

僕は昔、デザインは自由で無限だから、自分の思うようにやればいいと思っていた。そして美術の成績はいつも2だった。だが実際はデザインにはまず初めに知っておくべき明確なルールがある。全く知識がゼロの人はこれを知ってほんの少し実践するだけでも自分のデザインがより洗練されたものに見えるだろうし、無難に良いものを難なく作れるようになる。具体的にはデザインの4つの原則として広く知られている。こういったものを身につけるのはやはり本が一番。ここではデザインの基礎、ルールを学ぶのに使いやすい本を二つ紹介しようと思う。

Ⅰ:ノンデザイナーズデザインブック

f:id:kenya316:20170815131357j:plain

Tsukuruiroiroさん絶賛のデザインの王道の本。初心者に易しくなるように余計なことが書いてない。デザインの骨子が詰め込んである。初心者がこの本で身につけたいことは次の3つくらいではないだろうか。


⑴4つの原則
〝近接″、〝整列″、〝反復″、〝コントラスト″という4つの原則を著者はまず初めに紹介している。この4つの原則がしっかり適用されているか、一つ一つチェックするだけでも洗練されたデザインに見えるのが本当にすごいし、不思議。実践方法や注意点が具体的に書いてあるのでとても分かり易い。
本を買いたく無い!という人はこちらのサイトなどで割と詳しく解説してある。



⑵色の基礎
いきなり自分で何かを作ると思ってもどのような色を使えばいいか分からない。それはどんな色の組み合わせが調和するか、またこの色は何を伝えるのに適しているか、特定の雰囲気を持たせるためには何色がいいかなど、ただ単純に知らないことが多い。赤い部屋に居れば熱く感じるなど、色が人間の心理に与える影響は大きい。ここではカラーホイールから、補色、類似食、CMYKとRGBの違いなど本当に基本的な色の知識を学ぶことができる。


⑶タイポグラフィ
書体についての基礎知識。例えば、日本語であれば、明朝体とゴシック体があるが、比較的長い文章を読んでもらうにはどちらがいいだろうか。広告の最も目立つところで人目を惹く、〝魅せる文字″にはどのような書体がいいのか。それらを効果的に組み合わせるにはどうすればいいのか。こういったことを知っているだけでもいざ作ろうと思った時に迷わず道筋を立てて考えられるようになる。 ちなみにパソコンに最初から入っている書体だけでは貧弱すぎるのでこの際やったことのない人はネット上から拾えるフリーフォントを良さそうなものを一気のダウンロードしてしまおう。
以下のサイトなどでたどっていけばダウンロードできる。
一番下はダウンロードしたフォントをパソコンにインストールする方法だ。




⑷その他
上記の知識を名刺、レターヘッド、チラシ、ニュースレター、パンフレット、新聞広告、webサイトでどのように活用するか一つ一つtipsと共に紹介されているのでとてもありがたい。



Ⅱ:デザイン入門教室

f:id:kenya316:20170815131403j:plain

割と最近の本だけど、この本がめちゃくちゃいい。ノンデザイナーズデザインブックは元々洋書を翻訳したものなので、日本人向けには若干不足なところもある。この本の中にも4つの原則は出てくるが、もっと細かく実践的なレイアウトデザインを網羅している。デザインについての他の本と比べても、これだけ丁寧にデザインの基本について分かり易くまとめてある本はなぜかほとんどないと思う。
以下この本で身につけたい知識をまとめる。

⑴デザインの流れ
基本的にデザインはそれ自体が目的にはなり得ない。そもそも伝えたい内容があって、それを効果的に伝えるためにこだわるのがデザインの本質だ。素晴らしいデザインを通して何を伝えたいのか、どの部分を見た人に印象付けたいのか、その目的が必ず先立たないといけない。
この本に書いてあるデザインの流れをまとめると

デザインの流れ
①情報の整理
②レイアウト1: 版面・マージンの設定
③レイアウト2:グリッドの設定
④レイアウト3:優先順位の設定
⑤レイアウト4:強弱の設定
⑥配色
⑦文字・書体選び
⑧もっと見やすくする。

いくつか作ってみればわかると思うが、一番大事なのはたぶん①の工程。すなわちなぜこの制作物を作るのか、という問いを自らに突き詰めてみると良い。明確に答えられるのであれば、きっと方向性はあっている。そのために最高の効果性を発揮するものを作ろう。


⑵さらに細かいレイアウトデザインを頭の中に入れる。
グリッド、重心、余白の使い方、シンメトリー、黄金比、白銀比など、常に取り入れるわけではないが、制作物によってはこのようなノンデザイナーズデザインブックでは詳しく解説されていないレイアウトデザインを用いることでより良いものに出来るかもしれない。


⑶目的で選ぶ写真の選び方と使い方
言葉で説明するよりも、写真や図の方が一瞬に伝わる情報量が桁違いなのはすぐに分かると思う。写真の配置だけでなく、トリミングの仕方や裁ち落としなどによって制作物の印象はガラッと変わる。そういった内容を知ること


⑷個々の色が持つイメージとその組み合わせ効果
赤は暖かい印象、青はクールな印象、紫は上品な印象、緑はフレッシュな印象。色によって人々が受ける印象は異なる。また明度や彩度、トーンによる組み合わせを考えるとそれは膨大な量になる。何種類かの色を組み合わせても自分の制作物にピッタリのものが選べるように色についてさらに詳しく知る。
Tsukuruiroiroさんのこの記事はとても参考になる。




⑸書体の個性、魅せる文字の作り方
文字によってこのようなイメージがある。
文字をアイコンにして視覚的に分かり易くする方法も少しずつ引き出しを増やそう。


⑹インフォグラフィック
インフォグラフィックとはきれいな図やグラフなどのこと。その他にもチャート、表、ピクトグラムなど、思ったよりもいろいろある。こんなことまで解説してあるのは本当にすごいと思う。


この本2冊だけでもデザインのあまりにも多くのことが勉強できる。何冊も手を出すよりも良い参考書を何度も見直し、確実に自分のものにする方が力になる。
またここで本の内容を完璧にしようと思う必要はない。というかそれは無理に近い。5、6割は頭に入ったかなというくらいで次のステップに進む。その中でまた振り返り、完全に自分のものにしていく。





STEP2:良いデザインを模写する

デザインのルールを学んだからと言ってゼロからオリジナルのデザインを作り出すのは簡単ではない。ほとんどの人が頭を抱えることになるだろう。そこで既に存在するデザインに多く触れる。そしてこれは素晴らしい!と思ったものを模写すると良い。模写とはすばらしいデザインを見ながら、同じように手書きで別の紙に書き写すということだ。この、〝自分の手を動かして模写する″というのがとても効果的である。これなら何か作らないといけない、と焦ることなく簡単に始められる。
以下は僕自身が行っている模写の仕方

①方眼紙を使う。
グリッドが既にあるので手書きでも比較的整列したものが模写しやすい。ダイソーで売っている方眼紙がとても気に入っていて僕は何にでも使う。
②前の2冊で学んだテクニックがどのように使われているか確認する。
4つの原則に加え、その他のレイアウトデザイン、また使われている色が与える印象はどうか、書体はどのようなものが何種類使われているか、どのように組み合わされているか、など。
③その他美しいと思った理由など感じたことがあれば考察を書きとめる。
④本で学んだ内容が自分のものになっていないと感じる時は本を見直そう。

こんな感じ。そんなに難しくない。
実際には模写しやすいものから始めると良い。

Ⅰ:名刺をまねる

名刺は色んなサイトにテンプレートがあるのでパソコンを同時に広げながら、気に入ったデザインのものを模写していく。名詞はとてもシンプルなのでパターンはそれほど多くないけれど、書体や色まで考慮すればそれでも多種多様のデザインで作られていることに気付く。実際に書いたものはこんな感じ。

f:id:kenya316:20170815110513j:plain

模写した名刺の下に感じたこと、発見したことなどの考察を書き込んでいく
これを50個~100個くらいやれば、自分で作ろうと思った時でも容易く、頭の中にこんな配置で要素を並べていこうというのが瞬時にいくつも出てくるようになる。
以下は名刺デザインの参考サイト(テンプレートなどがある)




Ⅱ:チラシデザインをまねる

今度はチラシ、ポスターなどを模写してみよう。方眼紙に書くサイズはある程度、細部まで書き込めるくらいの大きさならなんでもいい。
以下は実際に書いたもの。

f:id:kenya316:20170815110506j:plain

ポイント①:方眼紙を使う。
先ほども書いたけど、方眼紙はすでにグリッドがあるので、手書きでも模写がしやすい。文字の間隔、写真の配置など、出来る限り正確に描くように心がける。

ポイント②:神経質になりすぎない。
手書きなので、細かい文字まで全て同じように描くことは不可能に近い。必要なところを必要な分だけ細かく模写しよう。基本はレイアウトがどのようになっているかを把握しながら描くと良い。文字の配置、写真や絵の配置。よく見れば至る所にデザインの4つの原則の整列や近接、コントラストは使われていることに気付くだろう。それに気づくことが大事。

ポイント③:考察を書く
・何故このデザインを自分は気にいったのか、どこに惹かれたのか?
・色の使い方は?使ってある色の量の比率はどのくらいだろうか?補色を組み合わせているか、または類似色を組み合わせているか、トーンはどうか?
・パッと見たときにどこに視線が行くか?それはなぜか?など。

考察は考えればいくらでもある。出来る限り多く、自分の頭で理解し、デザインの細部が作り出す効果を実感しよう。そのインプットが必ず後々生きてくる。例えば、ポスターや広告であれば、人の目に触れるのは一瞬だ。それでも数多ある広告の中で、見た人をひきつけ、その脳裏に焼き付かれなければならない使命がそのデザインにはあるはずだ。

Ⅲ:ほかに何かあれば

その他に何か模写したいものがあればどんどんやってみよう。映画のポスターでもいいし、個人的にはハードカバーの本の表紙などにとてもセンスを感じることがある。



STEP3:良いと思ったデザインを参考にしながら、自分用に名刺、ポスター、(webサイト)などを作ってみる。

さて、ここまでの工程をこなしたら、全く何の知識もなかった人でもデザインのことが分かるようになってくると思う。そろそろ実際に自分で作る練習をする。名刺でもポスターでもいいし、出来る人ならwebサイトとかでもいい。STEP1で紹介したデザイン入門教室の最初の方に載っているデザイン制作の流れを参考にしながら、目的を定め、何を伝えるためのデザインなのかを明確にして作り始めよう。

Ⅰ:制作ソフトをインストールする。

普通はillustratorとかphotoshopとかを使うんだろうけど、僕はデザイナーじゃないのでそんな高価なものは使わない。勿論お金に余裕があるならば、illustratorを購入してもいい。一応illustratorの無料期間を利用して一通りの使い方は勉強したが、今はもう使っていない。無料ソフトであれば、Inkscapeでも十分に紙面デザインに利用できる。



そんなに難しくないのでこういったサイトにある使い方を一通り学んでおくと良い。後は適当に使っていれば、主要な機能は慣れてくる。

また僕はまだ試していないが、最近はCanvasというWebサービスが結構好んで使われるらしい。その内使ってみようと思う。〝サルワカ″さんの記事がわかりやすいかな




Ⅱ:オリジナルデザインのものを作る!!

何でもいいけど、実際につくってみよう。
例えば名刺だったら、
名刺の場合
職業:____
名前:____
役職:____
住所:____
メール:____
電話:____
LINE:____

項目をこんな感じにして自分のものを当てはめる。名刺の目的は大体決まっているのですぐに作り始めても一向にかまわない。上の要素をどのように名刺の紙面上に配置するか。もう既にいくつもの名刺を模写してきたので、何パターンも頭の中で思いつくだろう。名刺の場合、名前が必然的に優先順位が高くなるので、他の要素に比べて大きくなる可能性が高い。後はどのような色や背景、写真を組み合わせるかを考えて、上で書いた自分の情報はは固定したままで何通りも作ってみれば、デザイナー気分になってくる。色んなデザインの物を作って保存して後で眺めるととても感慨深い思いになる。

ちなみにInkscapeで名刺の枠を作るときは以下の記事に書いてある感じで出来る。



広告の場合
キャッチコピー:____
説明文:____
魅せる文字:____
日時:____
場所:____
ロゴ:____
写真:____

といった要素と目的を決めて、何通りも作ってみる。作って再考し、修正し、洗練させる。

・4つの原則はしっかり適用されているか。ただそれも理由があって意図的に崩すのであれば全く問題ない。自分の制作物に自信を持つ。後でいくらでも修正はできる。
・自分のイメージ、創り出したい雰囲気をしっかり作れているか。
・その制作物を見たときの視線の流れはどうだろうか。ぱっと見て、お!いったい何のチラシだろう?と気になるようなものに出来ているか。
・色の使い方や余白は適切だろうか。

他にも作ってみたいものがあったら、どんどん作ってみよう。



STEP4:さらに上を目指す。

本当はSTEP3までで終わりだが、デザインを勉強し始めると身の回りのいたるところにそれらが利用されていることに気付くようになる。僕は元々そういったものには死ぬほど疎い人間だが、それでも雑誌を見れば、やはりどのように写真が配置されているかをチェックするし、ページをめくっても同じレイアウトが使われていて、4つの原則の〝反復″が使われていることに気付き感動したり、本の表紙のタイトルと写真から内容を予測してみたり。企業がデザインの重要性に気付いてからその価値は一気に上がった。人の目は自分が見たいと思うものを見たいし、それはやはり美しいと感じるものだ。生まれつきセンスのある人もいるけど、誰でもセンスを身につけることは出来るはずだ!と思い、時間があるときに少しずつデザインを学んでいる。
 さらにブラッシュアップするには、創り続けるのが一番だろうけど、具体的にはどのような方法があるのかを考えてみた。参考程度に。

Ⅰ:友人に見せて意見を聞いてみる。

自分がこれはいい!と思っても、人によって感性は様々だ。万民がyesというものなんて作れないけど、いろんな人の話や意見を聞くことは出来る。そこから新しい視点を養うことで自分のデザインを疑ってみることができると思う。

Ⅱ:引き出しを増やす。

ブックオフに行けば、デザインに関する本が大量に安く手に入る。そんなにお金はかからないので思い切って何冊かかってみると良い。

個人的には

f:id:kenya316:20170815131408j:plain

とか



とかがすごいおススメ。

名刺デザインの本でとても良かったのは、

f:id:kenya316:20170815131347j:plain

まぁ他にもいくらでもありますが。

Ⅲ:ネット上にあるデザインの記事に人通り目を通す。

ネット上にはデザインについて解説してあるサイト、ページが死ぬほどある。 全てに目を通すことは出来ないし、時間の無駄なのでいくつか本当に良質なサイトの記事に目を通しておけばいいのではないかと思う。記事のタイトルというよりも信頼出来そうなサイトの記事に一通り読むだけでもとても勉強になる。 繰り返すがあまりいろんなサイトを徘徊しても時間の無駄なので良いサイトに絞って勉強しよう。



こういうサイトそのものに本当に憧れる。







最後に。

今回はデザインの独学についての記事を書きました。ハッキリ言って僕も素人なので、デザインについて書く前にお前のブログのデザインを何とかしろよ!と言われそうですが、まったく気にしてはいません。僕がデザインについて学び始めたのは単純なあこがれのような思いからです。ネットを徘徊していてすごいスッキリしたサイトなどに出会った時はそのシンプルでありながら細部まで作りこんである様に圧倒されます。あのようなセンスがいつか身につけられればいいなぁと思っています。

じゃあ、今回はこれまで。