webデザイナー未経験からのポートフォリオ制作！参考例や必要な作品数を紹介

ポートフォリオはWebデザイナーとして仕事を獲得するうえで、もっとも重要な道具です。

今回は、ポートフォリオの重要性と作品例を踏まえて、作り方や差別化に重要なポイント、制作方法の学び方を未経験向けにわかりやすく解説します！

また、ポートフォリオの完成基準をまとめているので、「実際にどれくらいまで作りこむべきなのか」などポートフォリオのイメージがない方にオススメの内容が満載です。

これからポートフォリオを作る方や制作までの道筋を立てたい方は、ぜひ最後までご覧ください。

未経験者の案件獲得や転職におけるポートフォリオの重要性を解説

ポートフォリオの目的は単に自分が制作した作品を紹介することではなく、自分の実績や能力をアピールすることです。

実務経験や十分な実績がない未経験者の場合には、ポートフォリオで技術力をアピールする必要があります。企業やクライアントは、ポートフォリオで技術力を把握して、自社や案件に必要な人材かどうかを判断するからです。

そのためポートフォリオ次第で、大きな案件が獲得できるかどうかや、希望する企業へ転職できるかどうかが決まります。さらには、収入や担当する内容など、待遇・業務面にも大きく影響します。

したがって、ポートフォリオはWebデザイナーとして働くうえで大切な商売道具なので、しっかりと作り込む必要があるのです。

未経験からwebデザイナーとして成功した人の作品例を公開！

実際に未経験から、WEBCOACHに通ってWebデザインスキルを習得し、webデザイナーとして新しいキャリアを歩んでいる方のポートフォリオを紹介します。

ポートフォリオの作り方を未経験者にもわかりやすく解説！

まずは、ポートフォリオが完成するまでの手順をチェックしましょう。ポートフォリオ制作には、下記の2つのステップがあります。

• ポートフォリオに載せる作品を作る
• ポートフォリオ自体を作る

まずは、自分のデザイン・構成力を伝えるためにホームページやバナーなどの作品を作る必要があります。作品の準備ができたら、ポートフォリオの制作に取りかかる流れです。この章では、ポートフォリオの作り方を上記の2ステップに分けて、未経験者向けにわかりやすく解説します。

また、この章の最後では、ポートフォリオ制作において意外と重要なポイントも解説します。自分の魅力を最大限にアピールするためにも、最後までしっかりと見ていきましょう！

ポートフォリオに載せる作品は高い能力を示すためにクオリティを高くするべき

Webデザイナーを採用する企業側は、ポートフォリオに載っている作品から技術力を判断します。そのため自分が今持っているすべての能力をアピールするために、ポートフォリオに載せる作品は手間を惜しまないで、クオリティを高くするべきです。

とはいえ未経験者の場合には、どのような作品であれば質が高いといえるのか、わからない方も多いでしょう。ここでは、高品質な作品を目指すうえで重要なポイントを3つ紹介します。

1. 作品の完成度
2. 必要な作品数
3. 作品の背景説明

意外に思われるかもしれませんが、Webデザイナーのポートフォリオには作品だけではなく、「どのような意図や考えで作品を制作したのか」など、作品に対する背景説明も必要です。では、作品の実例を見ながら、それぞれのポイントをチェックしてみましょう。

作品にはどれくらいの完成度が必要？実例を参考に解説

ポートフォリオに載せるホームページデザインの完成度は、「章立て数」を一つの基準にするとよいでしょう。架空のホームページを載せる際にもトップページだけでは不十分で、3～4個程度の章立てとメニューバーまでは作るべきです。

例えば、ECサイトとコーポレートサイトの場合には、下記の章立てを最低限作ることをオススメします。

複数の章立てを作ることで、各webページの役割を意識したデザインや設計ができる能力だけではなく、トップページから各webページへの導線設計までの考え方も伝えることができます。Webデザイナーとしてのスキルをより多く伝えるためにも、複数の章立てを作るようにしましょう。

ポートフォリオに必要な作品数はどれくらい？

ポートフォリオに必要な作品数は、「5～10作品程度」です。内訳としては、Webサイトデザインが2～3作品、バナーデザインが2～3作品程度は必要です。

ポートフォリオのデザインにもこだわりがある場合には、ホームページ・バナーデザインに加えて自分のポートフォリオも作品の一つとして紹介するとよいでしょう。

作品数が少なすぎると、見る側は制作者の技術力を判断しきれません。「スキル紹介」のページは流し読みされる可能性があるので、自分のスキルが伝わる作品を載せるようにしましょう。

ただし、たくさん載せていればよいわけでもありません。複数のポートフォリオをチェックする必要があるので、基本的に後半の作品は見てもらえないからです。複数の作品がある場合には、条件に合う作品や自信作をピックアップするようにしましょう。

誰が見てもわかるように作品の背景を記載する

誰が見てもわかるように作品の背景を記載することも、自分の能力を示すために重要です。作品の説明には、下記の内容を載せるようにしましょう。

• ターゲット（年代・性別・国など）
• デザインの意図
• 工夫した点
• 作品の反省点
• 今後の課題

まずは、ターゲット・意図・工夫した点など、デザインに対する考え方や方向性を言語化します。加えて、作品の反省点と今後の課題など、作品に対する改善内容も記載していると好印象です。客観的に自分のスキルやデザインを評価できる人材として、企業やクライアントから見ると伸びしろが期待できるからです。

特にデザインの意図や工夫した点はたくさん書きたくなる気持ちはわかりますが、読む人が理解しやすい文章を書くことを最優先にしましょう。Xのように、短めの文章でシンプルにまとめることを心がけてみてくださいね！

ポートフォリオであなたの魅力を伝えるために大事な4項目を解説！

ただ作品を並べるだけでは、ライバルとの差別化はできません。ここでは、自分の魅力を最大限に伝えるために押さえるべき下記4つの項目を解説します。

1. 経歴をまとめるプロフィール
2. 自身の強みをアピールするスキル紹介
3. ポートフォリオで最も重要な作品紹介
4. SNSや問い合わせフォーム

それぞれの項目でどのような内容をアピールすればよいのか、具体的に見てみましょう。

経歴をまとめるプロフィール

経歴をまとめたプロフィールは、制作者への信頼につながる重要な項目です。

ポートフォリオはWebデザイナーの履歴書の代わりにもなる場合があるので、作品だけではなく下記のような「基本情報」と「顔写真」も載せるようにしましょう。

• 生年月日
• 年齢
• 出身地
• 学歴
• 前職

また、上記の基本情報に加えて、「Webデザイナーになったきっかけ」をまとめるのもオススメです。特に前職がWeb業界に関係がない場合には、なぜWebデザイナーを目指したのか、企業担当者やクライアントからすると気になるものです。目指したきっかけ話は個性が出るので、企業やクライアントに覚えてもらううえでも載せておくとよいでしょう。

自身の強みをアピールするスキル紹介

「自分が持っているスキル紹介」は、ほかのWebデザイナーと差別化を図るうえで重要な項目です。

単に「Photoshopが使える」といったように文章で紹介するのではなく、図を用いて一目見てわかるようにするとよいでしょう。例えば、下記のような棒グラフや星の数を使ったスキル紹介がオススメです。

図を使うことで、どのスキルがどれくらい長けているのかが明確になります。自分が得意なスキルを企業やクライアントへわかりやすく伝えるためにも、少し工夫しましょう。

ポートフォリオで最も重要な作品紹介

「作品紹介」は、ポートフォリオにおいてもっとも重要な項目です。

企業の担当者やクライアントが一目見て、ポートフォリオ内でどのような作品があるのかがわかるように、作品の配置に注意するとよいでしょう。

例えば、架空のホームページと広告バナーなどジャンルが異なる制作物がある場合には、案件や企業の応募条件に合った作品を前から順番に配置することをオススメします。担当者は最後まで見ない可能性があるため、条件に合わない作品が前に配置されていると受かりにくくなってしまうからです。

転職用のポートフォリオでは応募先企業で求められる仕事に関係性が高い順に配置にして、案件獲得用なら応募案件に近い作品から載せましょう。

SNSや問い合わせフォーム

「SNSや問い合わせフォーム」は、企業担当者やクライアントからの連絡を取りこぼさないための項目です。

最近では、問い合わせ先としてInstagramやXなどのSNSを使っているWebデザイナーも増えているため、企業やクライアントもSNS経由で連絡を取ってくる場合があります。ただし、企業やクライアント側がSNSを連絡手段として使っていないこともあるので、問い合わせフォームは必ず載せるべきです。

またSNSは、転職や案件獲得に不都合な投稿をしていないかを載せる前に必ずチェックしましょう。SNSの印象が悪いと、いくらポートフォリオの質が高くても、人柄で不採用となってしまう可能性があるので注意が必要です。

ポートフォリオ制作において意外と重要なポイント

ポートフォリオは制作ツールや内容を少しこだわることで格段にクオリティが上がり、企業やクライアントからの注目度が上がります。ここでは、未経験者がポートフォリオ制作で意外と見落としがちな下記のポイントを紹介します。

1. ポートフォリオ制作に使用するツール
2. 掲載するwebサイトの種類

上記2つのポイントは、転職や案件獲得の成否に影響する大切なポイントです。Webデザイナーとして安定した将来を手に入れるためにも、それぞれチェックしておきましょう。

ポートフォリオ制作に使用するツール

未経験者の方がポートフォリオを制作する際には、「WixやWordPress」などの初心者向けのホームページ制作ツールを使いましょう。

Wixとは、コーディング不要の制作ツールです。ドラッグ＆ドロップ操作により画像素材の移動や拡大縮小などができるため、コーディングスキルが不十分な初心者でも簡単にWebサイトを制作できます。

一方WordPressとは、HTML・CSSを使ってカスタマイズも可能な制作ツールです。非常に有名なツールで、クックパッドなどの大企業のサイトでも使われています。オリジナルのホームページを作る場合にはHTMLやCSSの知識が必要になりますが、企業やクライアントにコーディングスキルをアピールできるので特にオススメです。

アピールしたい内容やスキルに合うツールを選ぶことが重要です。

掲載するwebサイトの種類

掲載するwebサイトは、コーポレートサイトがオススメです。理由は、コーポレートサイトには「コーポレートアイデンティティ」を伝える目的があり、企業の目的に即したWebサイトを制作できる実力を伝えられるからです。

ただし架空のコーポレートサイトを作るとなると、自分で架空の企業を作って架空の課題を考える必要があり、未経験者には難しいのでオススメしません。

Webサイトのデザインは、想定する課題をデザインによって戦略的に解決できているかが重要です。未経験の方がコーポレートサイトを制作すると、課題解決に対してデザインの筋が通っていなかったり、そもそもの課題設定があいまいになったりと、質が低くなる傾向があります。

そのため、ECサイト制作などで慣れてから、コーポレートサイトに挑戦することをオススメします。

未経験にオススメのポートフォリオ制作の学び方

この章では、未経験の方にオススメのポートフォリオ制作の学び方について、下記の2つの方法を紹介します。

1. 本やYouTubeに載っている作品や教材を活用して独学で学ぶ
2. スクールでポートフォリオ制作に精通したプロに教わる

未経験からのポートフォリオ制作は難しいですが、上記の方法であれば未経験からでも質の高いポートフォリオを作ることができます。

それぞれの学習方法のメリットとデメリットを解説するので、よい面・悪い面両方から比較してみましょう。

本やYouTubeに載っている作品や教材を活用して独学で学ぶ

本やYoutubeでは、作品例やツールの使い方などの例題が充実しているため、うまく利用できればWebデザインスキルを習得できます。では、下記の表で独学するメリットとデメリットを見てみましょう。

特に独学では、不足しているスキルの解説本を選んだり、ECサイト制作をメインで解説しているYouTubeで学んだりと、自分の興味や目標に合わせて自由に教材を選べるのが大きなメリットです。

一方で、独学ではフィードバックや案件獲得サポートがありません。そのため、好きに学びすぎると、案件獲得レベルのポートフォリオがいつまでも制作できない可能性があります。独学は、未経験者にとって難易度が高い学習方法なので注意しましょう。

スクールでポートフォリオ制作に精通したプロに教わる

結論からお伝えすると、スクールの方がオススメです。では、スクールを利用するメリットとデメリットを下記でチェックしましょう。

スクールの大きなメリットは、質問環境が整っていることです。スクールではWebデザインに精通したプロにわからないところを直接質問できるので、高品質なポートフォリオを制作できます。

さらには、実案件の提供サービスがあるスクールもあり、在学中にプロの意見を聞きながら実務の流れを体験できるメリットもあります。

ただし充実したサポートがある一方で、独学と比べると費用は高額です。

とはいえ、ポートフォリオの制作スキルは、転職や案件獲得において非常に重要です。そのため、質の高いポートフォリオを制作できることを踏まえると、未経験者の方はスクールでプロから教わる方がオススメです。

現役フリーランスにポートフォリオ制作の疑問点を解決してもらえる無料カウンセリングへ

ポートフォリオの悩みを相談できる相手がいない」「どうすれば案件を取れるポートフォリオになるのかわからない…」など、ポートフォリオの疑問や悩みがある方は、スクールの無料カウンセリングへ相談しましょう！

無料カウンセリングでは、現役フリーランスから質の高いポートフォリオを作るためのアドバイスがもらえます。現役フリーランスは、実際にポートフォリオを使って案件を多数獲得してきており、ポートフォリオ制作に精通しています。そのため、未経験者の悩みに寄り添いながら、解決に導いてくれるでしょう。

少しでもポートフォリオ制作で疑問がある場合には、「WEBCOACH」の無料カウンセリングを利用してみてくださいね！

質の高いポートフォリオを作る上で足りないスキルとその学習方法がわかる

無料カウンセリングでは、質の高いポートフォリオを作るうえで足りないスキルとスキル習得に必要な学習方法を知ることができます。

例えば、「自分に足りないスキルは何か」「スキルを習得するためには何をすればいいのか」を現役のフリーランスから教えてもらえます。

現役の視点から見て改善すべき不足スキルを把握できるため、より質の高いポートフォリオを制作できるようになります。

そのためポートフォリオ制作をするうえでスキルに不安がある場合には、無料カウンセリングを受けてみてくださいね！

現役フリーランスからポートフォリオ制作の進め方についてアドバイスがもらえる

無料カウンセリングでは、現役フリーランスからポートフォリオ制作の進め方についてのアドバイスももらえます。

そのため無料カウンセリング中に、現役フリーランスに相談しながらポートフォリオ制作のロードマップを立てることができます。

現役フリーランスは、ポートフォリオ制作のプロです。自分の失敗・成功の経験を踏まえて、質を保ちつつ時間をかけすぎることなく制作できるコツを教えてくれます。

現役のフリーランスから直接意見をもらえる無料カウンセリングを有効活用して、ポートフォリオ制作を効率よく進めるとよいでしょう。

よくある質問

最後に、ポートフォリオに関するよくある質問に回答します。

• web版ポートフォリオに加えて紙媒体も作った方がいいですか？
• ポートフォリオなしで転職や案件を獲得するのは難しいですか？

ここで疑問点を解決しておきましょう

web版ポートフォリオに加えて紙媒体も作った方がいいですか？

ポートフォリオなしで転職や案件を獲得するのは難しいですか？