独学でWebデザイナーになるための方法

Webデザインは無料で独学できます。
インターネットに情報が少ないものはその道のプロから直接学ぶ必要があるが、Webデザインに関しては無料で「参考サイト」も「基本知識を学べるサイト」も「ソフトの操作方法を解説しているサイト」も閲覧できます。
独学するのに十分な情報がインターネットにあるということです。
本記事では、Webデザインを学ぶ上での心構えをお伝えして、実際にどのような手順で学んでいくのかを説明します。
後半では「就職するのかフリーランスになるのか」「よくある質問」にも触れます。
Webデザイナーの定義は曖昧
Webデザイナーは特殊なクリエイティブ職です。
デザインを作った後、一部の単語をクリックできるようにしたり、検索エンジンが文章や写真を認識できるようにしたりする工程が必要になります(コーディングという)。
そのため、ホームページ制作に関わる職業はWebデザイナーの他にもコーダーやプログラマーなどがあります。
デザインの段階をさらに細かく分けることもでき、ライターやフォトグラファー、UI×UXデザイナーなども存在します。
大企業は、上記のような複数の職が協力し合ってホームページを制作していくのですが、最近の傾向としては、Webデザイナーがデザインすべてを担当し、コーディングまで可能という方が増えてきました。
実際、コーディングの知識やSEOの知識がある方が、ホームページに適したデザインができるのは間違いありません。
しかし、デザインのみを担当するWebデザイナーというのも、まだまだ需要があります。
そこで、本記事では、ホームページに必要なデザインをすべて行う者をWebデザイナー(またはWebデザイン)と定義し、写真撮影やコーディングは他者が行うものとします。
超重要!学んでいく上での心構え
デザインは自己満足の世界で、正解はありません。
しかし、クライアントから依頼されて作るデザインには、正解に近いものがあります。
それは、ホームページでサービスの対象(ペルソナ)となる人達に好かれる、伝わるデザインです。
これを踏まえて、Webデザインを学んだり考えたりする時には、以下のことを念頭に置いておきましょう。
一人の意見に固執しない
デザインが正解に近いかどうかを最終的に決めるのは、ホームページを訪れた人達です。
自分を指導してくれた人でも、有名なプロデザイナーでもありません。
どうしても彼らに言われたことを正しいと思い込んでしまいますが、意見を取り入れたデザインと自分が作ったままのデザインを比較(ホームページを訪れた人が、好印象だったり成果が大きいのはどちらのデザインか)してみない限り、どちらが良かったのかはわかりません。
そのため、何でも意見を取り入れるのではなく、意見を参考にして自分が正しいと思うデザインをしていくべきです。
特にフリーランスではなくWeb制作会社へ就職を予定している方は、上司からOKをもらわないとクライアントへデザインを提出できない可能性が高いので、もしかしたら才能が埋もれてしまうかもしれません。
就職するデメリットは、後述します。
常識が常識だとは限らない
例えば、対象がお年寄りのサービスがあり、それのホームページをデザインするとしましょう。
長い文章をやや大きい文字にすることは基本的にありません。スマホで長文を15px以上にすることは非常識です。
しかし、老眼が始まる年齢を考慮すると、長い文章だとしてもやや大きく設定するという常識外のことをする必要があります。
パソコンやスマホで文字の大きさを調整できますが、その機能を利用する人は多くないというところまで考えて、デザインする必要がありますね。
このように、Webデザインにはルールのようなものが多数存在しますが、時にはルールから外れたデザインも効果的な場面があるということを忘れないようにしてください。
トレンドやおしゃれが良いとは限らない
常識が正しくない時があるのと同様に、自分がおしゃれで美しいと感じても、対象には相応しくないことがあります。
対象が誰なのかということを常に考えてデザインしましょう。
おすすめ!実際に学んでいく手順
まずはソフトを購入
最初に述べた通りデザインを学ぶのは無料ですが、デザインをするためのソフトは有料のものを買うべきです。
Web制作会社の多くはAdobeのソフトでWebデザインして(XD)、ロゴやバナーを作って(Illustrator)、クライアントから送られてきた写真を加工して(Photoshop)、動画も編集して(Premiere Pro、After Effects)、コーディングします(Dreamweaver)。
定番ソフトなのでクライアントから、これらのソフトで制作したファイルを納品してと言われることもありますし、機能の面でもこれらのソフトを持っておくべきです。
Adobeのソフトは単体でも買えますが(月額2,480円が多い)、まとめてすべてのソフトが利用できるプランがあります。
それがコンプリートプランで、月額5,680円です。学生は月額1,980円。
Amazonでも買えます。
→学生用コンプリートプラン
→個人用コンプリートプラン
学生以外の方は、通信講座を受けるという方法も手です。
例えば「たのまな」という会社の通信講座を受けると、
通信講座+Adobe利用12ヶ月分
がついてくるのですが、学生以外の方でも学生版のコンプリートプランが利用でき、コンプリートプランの年間費を抑えることが可能になります。
追記:2021年1月7日現在、「たのまな」のキャンペーンは終了してそこまで安くないので、デジハリONLINEをご利用ください。
→デジハリONLINE
無料のソフトで無料の機能を使って制作するのもありだと思いますが、あえてAdobeのソフトを買わない理由はありません、毎月数千円を支払えないほど金銭面に問題を抱えているのであれば、おそらくWebデザイナーという職は適していません。
これらのソフトは、学生は安く買えます。
また、高校や専門学校、大学のパソコンに導入されていることもあるので、確認してみてください。
Webデザイナーを志望するのはバイトができる年齢の方が多いと思うので、本当にWebデザイナーを目指すなら、月に1日だけでも短期バイトをしてみてはいかがでしょうか。
まとめますと、Webデザイナーになりたいのであれば、まずはAdobeのコンプリートプランを購入、またはAdobeソフトを触れる環境を作りましょう。
デザインの基礎を学ぶ
心構えで書いた通り、デザインを学ぶには一部の情報に偏ってはいけなく、質も大切ですが量も重要になってくるので、まずは複数のサイトを見て学んでいきましょう。
検索ワードは「Webデザイン 基礎」などから始まり、そこから「Webデザイン 余白」「Webデザイン 配色」と詳しく見ていきます。
次に、実際に公開されているプロが作ったデザインを、業種に偏ることなく何百と見ていきます。
「Webデザイン ギャラリー」と検索すると、良質なデザインをまとめてくれているサイトが表示されるので、それらをご利用ください。
Webデザイナーの大半は、自分の持っている知識のみでデザインをしていません。
「どんなデザインにしようかな」と参考サイトを見て「この雰囲気を真似しよう」という手順を踏んでいます。
つまり、参考サイトを見ながらうまくアレンジして良いデザインができれば十分に仕事できるレベルであり、何も見ずにデザインできるレベルに達するまで学習する必要はありません。
そのため、参考サイトを見なくてもデザインできるようになるのは、仕事をしながら徐々にで問題ありません。
ソフトの操作方法を学ぶ
操作はプロのデザインを真似しながら覚えましょう。
使用するソフトはAdobe XDです。
ソフトの使用方法も検索しながら学んでいきますが、Adobeの製品は次々と新しい機能が実装されていきます。
古いページが引っかからないように、検索時は期間を「1年以内」にしましょう。
また、目的のデザインをするための手順は複数ある事が多いので、こちらもいくつかの記事や動画(YouTube)を見て、効率の良いやり方をしている方法を学んでください。
合わせて、ショートカットキーも積極的に覚えていきましょう。
余裕があれば、IllustratorやPhotoshopも同時に基本的な操作を覚えたいです。
ポートフォリオを制作
操作に慣れたら、いよいよポートフォリオ制作です。
フリーランスが目標でも就職するにしても、自分の実力はポートフォリオで表現します。
これがクリエイティブ職の良いところで、経験数よりも実力が重視されます。
架空のサービスや店舗を想像して、それに合ったホームページをデザインしてください。
この時、ロゴのデザインができると強みですが、必須ではありません。
ロゴを苦手とするデザイナーは多いです。
コーティングはまだできないと思いますので、パソコン版とスマホ版のデザインを画像で2枚書き出してください。
書き出した画像と共に「サービス対象は〜〜なので、〜〜という所を意識してデザインしました」と説明文があると良いです。
ポートフォリオは多い方が良いですが、一つしかなくても案件は取れます。
ただし、複数あった方が実力を伝えやすいので、可能であれば3〜5種類は制作してください。
Webデザイナーは就職かフリーランスか
ポートフォリオが完成したら、Web制作会社の求人に応募するか、フリーランスとして案件を探します。
就職、転職する場合
ポートフォリオをメールに添付して、採用を検討してもらいます。
正社員として働くメリットは、仕事のスキルやスピードに関係なく最低十数万円はもらえることと、案件を自分でとってくる必要がないという点です。
Webデザインに関して言うと、レベルの高いデザイナーが在籍していて、教育制度のある企業の場合は自分のスキル向上に繋がります。
ただし、そのようなデザイナーはフリーランスになるか有名企業で働いていることが多いので、出会える可能性は低いです。
就職のデメリットは、人間関係と収入の上限、時間に制約される、などですかね。
Webデザインに関して言うと、上司の判断でデザインの善し悪しが決まってしまうことです。
上司の最終チェックを経てクライアントに納品するので、才能があるのに上司のせいでデザインの修正ばかりしていてもったいないと感じたことがあります。
フリーランスになる場合
Webデザインは外注している企業が多く需要も高いので、フリーランスの難易度は高くありません。
最近はクラウドソーシングも普及していて、フリーランス成り立てでも簡単に案件をとれます。
(詳しく知りたい方は、フリーランスの仕事のとり方をご覧ください)
フリーランスとして活動すると、ビジネスパートナーもクライアントも自分で選べて人間関係は安泰ですし、価格設定も受注量もすべて自分で決められて収入の上限はないし、好きな時に好きな場所で作業できます。
時間に余裕があるので、デザインの勉強に費やす時間も多く、就職するよりも成長が早いです。
デメリットは、仕事を自ら取ってこなければならないことと、確定申告などお金の管理が必要になることです。
フリーランスの選択肢が外れる人の意見を聞くと「スキルに自信がないし、仕事を取れなければ生活できなくなってしまうから」というのが多いです。
スキルは独学で十分で、金銭面の問題はバイトでカバーできます。
Webデザインでも他のバイトでも良いので最低限稼ぎながら、正社員よりも多い自由時間を活用して独学し、自信がついたところで案件を取り始めるという流れがおすすめです。
確定申告もソフトがあるおかげで負担は感じません。
稼げるようになったら税理士に丸投げするのもありです。
私はフリーランスを勧める
仕事を自分で取ってきて管理することに抵抗がないのであれば、是非フリーランスを選択肢に入れて欲しいです。
どの職種でも個人事業主として起業することをおすすめしますが、Webデザイナーは特にフリーランスと相性が良いです。
よくある質問
Webデザイナーに資格は必要?
資格の有無に関係なく、ポートフォリオにスキルが表れるので、私は必要ないと考えます。
もちろん「資格があるなら実力は保証されている」と考える採用担当やクライアントもいると思いますが、デザインの質がすべてということを忘れないでください。
資格の勉強をするくらいなら、ソフトの実践的で効率的な操作を学んだり、デザインの研究に時間を費やす方が自分のためになると思いますね。
高みを目指すために必要な知識は?
Adobe XD、Illustrator、Photoshopの操作とデザインの技術が向上し、さらにWebデザイナーとして高みを目指すなら、コーティング(まずはHTMLとCSS)とSEOの知識を学んで欲しいです。
・画像ばかり
・パソコンとスマホでデザインが違いすぎる
・レスポンシブを考えていない
・エフェクト皆無
といったデザインはホームページではなく印刷物のデザインです。
これらを補うのは、コーティングとSEOの知識が関わってきます。
本記事では多くのデザインを見て学習する方法を推奨しているので、自然とレスポンシブデザインや実現可能な動きなどはわかってくると思いますが、いずれはしっかりとコーティングやSEOを学んでください。
フリーランスなら、Webデザイン専門よりもホームページ制作(Webデザインとコーティング)ができた方が収入はかなり違ってきます。
また、業界に合わせたデザインができるように、複数のデザインを用意して成果をGoogleアナリティクスで検証するのはおすすめです。
成果を数字で見ることで、予想でデザインするよりも自信を持ってデザインできるようになります。
稼げるフリーランスになるには?
クラウドソーシングや業務委託を受けて月に20万前後はすぐに達成できると思います。しかし、それらを利用している以上、単価が安く手数料なども取られて利益が少なくなっているので、大金を稼ぐことはできません。
正社員の数倍稼ぐには、単価を高くした自分のホームページで集客する必要があります。
そのためには、質の高い成果が出るデザインができるようになるのと、マーケティングの知識が重要になってきます。
他者ではなく自分がWebデザインを担当することでクライアントに何のメリットがあるのかをホームページでしっかりアピールして、初めは広告運用しながら集客してみてください。
Webデザイナーの面接のポイントは?
長文になってしまうので、こちらのページにまとめております。
→未経験を含めWebデザイナーの面接のポイントまとめ