デザインの独学は何からすれば良いの?未経験でwebデザイナーになった僕の独学方法を紹介します!

デザインの勉強方法design

takato@enjoying_freeです!

デザイナーを目指している方やデザイナーの方は日々勉強されているかと思います。最近は多くのオンラインスクールがありますが、独学で勉強されている方も多いことでしょう。

僕は未経験からwebデザイナーになりました。その際独学で勉強してからテックキャンプに通いました。

転職後も独学でデザインのスキルを向上させています。

今回は独学で勉強されている方向けに、デザインとコーディングの2つの独学方法を紹介します。

独学に不安を感じている方や勉強方法のわからない方の参考になれば幸いです。

takato
takato

デザイン・コーディングの独学の仕方を紹介します!

デザインver

はじめにデザインの独学方法を3つ紹介します。

良いデザインを多く見る

1つ目は良いデザインをたくさん見ることです。

デザイナーは良いデザインとそうでないデザインを見分けるスキルが必要です。何が良いデザインなのかを直感的にわかるようにする必要があります。

良いデザインが何かを知らないデザイナーが、良いデザインを作ることができるはずがないですよね。


世の中には多くのデザインが出回っています。電車に乗れば車内広告がありますし、街を歩いてると広告が目につくと思います。

普段無視してしまいがちな広告を見ることでデザインを見る回数が増え、良いデザインと悪いデザインの違いが少しずつわかってくると思います。

毎日電車に乗ったら5つの車内広告を見るなど、自分なりのルールを作ってデザインを見る頻度を高めてください。

デザインがどのくらいのペースで入れ替わっているかがわかるかもしれませんね。

デザインを観察する

2つ目はデザインの観察を行うことです。先程の良いデザインを多く見るの続きの内容になります。

デザインを見た時に何かしら感じることがあると思います。誰をターゲットにしているかやどういう印象を与えたいかなど感じ取れるかと思います。

そしたらなぜそう感じたのか、デザインを観察してみてください。

例えば女性向けの広告だと感じた場合、色・フォントの種類とサイズ・使用している図形とイメージ画像など、それぞれどのようなものを使用しているのかを観察し分析するのです。

感じた印象からデザインを観察することで、どのようなデザインを作成すれば感じた印象を与えることができるのかがわかります。

そうすることで印象ごとにデザインの引き出しが蓄積されていきます。

観察するには時間が必要なので、電車内の広告やチラシなど、見る時間を作ることのできるデザインを観察してください。

多くのあしらいをインプットする

3つ目は多くのあしらいをインプットすることです。あしらいのインプットが増えるほどデザインの引き出しが増えます。

あしらいのインプット方法は、本やデザイン集を見ることです。

グラフィックデザインならPinterestがおすすめです。かっこいい広告デザインやアイキャッチ画像をすぐに見つけることができます。

webデザインであればmuuuuuというwebデザインギャラリーがおすすめです。ジャンルやカラーから多くのwebデザインを探すことができます。

本からのあしらいを学ぶことができます。雑誌やデザイン系の本から勉強することができます。

デザイン系の本であしらいをインプットするなら、あたらしい、あしらい。という本がおすすめです。この本は新米デザイナーが作成したダサいデザインをベテランデザイナーがかっこよくする内容の本です。

どの部分がダサく、どうすればかっこよく見えるのかを学ぶことができます。僕もこの本を読んで日々勉強しています。

コーディングver

続いてコーディングの独学方法を3つ紹介します。

検証ツールでインプット

1つ目は検証ツールでインプットする方法です。検証ツールとは見ているwebサイトがどのようなコードで作成されているかを調べることができるツールです。

SafariやChromなどのブラウザで使用することができます。(Chromは右クリックで検証を選択すると検証ツールを使用することができます)

作成方法のわからない装飾があった時は検証ツールを用いてどのように作成しているのかを調べます。無料でサイトの一部中身を知ることができるので、使わない理由はないです。

先程紹介したmuuuuuで気になる装飾を見つけたら検証ツールでコードを勉強する方法が良いと思います。


また、コーディングでサイトを構築する際も検証ツールを使用すると効率よくコードを書くことができます。

検証ツール上でcssを記入して、望み通りの装飾ができたらコードをコピペします。このようにすることでいちいちリロードして希望通りの装飾になっているか確認する手間が省けます。

検証ツールを使い慣れていない方は、是非使用してみてください。

オンラインツールでコーディングの勉強

2つ目はオンライン学習ツールを使用してコーディングの勉強を行う方法です。今はプロゲートドットインストールなど、一部無料でプログラミングの勉強を始めることができます。

料金も1ヶ月1,000円しないくらいなので、自己投資としても始めやすいと思います。さらにオンラインなのでいつでもどこでも勉強することができます。

僕もプロゲートで勉強していました。簡単なHTMLとcssは無料で学ぶことができます。高度な内容は他の言語は有料会員になる必要があります。

コーディングの勉強をする際に意識してほしいことは、教材を何周もすることです。1周で学び切ろうと思わないでください。

コーディングは数学の勉強とにており、自分の力で課題解決を行う力が必要です。何周も行うことで頭だけではなく感覚的に解決策を身につける必要があります。

また、コードを暗記しようと思わないでください。よくノートにコードの名前と意味を書いている方がいますが、ぶっちゃけ非効率的な勉強方法です。

ノートにまとめて暗記するのではなく、自分の手で何度も問題を解いて感覚的にコードの意味を覚えてください。何度も勉強することが大切です。

学んだコードをアウトプットする

3つ目はアウトプットすることです。

人はインプットしたことをアウトプットすることで知識の定着に繋がります。そのためインプットして終わりではなく、アウトプットするまでが勉強であると考えましょう。

僕は学んだコードがあったらこのブログにアウトプットしています。ブログはアウトプットの場であり集客・収益の場でもあります。

デザイナーやコーダーはブログをやることをお勧めします。

レンタルサーバーやドメインを取得するのが面倒な方は、noteをやってみると良いと思います。noteはサーバーやドメインを取得しなくても記事を作成することができ、記事自体を販売することもできます。

アウトプットにもなりますし収益にも繋がるので、ブログを立ち上げるのが面倒な方にお勧めです。

また、直接人に教えてみるのも大切です。プログラミングの勉強を始めた人が周りにいれば、その人に教えてあげてください。

人に教えることで知識の定着になりますし、自分が学び足りない部分を知ることもできます。

是非行ってみてください。

最後に

以上がデザインとコーディングの独学方法の紹介でした。

デザインの独学はまずは目を鍛えることと多くの良いデザインをインプットしてデザインセンスを磨いてください。

コーディングはサイト集やオンラインツールで何度も勉強して、アウトプットしてください。このように勉強することで、独学でもスキルを向上させることができます。

それでも不安だという方は、プログラミングスクールに通ってみることを検討すると良いと思います。しかしスクールは値段が高いので、本当に通う必要があるのかをしっかりと検討してください。

僕自身のテックキャンプというプログラミングスクールに通いました。そこでデザインとコーディングを勉強してwebデザイナーに転職しました。

説明会に行くだけでしたら無料なので、もし興味のある方はお話だけでも聞いてみるのは良いかもしれませんね。


takato
takato

勉強する習慣を作るのが難しい場合は、友達と一緒に勉強する時間を作ってみよう!