未経験からWebデザイナーになるためには何から優先的に学べばいいのか【ツール編】

未経験からWebデザイナーになるためには何から優先的に学べばいいのか【ツール編】

何から勉強したら良いのか迷うことはありませんか

Webデザイナーを始めるときに何のツールをどの程度まで習得しているとその後進めやすいか、現役Webデザイナーの視点から書き出してみようと思います。

必要な機能は書き出すとキリがなく、人によっても変わってきそうなので、スタートラインに立つために知っておいた方がいいと私が考えるものについてご紹介します。

なお、私が現在デザイン制作に特化して働いているためコーディングについては触れていません。
最新のコーディング関連情報について人に語れるだけの知識は持ち合わせていないため、コーディングは他の人の情報も参考にされることをおすすめします。

ただ、デザイン専業とする場合もコーディング知識は必要と考えてはいるので、今回はツール編ですが知識編のようなものを別の機会に記事にできればなーと考えています。

Webデザイナーを目指す人が習得しておきたいソフトウェア

  • Adobe Photoshop
  • Adobe Illustrator
  • Adobe XD

今、Webデザイナーとして就職したい、仕事したいと考えたとき、機能の習得をしておいた方が良いのはこの3つです。

Figmaは?の声もあがりそうですが、もしあなたが絶対に入社したい会社があって、そこがFigmaを推しているのなら合わせて勉強してもいいかもしれません。

そうでないなら同時にあれこれ勉強するのは大変なので、まずはこの3つをある程度触ってみてから、他のデザインツールにも着手してみるのがよいのではないかと思います。

Figmaを使うにしても他のソフトウェアの知識は必要になるはずです。(いろいろ着手するのが苦にならないのなら、やる気に任せて好きなものをどんどん学ぶのもいいと思いますよ!)

Adobe Photoshop 習得のポイント

制作現場での主な用途

  • 写真の加工やトリミング
  • Webデザイン
  • バナーデザイン

この3つの中では、一番Webデザイン制作のメインツールとして使われてきた期間が長く、未だにその用途で使う人が多いソフトウェアです。(本来は写真編集用のソフトですが)

今後はXDにメインの座を奪われていくような雰囲気もありつつも、細かい作り込みができるのはPhotoshopですし、たとえ画面デザインの制作に使わないとしても、写真のトリミングや、サイズの調整、画像補正などWeb制作の現場では必ず使用することになります。

写真の加工(明るさ、色の調整、簡単なレタッチ)機能、効率的なマスクやトリミングの仕方を中心に機能を習得しておきましょう。
また、レイヤースタイルも多用することになるので、それぞれどんな機能・効果が得られるのか把握しておくことをおすすめします。

Adobe Illustrator 習得のポイント

制作現場での主な用途

  • ロゴ作成
  • アイコン、イラストや図の作成
  • (印刷用デザイン制作)

今からWebデザインのメインツールとして選ぶ必要はありません。
しかし、Illustrator製の印刷物用データを渡されWebの素材として使ってほしいと指示されることは多々あります。データの構造を理解するためにも機能などは知っておく必要があります。

またアイコンやロゴはIllustratorで制作した方が取り回しやすく、自分で自由にアイコン制作ができるレベルの機能の理解、操作への慣れは必要です。

特にパスの扱い、ベジェ曲線はIllustratorで訓練しておいた方が後々楽です。
Photoshopでもよく使うことになるので、初心者のうちにがっちり訓練しておきましょう。イラストや写真をパスでなぞってみたり、既存のアイコンを真似して作ってみる、そんな方法で大丈夫です。

余裕があれば

そのほかの機能として余裕があれば、アピアランス関連、パスファインダ、透明マスクの機能もおさえておくと、ロゴ作成、地図やイラスト制作で不自由しないようになると思います。

特にIllustratorのアピアランスは奥が深く、組み合わせて繊細な表現ができたり、使いようによっては作業の正確性、効率化につながることもあるので、重点的に勉強するとよいでしょう。

また制作の現場ではグラフ作成もたまに発生するのですが、Illustratorには数種のグラフ作成機能があります。円グラフなんか手動でやろうとすると大変なので、どう使うのかざっと見ておくことをおすすめします。それほど難しくはないですよ。

Adobe XD 習得のポイント

制作現場での主な用途

  • Webデザイン
  • プロトタイプ
  • (ワイヤーフレーム制作)

今後Webデザインのメインツールとして勢力を広げていくと思われます。
まだ会社によってはデザインツールとして取り入れない方針のところもあるかもしれませんが、そういった会社の動向は置いておいても、今後のためにデザイナーとしては確実に習得しておいた方がよいと個人的には考えています。

使用感としてはIllustratorに近い印象ですが、UI、機能がシンプルで前述の2つのソフトを触った後なら直感的にデザインを作っていくことができます。

そのぶんXD独自のWeb制作に特化した便利機能である、共有の種類と方法やアセット、リピートグリッド、ステート、スタック、パディング設定…などを重点的におさえておくとよいのではないでしょうか。

とても軽く、Web制作に特化していてデザインによってはXDのみで完結させられる場合もあります。
ただ作り込みが必要な画像や文字については、XDでは少々機能不足の感があるため、今後もPhotoshop、Illustratorは併用していくと考えた方がよさそうです。

全機能が使えるようになっている必要はない

毎回使うような機能はコツコツ練習をしていくと自然と覚えていくと思いますが、ショートカットなど効率化できるところまで習得しておくとその後もストレスなく作業できます。

それぞれのソフトウェアの好きな本を買ってそのとおり作ってみるのを、同じ本で2〜3週くらい繰り返すとだんだんと機能は身についてくると思いますよ。

作業時間は、デザインのアイデア出しや、手を動かしての検討に有効に使えた方がいいので、ソフトウェアの基本的な使い方で躓くことがないよう初心者といえるうちに取り組んでおきましょう。

なお、上で書き出した以外にも業務中使う機能はありますが、全ての機能の使い方までしっかりと覚えておく必要はないと思っています。

それぞれのツールで「何ができるのか」を知っておくのが大切です。ネットに繋がってさえいれば簡単に調べることができるので、必要になったときに調べて実行、それで十分です。

逆に「何ができるのか」を知らないと、避けられたはずの、時間の浪費、クオリティの低下を招くということもあるため、バージョンアップでの機能追加などにも注意しておきたいところです。

勉強するにはスクールに行ったほうがいい?

ツールの使い方の習得のためにスクール(オンライン含む)に行く必要は無いと思います。

私自身は仕事をしながら半年くらいのカリキュラムでスクールに通った経験があります。確かにそこで各ソフトウェアの扱い方は教わりはしたんですが…学校で教わる程度の内容、時間では全然実務をするには足りないなというのが実感です。ツールだけではなく業務知識についても同様です。

学ぶ内容はスクールによって変わってくるとは思いますが、結局は「自分自身でどこまでやれるか」ということにつきます。仕事に就いても手取り足取り先輩が教えてくれるわけではないですからね。

今は良い本もたくさんありますし、ブログでも様々な人が解説していて情報が入手しやすい環境になっています。

やる気と目標さえあれば、独学でツールの使い方の習得は可能と言い切れます。

むしろスクール行っても独学はし続ける必要がありますし、ツールの使い方以外の業務知識やフローは現場で学ぶことが多いです。(そのため、フリーランス希望の人でも一度何らかの形で会社に所属して働いてみることをおすすめしたい。)

スクールにもメリットがある

しかしスクールに通うのが無駄というわけでは決してなく、Webデザイナーと講師を兼業しているような人から教えてもらうと、ツールの使い方以外に実務に即したアドバイスをもらえることもあるでしょうし、就職やインターンシップに関しても協力してくれるスクールもあります
また、これからどういうことを学べばよいのか道筋を示してくれるので、指針が欲しいという人には向いていると思います。

何より、一人で勉強していると辛くなってしまったり継続が難しくなることもあると思うのですが、勉強仲間がいるとがんばれたり良い刺激になるというメリットもありますよね。

そういった他の人と一緒に学べる環境なら、スクール修了後も良い繋がりができ、それが縁で仕事の受発注につながることもありえます。

また、スクールは有料なので、お金がかかっている!というのも、払った分しっかり学ぼうという自分への良いプレッシャーになると思います。

求人活動で、業界未経験・中途の人がそういったスクールに通った経歴を見て「この人はかなり気合があるぞ…」という印象を持ったこともありました。
某スクールは高額ですし、そもそも社会人が本業終わった後に課題作ったり通学するの結構大変ですしね。(自分も経験があるだけに)

Adobe製品や技術書だけでも結構お金のかかるものです。
スクール選びをするのなら、学ぶカリキュラムの内容以外にも、講師のプロフィールや学ぶ環境、就職のサポートなども考慮しつつ、それらが本当に自分に必要かどうかをじっくり見極めていただきたいなと思います。

Webデザイン初心者向けカテゴリの最新記事