全くの未経験が独学でWEBデザイナーに転職する方法

私はWeb制作会社を経営しており、2023年現在で36歳になります。

28歳の時にWebデザイナーに転職してWeb業界でのキャリアをスタートさせ、32歳で独立しました。

この記事では、私が28歳の時に未経験から独学でWebデザイナーに転職した方法を紹介しています。

効率的な勉強方法や習得すべきスキル、転職活動のコツなど、Webデザイナーを目指している人におすすめの内容になっています。

また、今はWebデザイナーを採用する立場になっているので、「こんな人を採用したい」という視点も加わっています。

28歳(当時)の未経験がWebデザイナーに転職

Webデザイナーになるまでは、Webデザインどころか、デザインの仕事やプログラミング、Web関係の仕事すらやったことがありませんでした。

最初からデザインのセンスがあったわけでもなく、今見るとWebデザインの勉強を始めた頃作ったサイトは酷いものでした…。

Webデザイナーなどクリエイティブ業界では28歳で未経験はかなり少数なんです。結構大変です。

そんな私でも、Webデザイナーに就職することができました。私がWebデザイナーになるまでにやってきたことを書いていきます。Webデザイナーを目指している人が読んだ時に、少しでも参考になれば良いなと思います。

当時と今ではWeb業界を取り巻く状況も異なるので、「今ならこうする」ということも書いておきます。

勉強を始める前に必要なもの

Webデザインの学習に必要なものは以下になります。

必要なもの

  • パソコン
  • Photoshop
  • Illustrator
  • XD(またはFigma)
  • テキストエディタ
  • ブラウザ
  • 教材

これらについて、まずは書いておきます。

パソコンのスペック

私がメインで使っているのは、27インチのiMacです。画面サイズが大きくて気に入っています。

WindowsのPCは種類が多く選ぶのが大変なので、Macを選んでおけば無難です。

最近のMacのCPUは性能が高くとても快適なので、ストレスなく作業ができます。

Macはフォントが綺麗なのもおすすめポイントです。

PCを選ぶ際、できれば以下のスペックを満たすPCが良いでしょう。

  • SSD256GB以上
  • Core i5以上(またはM1以上)
  • メモリ16GB以上

SSDは読み書きが早く、デザインソフトの起動も速くなります。HDDはおすすめできません。

できれば256GB欲しいですが、勉強レベルなら128GBでも大丈夫でしょう。

CPUは処理速度に違いが出るので、WindowsならCore i5、MacならM1以上は欲しいですね。

メモリが少ないと、複数アプリを同時に使うと重くなるので、16GBあると良いでしょう。

ただ、私がWebデザインの勉強をしている時は8GBだったので、できなくもないです。

8GBのパソコンを使う場合は、アプリケーションを同時にたくさん開かないようにしましょう。

以下の記事では、おすすめのPCを紹介しているので参考にしてください。

デザインソフト

PhotoshopとIllustrator、Adobe XDは多くのWEBデザインの現場で使用されており、パソコンにインストールしておきましょう。

Photoshopは主に画像の加工に使用します。

Illustratorは主にアイコン画像やイラストを作成する時に使います。

Adobe XDは実際にWebサイトのデザインを作成するのに使用します。

最近ではFigmaを使う現場が増えていますが、私がXDユーザーなので説明は割愛します。

PhotoshopやIllustrator、Adobe XDなどのアドビソフトのほとんど使えるのがCreative Cloudのコンプリートプランです。

Adobe Creative Cloud | プロのクリエイター向けソフトウェアとサービス

もしコンプリートプランを契約するお金がないなら、Photoshopをオススメします。Photoshopだけでも大半のことはできます。フォトグラフィプランなら、めちゃ安いです。コンプリートプランだと高いですからね、予算を抑えたい方にはおすすめ。

Adobeフォトプラン | プロ向け写真編集ソフトウェア

テキストエディタ

昔はDreamWeaverというテキストエディタがよく使われていたようですが、動作が重くて最近はあまり使われていません。

今使うならVisual Studio Code(VScode)が良いでしょう。

VScodeは無料で利用できる、Microsoft製のテキスト・エディタです。

自動で色分けしたり、予測変換が出たり、便利なショートカットが使えたりできます。他にも色んなことができますが、主旨と外れるので細かい説明は省きます。

利用者が多く活発に開発されており機能が充実しているので、とても満足しています。

ブラウザはGoogle Chromeがおすすめ

Webサイトを閲覧するために必要なのがブラウザです。

WindowsならEdge、MacならSafariがデフォルトでインストールされていますが、あまりおすすめできません。

メインで使うなら、Google Chromeがおすすめです。

Google Chromeにはデベロッパーツールという便利な機能があり、Webサイト制作が効率的に行えます。

他にも、Firefoxというブラウザもあるので、動作確認用にサブとしてインストールしておきましょう。

独学の勉強方法

WEBデザイナーになるには、最低限以下のスキル・知識が必要になります。

必要なスキル・知識

  • デザインの基礎知識
  • HTML・CSS
  • デザインソフトの操作スキル

本格的に勉強して転職するまでの期間は約10ヶ月くらい。仕事しながらだったので、そんなに詰めて勉強できてなかったと思います。

この間にやってきたことを書いていきます。

デザインの勉強

まずはデザインの本です。デザインにはセオリーがあります。そのセオリーを学べる本を紹介していきます。

デザインの基礎を学ぶなら、この本が一番良いと思います。絶対に知っておかなくてはいけない知識が網羅されています。

そしてこちら。

「何か物足りない、何か違う」そんなデザインにヒントを与えてくれる本です。

デザインの優れたWebサイト事例を見ながら学べる書籍です。

質の高い事例が豊富に紹介されており、現役のWebデザイナーでも読んでいる人は多いでしょう。

Webデザインの基本的な知識も書かれているので、初心者にもおすすめです。

最低限身につけておくべきデザインの知識

WEBデザインをする上で、最低限知っておいて欲しい点をいくつかここに挙げておきます。

  • 配色。色の組み合わせ、WEBサイトやブランドイメージとカラーの関係。色の与える印象。
  • フォント。フォントの種類。適切なフォントの組み合わせ。行間、文字間。
  • レイアウトの仕方。
  • 紙とは異なるWebの特性。
  • ユーザー目線に立ったデザイン。UI/UX。

上で紹介したデザインの本を読めば、これらの知識は身につけられると思います。

デザインスキルを向上させるには

独学でデザインスキルを伸ばすのは、実際難しいものです。

どうやって学べば良いか分からない人は、次に紹介する方法でデザインの勉強をしてみてください。

まずは基本を学ぶ

デザインはセンスと思われがちですが、方法論を学ぶことでかなりデザインスキルは向上します。

先ほど紹介した「ノンデザイナーズ・デザインブック」は基本的な知識を身に付けられるのでおすすめです。

オシャレなサイトをたくさん見る

デザインを学ぶ上で大事なことは、より良いデザインを日頃から見ておくことです。

例えば、以下のWEBギャラリーサイトではたくさんの良質なデザインのサイトが紹介されています。

これらで紹介されているサイトを日頃からチェックし、参考にしましょう。

既存サイトのデザインを模写

デザインスキルを向上させるには、既存サイトのデザインを再現するのが一番です。

いきなりオシャレなWEBサイトを模写するのではなく、初心者なら一般的なコーポレートサイトを模写するのが良いでしょう。

実務ではカフェとか美容室のようなオシャレなサイトよりも、コーポレートサイトをデザインすることが多いからです。

実際のWebサイトを見ながらXDでそれを再現してみてください。

Webサイト以外のデザインも挑戦する

Webデザイン以外のデザインに挑戦するのも、デザインスキルを向上させる手助けになります。

  • Illustratorで簡単なイラストを描いてみる
  • チラシや名刺を作ってみる
  • バナーを作ってみる

Webサイト以外にもやってみたいデザインがあれば挑戦しましょう。

これらのデザインに挑戦することで、配色やレイアウト、タイポグラフィを学べますし、デザインに必要な素材作りの練習にもなります。

また、手を動かすことでデザインソフトの操作スキルも向上するでしょう。

クラウドソーシングでスキルアップ

でも、一番デザインの勉強になるのは実務なんです。これだけはしょうがない。

「実務ができないから困ってるんだよ!」って言われそうですが、実はWEBデザイナーになる前にデザインの実務をする方法があるんです。

職場の先輩社員にも独学で入社した人がいて、その人はクラウドソーシングでコンペに応募してデザインの練習をしていたそうです。これは目から鱗でした。仕事の依頼が来ないような人でも、コンペなら参加できます。

クラウドソーシングで有名なのがクラウドワークスですね。

日本最大級のクラウドソーシング【クラウドワークス】

デザインの練習にもなって、腕が上がればお金にもなるかもしれない。一石二鳥です。かなりオススメなので試しにやってみましょう。

HTML・CSSの勉強

デザインの勉強と並行して、Webサイトがどのような仕組で作られているかを把握するために、HTML・CSSコーディングを勉強しておきましょう。

ほとんどの会社ではWebデザイナーがコーディングまで行っています。

全くの素人なら、最初は超簡単な教材を使いましょう。いきなりカッコイイWEBサイトを作ろうなんて思うと挫折してしまいます。

私が独学をしていた時は書籍で学習していましたが、今ならUdemyを活用します。

オンラインコース – いろんなことを、あなたのペースで | Udemy

Udemyは買い切りの動画学習サービスなので、月額料金がかかりません。

初級から上級レベルまで様々な講座あり、新しいことを学びたいと思った時は今でも利用しています。

最初の初歩レベルであれば、以下のような講座があります。

HTMLコードのルールが3時間で分かって編集できるようになる即効役立つ基礎知識早わかり講座。 | Udemy

もしセール中でなければ、セールになってから購入してください。

セール中は数万円の講座が1,000円〜2,000円ほどで購入できますし、セールは高頻度で行われています。

最初はお金をかけずに学習したい、まずは無料で学習したいという方はProgateで学習してください。

Progate | プログラミングの入門なら基礎から学べるProgate[プロゲート]

無料会員だと全コースは学習できませんが、初心者向けのコースは無料公開されています。

最初の環境構築から教えてくれるという点では、有料ですがProgateよりUdemyの方がおすすめです。

CSSについて

CSSを学ぶ時にまず意識して欲しいのが、要素を自分の思い通りに配置できるか。初心者はまずこれをしっかり勉強するべきだと思います。カッコいいデザインを学ぶ前に、「配置」することを学びましょう。

ボタンや画像を中央に配置する。1カラム、2カラム、3カラムのコーディングをささっとできるようにする。絶対配置、相対配置を理解する。このような基本はマスターしておきましょう。

最近だとFlexboxが便利にレイアウトできるので、こちらも学んでおきましょう。

スクールやオンラインスクールを利用する方法も

私自身は独学でWEBデザインやコーディングを勉強していましたが、スクールに通っていたというWebデザイナーも多くいます。

スクールの方がモチベーションが継続しますし、分からない所で質問できるのが良いですね。

今人気があるスクールは、有名Web制作会社LIGが運営する「デジタルハリウッド STUDIO by LIG」です。

本格的に学べる「Webデザイナー専攻」と、基礎スキルを身につけられる「Webデザイン入門プラン」があります。

時間がないという人は、オンラインのスクールもあります。朝早くから遅い時間まで受講できるのが魅力です。

DMM WEBCAMPは人気のオンラインスクールです。

このオンラインスクールの良い点は、Webデザインからコーディングまで網羅的に学べるという点です。

XD、Photoshop、Illustratorの使い方を学ぶ

コーディングの勉強って、たくさんネット上に情報があるので勉強に困ることはないですが、問題はXDやPhotoshop、Illustratorなんですよ。

デザインの知識を身につけても、それを表現できなくては意味がありません。デザインソフトの使い方はしっかり抑えておきましょう。

私の時は書籍を購入して学習していましたが、こちらもUdemyを使って学習すると良いでしょう。

【2022年最新版】Adobe XD 手を動かして覚えるプロトタイピング。UI/UXデザイナーを目指す完全ガイド | Udemy

【完全版】知識ゼロから最速で即戦力レベルになるPhotoshopマスターコース | Udemy

このような講座がありますが、他にもあるので評価やコース内容を見て自分に合ったコースを選んで受講してみてください。

レンタルサーバーを借りて、サイトを公開しよう

WEBサイトが作れるようになったら、レンタルサーバーを借りてWEBサイトを公開してみましょう。

できれば独自ドメインをとってください。

そうすることで、WEBサイトを公開する際の手順や、WEBの仕組みを学ぶことができます。

その際、レンタルサーバーの管理画面からファイルをアップするのではなく、FTPクライアントを使ってアップしてください。

FTPクライアントというのは自分のパソコンからサーバーにファイルをアップしたり、削除したりできるツールです。

私はFileZillaというFTPクライアントを使ってファイルをアップしています。

転職活動について

WEBデザインの勉強は楽しいですが、辛いのはやっぱり転職活動。特に、未経験で28歳(当時)の私は本当に苦労しました。

面接官は「未経験か~」って苦い顔をします。年齢も年齢ですし。

ここからは応募や面接について書いていきます。

転職活動をする前に、ポートフォリオを作ろう

ポートフォリオサイトは必ず制作しましょう。

未経験なら架空の会社とかお店のWEBサイトを作ってみましょう。ちなみに私はアフィリエイトサイトを作っていたので、それを載せました。

経験がない分、ポートフォリオを充実させることはとても重要です。

ただし、スクールで作成したポートフォリオは提出しない方がいいです。

他の求職者と被っていまい、経験が豊富な採用担当だと見たことあるサイトだと気付かれてしまいます。

仮にスクールで作ったサイトを見せて採用されたとしても、自力でそれが作れないのであれば会社から求められているレベルに達していないために迷惑をかけてしまう可能性もあります。

ポートフォリオについてはこちらの記事をご覧ください。

応募や面接について

まず悩むのは、派遣会社に応募するのか、直接企業に応募するのか。未経験なら、迷わず直接企業に応募して下さい。

派遣会社はアテになりません。しかも、企業は派遣会社に未経験を求めていません。面接に行く前にはじかれます。それに、求人紹介の頻度も高くありません。

未経験が転職活動をするには、直接企業に応募するのが一番近道です。

ちなみに、私の場合転職活動期間は1ヶ月半くらいでした。

面接テクニック

とりあえず、バンバン応募しましょう。私は年齢的にも(転職活動中は無職だったので)金銭的にも早めに転職を決めたかったので、平日のほとんどは面接を入れてました。

私の履歴書はクソですが、書類通過率は50%くらい。面接まで行っても、未経験なので落ちまくります。

どうせ落ちるなら収穫が欲しかったので、必ず二つの質問をしていました。

「御社はどのような人材を求めていますか?」

「どのような社員が評価されますか?」

この二つを聞きます。この答えをそっくりそのまま、次の面接で使えばいいですよ。

— A社面接時 —

私「どのような社員が評価されますか?」 A社面接官「仕事をとってこれるくらいのWEBデザイナーになると良いですね」

— その後、B社面接時 —

B社面接官「当社でどうなりたいですか?」 私「仕事をとってこれるくらいのWEBデザイナーになりたいです」

名付けて、コピペ面接。

コミュニケーション能力をアピールできると強い

あと、WEBデザインとは関係なさそうですが、コミュニケーション能力があるなら絶対アピールしたほうが良いです。私はそこで評価上がったそうです。(後日談)

例えば、「接客や営業の経験があればそれらの仕事でコミュニケーションスキルを磨いたので、社内や顧客とのやりとりはスムーズにできます」といったアピールです。

未経験に強い転職エージェントを利用する

転職には転職エージェントを利用するのがおすすめです。

転職エージェントを利用すると、無料で面接対策や履歴書・ポートフォリオなどの添削を行ってくれるので安心できます。

上記の転職サービスが未経験にも力を入れており、未経験からの転職支援実績も豊富です。案件の数が多いことでも有名。

WEBデザイナーの案件も多数保有しています。無料で転職活動のアドバイスを行ってくれます。こういうのは利用しない手はないですね。

独学とスクールどっちがいい?

Webデザインを学ぶには、独学とスクールに通う2つの方法が一般的です。

私は独学でWebデザインを勉強しました。理由としてはスクールに通うお金と時間がなかったからです。

ネット上に多くの情報があり書籍も豊富にあるので、独学でWebデザイナーになる人は意外と多いです。

ただ、誰でも独学が向いているという訳ではなく、独学での勉強は時間がかかり、人によっては非効率かもしれません。

もしお金に余裕があるのであれば、スクールに通うのも1つの手です。

以下のような人はスクールに通うのがいいでしょう。

こんな人にはスクールがおすすめ

  • お金に余裕がある
  • 決まった時間に学習時間を確保できる
  • 誰かに見られてないと勉強が進まない
  • 何から勉強して良いのか分からない

スクールの良いところは、課題の提出を求められるので、サボれないという点です。

以下の記事ではおすすめのWebデザインスクールを紹介しているので、スクールに興味がある方は読んでみてください。

30歳前後でもWEBデザイナーになれる?

20代後半、中には30歳を超えてWEBデザイナーを目指す人もいるでしょう。

しかし、新しい業界に飛び込むのに、30歳前後は遅いから諦めようかと考える人もいるかもしれません。

とはいえWEB業界は実力主義であり、これまでWEB業界にいなかったとしても、技術さえあればどうにかなる業界です。

しっかりと勉強して知識とスキルを身につければ、WEBデザイナーになるのは不可能ではありません。

一度入って経験を積めば、その後の転職は楽になります。

未経験での最初の就職では高望みせず、経験を積んで希望する企業に挑戦するのが良いでしょう。

JavaScriptは勉強した方が良いのか

最近ではコーディングをするWEBデザイナーにとってJavaScriptの基礎的なスキルは必須になっていますが、私の場合は転職するまでほとんど勉強していませんでした。

JavaScriptはできなくてもWEBデザイナーになれました。JavaScriptを勉強しなかったのは理由があります。

第一に、CSSが昔よりも便利になったのおかげでJavaScriptがなくても動きのあるサイトが作れるようになったからです。

確かにJavaScriptを使えば、CSSよりも豊かな表現ができますが、CSSという土台を固めることが優先事項だと思います。

それに、JavaScriptを学ぶ時間もありませんでした。28歳というギリギリの年齢だと、あれこれ手を出して時間をかける余裕はありません。中途半端にJavaScriptを学ばずに、デザインとHTML/CSSをしっかり学びました。

私の場合は時間がなかったのでJavaScriptの勉強ができませんでしたが、まだ若くて時間もあるなら、JavaScriptは勉強しておいた方が良いでしょう。

もし、私のように年齢的にギリギリで時間がない方はデザインとHTML/CSSに集中しましょう。

必須ではないけどやっておくと役立つこと

必ずやる必要はないけど、やっておくと仕事に役立つことを紹介します。

WordPress

WordPressはちょっと難しいですが、仕事で使うこともあると思うので予め勉強しておくと評価は上がります。

WordPressの開発ができなくても、管理画面からどのような操作ができるのか、どのような仕組みになっているのかだけでも理解しておくとデザインに役立ちます。

ただ、Webデザイナーに必須のスキルではないので、時間が限られていればやらなくても大丈夫です。

私自身はWordPressのテーマも販売しているので、この辺りの知識はとても役に立っています。

ブログなどで学んだことを発信する

得た知識をブログなどで発信すると、モチベーションアップや理解度向上に繋がります。

私自身、転職前はWordPressやはてなブログでWeb制作に関する情報を発信していました。

そうすると、自分の成果を褒められることもあり、やる気に繋がります。また、「ここはこうした方が良い」などのアドバイスをもらうこともあり、このような意見はとても参考になります。

ブログをやっているとWordPressの使い方や開発も学べるのも良いですね。ぜひWordPressでブログを始めましょう。

WEBデザイナーになって良かったこと

WEBデザイナーになって良かったことがいくつかあるので紹介します。

独立・起業できた

会社員として3年ほど働いた後フリーランスになり、その後会社を設立しました。

WEBデザインを勉強する前はこれと言ったスキルもなかったので、独立とは無縁でした。

WEBデザイナーになっていなければ、起業はできなかったと思います。

自宅で仕事ができる

WEBデザイナーは、職場によってはリモートも可能ですし、独立すれば自宅で仕事ができます。

移動時間を省くこともでき、満員電車で辛い思いをすることもありません。

別の仕事にも繋がる

私はWEB制作だけではなく、ブログアフィリエイトも行っています。

これらの仕事もWEB制作のスキルが活きます。

また、WordPressテーマの販売など、請負い以外の仕事にも広げることができました。

最後に

未経験の28歳がWEBデザイナーを目指したとき、周りはネガティブな発言ばかりします。「いやー、未経験では厳しいでしょう」って言います。

でも、本当にWEBデザイナーになりたいなら、無視しましょう。忘れましょう。少なくとも、28歳ならまだ大丈夫。

とりあえず、飛び込んでみて下さい!


その他の記事