Webデザイナーへの転職ロードマップ【未経験・社会人向け】採用側が評価するステップを逆算して解説

Webデザインの基礎知識

※本ページはプロモーションを含みます

何から始めればいいかわからない…

転職まで何ヶ月かかるの？

AKIAKI

ゴール（採用される状態）から逆算するのが一番の近道です。何を準備すれば内定につながるのか、採用担当として実際に面接してきた立場から整理しますね。

「Webデザイナーになりたいけど、何から手をつければいいのかわからない」という気持ち、正直わかります。

学習方法を調べると情報が多すぎて、かえって迷う。スクールに入るべきか独学でいいのかも判断できない。そんな状態でとまっている方を、面接の場でも何人も見てきました。

この記事では、採用担当として5年間・転職希望者を何十人も面接してきた経験をもとに、「採用される状態」から逆算したロードマップを整理します。

学習の最短ルートよりも、転職活動で評価されるマイルストーンを中心に設計しています。

この記事を書いた人
AKI

全くの未経験から独学とスクールを経てWebデザイナーへ転職。その後Webデザイナー・Webディレクターとして働き、現在は本ブログの運営やWebサイト制作を通じてデザインに携わる。IT業界経験20年以上。

Webデザイナー転職ロードマップ全体像：6〜10ヶ月で何を準備するか

まず全体のスケジュール感を把握しておきましょう。

未経験からの転職は、準備から内定まで平均6〜10ヶ月かかるケースが多いです。ただし、これは「学習完了まで待ってから転職活動」をするパターン。採用担当として感じるのは、「完璧を目指して時間をかけすぎた」ケースは意外と採用されにくいという現実があります。

理由は後述しますが、まずはロードマップ全体をつかんでおきましょう。

フェーズ 期間の目安 主なやること 採用担当が見るポイント
STEP 1
土台作り		 0〜2ヶ月 HTML/CSS基礎・Figma基礎 「自走できるか」の素地
STEP 2
ポートフォリオ制作		 2〜5ヶ月 架空案件2〜3本制作・フィードバック修正 実力の証明＋成長意欲
STEP 3
転職活動		 5〜8ヶ月目以降 応募・書類・面接・条件交渉 志望動機・現場適性
STEP 4
内定〜入社準備		 内定後1〜2ヶ月 入社準備・現職退職手続き —

注意：スクールに通う場合、カリキュラム期間（3〜6ヶ月）がSTEP1〜2に重なります。独学の場合は自分でペースを管理する必要があります。

AKIAKI

面接で「まだ勉強中で…」と言いながらも、ポートフォリオの完成度が高い人は普通に採用されます。逆に「2年間独学しました」でも見せるものがない人は難しい。期間より中身です。

STEP 1：土台作り（0〜2ヶ月）— 「ツールを触れる状態」を作る

何を学ぶか：HTML/CSS・Figmaの3本柱

土台フェーズで押さえるのは3つだけです。

✅ 土台で習得する3つのスキル

  • HTML/CSS の基礎（コーディングの読み書き）
  • Figma の基本操作（デザインカンプの作成・閲覧）
  • Webデザインの基礎知識（フォント・余白・配色の考え方）

Figmaは2023年以降、現場のデファクトスタンダードになっています。PhotoshopやIllustratorよりも先に触るべきツールです。

AKIAKI

採用担当として正直に言うと、「PhotoshopよりFigmaに慣れている」候補者のほうが、最近は評価が高いです。現場がFigmaに移行しているので。

どこで学ぶか：無料リソースで十分スタートできる

土台フェーズは無料リソースで十分です。

  • Progate（HTML/CSS・JavaScript）：ブラウザで完結・コード実行確認できる
  • ドットインストール：短い動画で体系的に学べる
  • YouTube（「Figma 使い方 初心者」）：最新UIに対応したチュートリアルが豊富

スクールを検討している場合は、ここで無料カウンセリングや体験授業を受けておくのがおすすめです。入学後のカリキュラムとの重複を事前に確認できます。

📌 関連記事：独学とスクールどっちがいい？転職経験者が4校のおすすめまで解説

STEP 2：ポートフォリオ制作（2〜5ヶ月）— 採用担当が実際に見ているもの

ポートフォリオは「完成度」より「思考過程」を見ている

採用担当として面接してきて、ポートフォリオについて一番感じること。それは「完成度が高い作品を1本だけ持ってくる人」より、「3本の作品にそれぞれ制作意図がある人」のほうが採用しやすいということです。

なぜかというと、実務では「なぜこのデザインにしたか」を説明する場面が必ず来るからです。「きれいに作ったけど、なぜそうしたか説明できない」状態では現場で使えないと判断せざるを得ません。

AKIAKI

「このサイトのターゲットは30代の会社員なので、余白を広めにとってフォントを読みやすいサイズにしました」——このくらい言えれば十分です。難しいことは要りません。

採用側が評価するポートフォリオの条件

💡 採用担当が見る5つのポイント

  1. 制作意図が語れるか
  2. コーディングが動いているか（架空でも可）
  3. 複数のジャンルがあるか
  4. フィードバックを受けて修正したか
  5. スマートフォン表示が崩れていないか

「架空の案件でいいのか」という質問をよくされます。答えはYESです。実際に私が採用してきた人の多くが、架空のWebサイト・ランディングページ・バナー広告などを組み合わせてポートフォリオを作っていました。

ただし、「好きなものを作りました」だけではなく、ターゲット・目的・制作意図をセットで説明できるようにしておくことが重要です。

📌 関連記事：未経験からポートフォリオを作る方法【採用担当が評価した実例解説】

ポートフォリオサイト自体もコーディングで作る

作品をまとめる「ポートフォリオサイト」も、できればHTML/CSSでコーディングして作ることをおすすめします。

理由は単純で、「ポートフォリオサイト自体がコーディングの実績」になるからです。WordPressやSTUDIOで作ったものも悪くはありませんが、採用担当の目には「コーディングできる人」とは映りにくい。

STEP 3：転職活動（5ヶ月目以降）— 「まだ準備中」は長くて3ヶ月まで

転職活動を始めるタイミング

「もう少し勉強してから…」という気持ちはわかります。ただ、採用担当として正直に言うと、「学習が完全に終わってから転職活動する」という考え方は、結果的に遠回りになることが多いです。

ポートフォリオが2本以上あり、説明できる状態になったら転職活動を始めてかまいません。その後も学習しながら並行して活動するのが現実的です。

応募書類で気をつけること

💡 職務経歴書で押さえる3点

  1. なぜWebデザイナーに転職するか（具体的な理由）
  2. 前職の経験でWebデザインに活かせること
  3. 学習の進捗と完成したポートフォリオ数

前職がまったく異業種でも問題ありません。「ユーザーと話してきた営業経験がUIの改善アイデアに活かせる」「事務で培ったドキュメント整理力が情報設計に役立つ」など、関係性を自分で整理して言語化できれば、それが差別化になります。

未経験なのに書くことが見当たらない…

AKIAKI

「転職理由が弱い」よりも「なぜWebデザイナーでないといけないのか」が曖昧なほうが採用で詰まります。学歴・前職は関係ない。動機の解像度を上げることに集中してください。

面接で聞かれること（未経験者向け）

面接でよく聞かれる質問を整理しておきます。

Q. なぜWebデザイナーを目指したのですか？
A. 「もともと〇〇の仕事をしていて、Webサイトのデザインに関わる機会がありました。そのとき〇〇という経験をして、自分でデザインしたいと思うようになりました」という具体的なエピソードを準備しておくこと。「かっこいいから」「在宅ワークしたいから」は動機として弱いと見られます。
Q. どのくらい学習してきましたか？
A. 学習期間より「何を作ったか・何ができるか」を具体的に話す準備をすること。「HTML/CSS・Figmaを〇ヶ月学び、ポートフォリオを〇本制作しました。コーディングの実装はGitHubで公開しています」のように、実績ベースで話すと印象が良くなります。

📌 関連記事：Webデザイナーの採用面接で聞かれること【採用担当が本音で解説】

STEP 4：スクール vs 独学、どちらのルートで進めるか

ロードマップを進める「手段」の選び方

STEP1〜3を進める手段として、スクールと独学のどちらが合っているかは人によって変わります。一律に「スクールがいい」「独学で十分」とは言えない。

ただ、判断軸は整理できます。

✅ スクールが向いている人

  • 転職期限が決まっている（半年以内に転職したい）
  • 独学で挫折した経験がある
  • ポートフォリオのフィードバックをもらえる環境がない
  • 転職支援・求人紹介までセットで使いたい

⚠️ 独学のほうが合っている人

  • 費用が厳しい（30〜50万円が難しい）
  • すでに学習リズムが作れていて、ひとりで進められている
  • 転職より副業・フリーランスが目的（スクール経由の転職支援が使えないケースがある）

スクールを選ぶ場合は、「転職支援の手厚さ」「ポートフォリオのフィードバック体制」「卒業後の求人紹介の実績」を軸に比較することをおすすめします。

📌 関連記事：Webデザインスクール比較【採用担当が転職支援・カリキュラムを評価】

＼ 転職支援が手厚いスクールを検討している方へ ／

WEBCOACHの無料カウンセリングに申し込む

📌 関連記事：ロードマップの最終段階、自分の作品をWebで公開するにはレンタルサーバーが必要です。最初の1台を目的別に選べる比較はこちら → ポートフォリオ用レンタルサーバー比較【4社を採用担当目線で】

よくある質問

Q. 未経験からWebデザイナーへの転職は何ヶ月かかりますか？
A. 平均6〜10ヶ月のケースが多いですが、ポートフォリオを作り始めてから転職活動を並行して進めれば5〜6ヶ月での内定も十分あります。「学習が完全に終わってから」と考えると遠回りになりやすいです。採用担当として見てきた印象では、期間より「ポートフォリオの中身が説明できるか」のほうが合否に影響しています。
Q. 30代・40代からでもWebデザイナーに転職できますか？
A. できます。私が採用してきた中にも30代・40代の転職者は複数います。ただし、20代と比べると「即戦力性」を求められる傾向があります。前職の経験（営業・事務・教育など）をWebデザインの現場でどう活かせるかを具体的に説明できると、年齢のハンデを補えます。
Q. ポートフォリオは何本作ればいいですか？
A. 最低2本、できれば3本を目安にしてください。1本だけでは実力の判断材料が少ない。ただし数より質です。3本あっても「なぜこのデザインにしたか」が説明できない状態より、2本でも制作意図が明確に話せる状態のほうが採用担当には刺さります。
Q. スクールに通えばWebデザイナーになれますか？
A. スクールは道具です。使い方次第で結果が変わります。採用担当として、スクール卒の方を多く面接してきましたが、転職できた人と難しかった人の差はスクール自体より「ポートフォリオの質と説明力」にありました。スクールに入れば安心、ではなく、スクールをどう使うかが問われます。
Q. 転職活動はいつから始めるべきですか？
A. ポートフォリオが2本以上あり、制作意図を説明できる状態になったら始めていいと思います。「もう少し勉強してから」と待ちすぎると、転職活動の経験値が積めず、かえって遠回りになることが多いです。学習と転職活動を並行して進めることをおすすめします。

まとめ：「採用される状態」から逆算して動く

AKIAKI

ロードマップを知ることより、最初の一歩を踏み出すことのほうが大事です。今振り返ると、私が最初に転職を考えたとき、まず無料のプログラミングサービスでHTMLを触ってみたことが起点でした。大したことじゃないように思えて、あれが確実に次につながっていた。

📝 転職ロードマップのポイント

  • STEP1（土台）：HTML/CSS・Figmaの3本柱を2ヶ月で習得
  • STEP2（ポートフォリオ）：2〜3本・制作意図が語れる状態を目指す
  • STEP3（転職活動）：ポートフォリオ2本できたら学習と並行してスタート
  • スクール vs 独学：転職期限・学習環境・費用で判断。一律の正解はない
  • 採用担当が見るのは「期間」より「ポートフォリオの説明力」

「完璧に準備してから動く」より、「動きながら準備する」ほうが転職は早く決まります。

まず小さく始めるとしたら、無料の学習サービスでHTMLを1時間触ってみるか、気になるスクールの無料カウンセリングを1件予約してみる——そのくらいのことから始めれば十分です。

関連記事