Webデザイナーのポートフォリオの作り方|未経験で通らない人と通る人の差を採用側視点で解説

未経験からWebデザイナーへ転職するとき、最初に立ちはだかるのがポートフォリオです。制作会社でWebデザイナーを5年やったあと事業会社のフロントエンドエンジニアに転身し、フリーランスも経験しましたが、最初の転職ではポートフォリオで2社に立て続けに落ちました。その後、制作会社側で採用面接に同席する立場も経験して、ようやく「落ちる作品」と「通る作品」の差がはっきり見えるようになりました。

この記事では、未経験者がつまずく原因を採用する側の目線で言語化し、架空案件しかなくても評価されるポートフォリオの作り方を手順で整理します。一般的な「作品を載せましょう」という解説では触れられない、面接官が実際に何を見て合否を分けているのかまで踏み込みます。

この記事の要点 – 未経験ポートフォリオが書類で落ちる原因は「作品の数」ではなく「制作意図が言語化されていない」こと – 採用側が最初に見るのは自己紹介ではなく、各作品の「なぜこのデザインにしたか」 – 架空案件でも「目的→ターゲット→UI設計」の3点を言語化すれば実務想定として評価される – 落選作品と通過作品の差は、作品ごとに3項目で逆転する(後半の差分表で解説)

目次

ポートフォリオはなぜ採用で必須なのか?

Webデザイナーになるのに国家資格は必要ありませんが、専門的なスキルが求められる職種のため、選考では履歴書・職務経歴書とあわせてほぼ必ずポートフォリオの提出を求められます。採用担当者が最も見たいのは自己紹介文ではなく制作実績です。これは未経験でも経験者でも変わりません。

私が制作会社で採用面接に同席していたとき、面接官がまず開くのは応募者のプロフィールページではなく、作品一覧でした。経歴は履歴書で把握済みなので、面接の限られた時間では「この人にデザインを任せて大丈夫か」を作品から判断しようとします。つまりポートフォリオは、口頭で説明する前に応募者の力量を先に示してしまう資料です。

未経験で経験が浅くても、クオリティが高く企業が求めるテイストに合った作品があれば採用につながる可能性があります。逆に、経験者でも企業が求める方向性とずれた作品ばかりだと通りません。ポートフォリオは「経験年数を埋める書類」ではなく「実務イメージを伝える書類」だと考えると、作り方の優先順位が変わってきます。

形式はサイト版を基本にする

ポートフォリオにはWebサイト版とPDF・紙版がありますが、Webデザイナーの転職では原則としてサイト版を用意するのが基本です。サイトをゼロから組める時点でHTML/CSSの基礎力を示せますし、エージェント経由で複数社に同時応募する際もURLを共有するだけで済みます。私が転職活動をしたときも、人材紹介の担当者から「サイト版があれば紙版は不要」と言われました。

ただし、面接にPCを持参できない場面や、ネット環境が不安定な会場に備えて、主要作品だけをまとめたPDFを補助的に用意しておくと安心です。あくまでメインはサイト版、PDFは保険という位置づけにします。

未経験のポートフォリオが書類で通らない3つの原因

私自身が2社で落ちた経験と、採用側で多くの未経験ポートフォリオを見た経験を突き合わせると、落ちる原因はほぼ次の3つに集約されます。作品の数が足りないことよりも、ここで挙げる「中身の薄さ」が原因であることが圧倒的に多いです。

原因1:制作物を「ただ貼っただけ」になっている

最も多いのが、作ったバナーやサイトの完成画像を並べただけで、なぜそのデザインにしたのかが一切書かれていないパターンです。多くの人が成果物をただ貼り付けて提出してしまいますが、これだと「手は動かせるが、考えて作れるかは不明」という評価で止まります。

採用担当者が見たいのは、スキルレベル(使えるツールと習熟度)、デザイン力(制作物のクオリティ)に加えて、課題解決力・伝える力(制作過程や意図)です。完成画像だけでは3つ目が完全に欠落します。私が落ちた1社目はまさにこれで、当時は「いい感じに作れた作品を並べれば伝わるはず」と思い込んでいました。

原因2:ポートフォリオ自体のデザインが雑

デザイナーの力をアピールしたいなら、ポートフォリオというサイト自体もデザインするつもりで作る必要があります。作品は良いのに、それを並べる土台の余白・文字組み・配色がちぐはぐだと、「作品は頑張ったが、自分でレイアウトを設計する力は弱い」と見られてしまいます。

面接官の立場で見ると、ポートフォリオサイトそのものが「実務で渡したときの仕上がり見本」に見えます。情報設計や読みやすさが整っているかは、作品より先に無意識に評価されています。

原因3:載せる作品がジャンルもテイストもバラバラ

独学で作った練習作品を全部載せたくなりますが、ECバナー・スマホアプリUI・名刺・イラストが脈絡なく並んでいると、「この人は何が得意なのか」が伝わりません。応募先が求めるテイスト(例:コーポレートサイト寄り、LP寄り)に合った作品を前に出し、方向性を揃えることが大切です。

未経験のうちは「全部載せて量で勝負」と考えがちですが、採用側は得意分野が読み取れる構成のほうを高く評価します。応募先に合わせて見せる順番や取捨選択を変えるだけで、同じ作品でも印象が変わります。

採用側が各作品で本当に見ているポイント

ここが、一般的な作り方解説で最も薄い部分です。面接に同席してわかったのは、面接官は1作品あたり数十秒で「考えて作れる人か」を判断しているということです。その短い時間で見られているのは、おおむね次の3点でした。

見られる順番チェック内容未経験が落とされやすい理由
1. 全体の第一印象サイト全体の整い・読みやすさ余白と文字組みが整理されておらず雑に見える
2. 各作品の意図なぜこの配色・レイアウトにしたか「なんとなく」で作っており説明がない
3. 課題解決の筋道目的とアウトプットがつながっているか見た目だけ作り込み、目的が後付け

逆に言えば、この3点を意識して作るだけで、作品の数や経験年数が同じでも通過率は大きく変わります。私が2社目で落ちて作り直したとき、作品はほとんど入れ替えず「各作品に意図の説明文を足した」だけで、次の選考では書類が通るようになりました。

自己紹介よりも作品ページに力を入れる

ポートフォリオには人柄や価値観が伝わるプロフィールも必要ですが、主軸はあくまで制作物です。学んできたことや挑戦したエピソード、今後どう成長したいかは簡潔にまとめ、長文の自分語りにしないことが大切です。面接官は自己紹介を読み込む前に、まず作品で力量を測ろうとします。

プロフィールは「人柄を補足する欄」、作品ページは「実力を示す本体」と役割を分けて、エネルギーの8割は作品ページに注ぐイメージで構いません。

架空案件でも評価される作品の作り方(目的→ターゲット→UI設計)

未経験者の多くは「載せる作品がそもそもない」という壁にぶつかります。ここでよく使われるのが、実在する店舗やサービスのサイトを仮想リニューアルする架空案件です。架空案件は実績がないことの言い訳に見られそうで不安かもしれませんが、作り方次第で実務案件と同じくらい評価されます。

採用側として見ていて差がつくのは、架空案件に「実務と同じ思考プロセス」を通しているかどうかでした。完成画像だけの架空案件は弱いですが、次の手順で目的・ターゲット・UI設計を言語化した架空案件は、実務未経験でも「考えて作れる人」として評価されます。

手順1:架空案件の「目的」を一文で定義する

まず、その仮想リニューアルが何を達成するためのものかを一文で決めます。「個人カフェの新規来店を増やすためのサイトリニューアル」「地域学習塾の問い合わせ数を増やすためのLP」のように、ビジネス上のゴールを具体的に置きます。ここが曖昧だと、以降のデザイン判断すべての根拠が崩れます。

手順2:「ターゲット」を具体的に想定する

次に、そのサイトを見る人を具体化します。年齢層・利用シーン・何に困っているかまで落とし込みます。たとえばカフェなら「近隣に住む20〜30代で、落ち着いて作業できる店を探している人」というように、一人の人物像が浮かぶレベルまで具体化します。ターゲットが定まると、配色・写真の選び方・文章のトーンに一貫した根拠が生まれます。

手順3:「UI設計」の意図を言葉にする

最後に、目的とターゲットを踏まえてなぜそのレイアウト・配色・導線にしたのかを各作品ページに書きます。「作業利用の落ち着いた印象を出すため彩度を抑えた」「初来店の不安を減らすため店内写真をファーストビューに置いた」のように、デザイン判断と目的を一本の線でつなげます。

この3手順を踏んだ説明文を作品に添えるだけで、架空案件は「練習作品」から「実務想定の提案」に格上げされます。私が作品づくりを教える側に回ったときも、見た目を直すより先にこの言語化を直すと、書類通過率がはっきり上がりました。

侍テラコヤで作品制作を相談しながら学ぶ

【PR】詳細はリンク先をご確認ください

未経験でポートフォリオに載せる作品を揃える方法

「目的→ターゲット→UI設計」の型がわかっても、肝心の作品が手元にないと始まりません。未経験者が作品を揃える現実的な方法は、おおむね次の3つに整理できます。

方法1:架空案件で3〜5点をまず固める

最初の土台は、前章の手順で作る架空案件です。実在の店舗やサービスを題材にした仮想リニューアルを3〜5点そろえると、ポートフォリオとして最低限の形になります。題材は自分が普段から知っている地域の店やよく使うサービスを選ぶと、ターゲット像を具体化しやすく説得力が出ます。

方法2:身近な実案件を小さく取りに行く

周囲でデザイン依頼がないかアンテナを張り、知人の店やイベントのバナー・チラシ・簡単なサイトを実際に作らせてもらうのも有効です。たとえ小規模でも「実在の相手のために作った」という事実は、架空案件にはない強みになります。報酬の有無より、実際に使われた制作物が1点でもあるかどうかが効いてきます。

方法3:学習環境を使って作品の質を底上げする

独学だけだと、作品のどこが弱いのか自分では気づけないことが多いです。私自身、独立1年目は独学で詰め込んだまま提案して単価が伸びず、第三者にレビューしてもらう機会の重要性を痛感しました。スクールやオンライン学習サービスで現役デザイナーから作品へのフィードバックをもらうと、自分では見えない改善点が一気に可視化されます。

独学で十分なのは基礎ツールの操作習得まで、お金を払う価値が大きいのは「作品レビューと方向性の壁打ち」だというのが、独学と教育の両方を経験した私の線引きです。完全に独学で進めて手が止まったときは、学習環境に頼る選択肢を持っておくと回り道を減らせます。

落選作品と通過作品はどこで分かれるのか(差分表)

最後に、私が落ちた作品と作り直して通った作品の違いを、項目ごとに比較します。作品そのものを大きく入れ替えたわけではなく、同じ題材でも「見せ方と言語化」を変えただけで合否が逆転した部分です。これから作る人は、この差分を先に潰しておくと書類選考でつまずきにくくなります。

比較項目落選しやすい作品通過しやすい作品
制作意図完成画像のみ・説明なし目的・ターゲット・UI設計を各作品に明記
作品の方向性ジャンルもテイストもバラバラ応募先に合わせて方向性を統一
ポートフォリオ自体の設計余白・文字組みが雑サイト自体も一つの作品として整える
自己紹介長文の自分語りが主役簡潔・作品ページが主役
架空案件の扱い練習作品として並べただけ実務想定の提案として言語化

表を見るとわかる通り、分かれ目は「作品の数」や「経験年数」ではなく、一作品ごとの意図の言語化と全体の方向性です。私が落ちた当時に足りなかったのは技術より圧倒的に言語化でした。逆に言えば、未経験でもここを意識すれば経験者に見劣りしないポートフォリオに近づけます。

転職活動の進め方や応募の流れについては、未経験からWebデザイナーになる方法でも整理しています。30代で挑戦する場合のリアルな進め方は30代未経験からのWebデザイナー転職のリアルもあわせてご覧ください。年収の目安を知りたい方はWebデザイナーの平均年収比較も参考になります。

よくある質問(FAQ)

Q1. 未経験だと作品が少なくてもポートフォリオは作れますか?

はい、作れます。実在の店舗やサービスの仮想リニューアルなど架空案件で3〜5点そろえれば、未経験でも最低限の形になります。大切なのは数より、各作品に目的・ターゲット・UI設計の意図を言語化して添えることです。

Q2. ポートフォリオは紙とWebサイトのどちらで作るべきですか?

Webデザイナーの転職では、サイト版を基本にするのがおすすめです。サイトを組めること自体が基礎力の証明になり、エージェント経由の複数応募でもURL共有で済みます。面接でのネット環境に備え、主要作品のPDFを補助として用意しておくとより安心です。

Q3. 架空案件ばかりだと評価が下がりませんか?

架空案件でも、目的・ターゲット・UI設計を実務と同じ手順で言語化していれば実務想定の提案として評価されます。逆に完成画像だけの架空案件は弱く見られます。可能であれば身近な実案件を1点でも加えると、より説得力が増します。

Q4. ポートフォリオが書類選考で通らないとき、何を見直せばいいですか?

まず各作品に制作意図(なぜそのデザインにしたか)が書かれているかを確認してください。次に、応募先に合わせて作品の方向性が統一されているか、ポートフォリオサイト自体のデザインが整っているかを見直します。作品を入れ替えなくても、この3点の改善だけで通過率が変わることがあります。

Q5. 独学だけでポートフォリオを完成させられますか?

基礎ツールの操作習得までは独学で十分到達できます。ただし、自分の作品の弱点は独学では気づきにくいため、現役デザイナーから作品レビューをもらえる学習環境を併用すると、改善点が早く可視化され回り道を減らせます。独学で手が止まったときの選択肢として持っておくとよいでしょう。

まとめ

未経験Webデザイナーのポートフォリオで合否を分けるのは、作品の数でも経験年数でもなく、一作品ごとの意図の言語化と全体の方向性です。要点を整理します。

  • 採用側が各作品で見るのは「全体の第一印象」「制作意図」「課題解決の筋道」の3点
  • 落ちる主な原因は「ただ貼っただけ」「ポートフォリオ自体が雑」「方向性がバラバラ」
  • 架空案件でも「目的→ターゲット→UI設計」を言語化すれば実務想定として評価される
  • 作品は架空案件3〜5点を土台に、身近な実案件と学習環境のレビューで質を底上げする
  • 落選作品と通過作品の差は、作品を入れ替えなくても見せ方と言語化で逆転できる

私自身が2社で落ちてから採用側を経験して学んだのは、技術より先に「考えて作れることを伝える設計」が問われているということでした。これから作る方は、完成画像を並べる前に、なぜそのデザインにしたのかを言葉にするところから始めてみてください。

この記事の執筆者:Murata(制作会社Webデザイナー5年→事業会社フロントエンドエンジニア3年→フリーランスの経験。未経験からの転職でポートフォリオに2回落ちた経験と、制作会社で採用面接に同席した側の視点で発信しています。本記事は筆者の実体験と公開情報をもとに整理した内容です。採用基準は企業ごとに異なるため、応募先の募集要項も必ずご確認ください。)

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

目次