MENU
いろはくま
HSS型HSPとして「生きづらさ」に悩み、30代手前で起業を決意。Webデザイン職業訓練校に通い、Web業界へ。現在はWebデザイナーとして会社員とフリーランスを両立しています。このブログでは、未経験からのWebデザイナーになるための方法と起業・フリーランスの方へ私の体験談をもとに、役立つ情報を発信しています。
\ Webデザイナーになるロードマップ公開中 /

【体験談】未経験Webデザイナーポートフォリオ作成ガイド|採用担当者の視点とは?

ポートフォリオは、未経験からデザイナーなどクリエイター系の仕事に挑戦する際に必須のツールです。

「Webデザイナーになりたいけど、そもそもポートフォリオって何?」「何を載せればいいのか分からない…」そんなお悩みを抱える方も多いのではないでしょうか。

私自身、未経験からWebデザイナーを目指し、職業訓練校に通いながらポートフォリオサイトを作り転職活動に挑み、ウェブ制作会社に入社しました。

この経験をもとに、ポートフォリオの基本や作り方のコツをお伝えできればと思います。

ポートフォリオ作成のポイントを押さえておく事で、書類審査の通過率が上がります。

自分らしさをアピールできるポートフォリオを作成して、書類選考を突破しましょう!

この記事はこんな方におすすめ
  • はじめてポートフォリオを作る方
  • ポートフォリオとはなにかを知りたい方
  • ポートフォリオを作る際のコツを知りたい方
  • デザイナーとして転職活動をしている方
目次

ポートフォリオとは?その重要性

「ポートフォリオ」とは、自分のスキルや作品をまとめてアピールできる、重要なツールの一つです。

特にデザイナーやクリエイターを目指す人にとっては、採用担当者やクライアントに対し、「自分はこんなことができます!」と視覚的かつ具体的に伝えるための大切な役割を果たしてくれます。

ポートフォリオは履歴書や職務経歴書では伝えきれない、あなたの個性やセンスを示すためのものになるため、見せ方や内容がとても重要になってきます。

ポートフォリオを作るときの3つポイント

初心者の方でも魅力的なポートフォリオを作れるように、以下のポイントを意識してみましょう。

1.見やすいデザイン・構成にこだわる

ポートフォリオ自体があなたのスキルの一部として評価されます。

シンプルで見やすいレイアウトや、作品の魅力が引き立つデザインを意識しましょう。

2.自分の得意を見せる「ベスト作品」を選ぶ

すべての作品を載せる必要はありません。「これが自分の強み!」と思える作品を厳選しましょう。もし数が少なくても、自信が持てるものを丁寧に見せる方が印象に残ります。

3.作品の背景やプロセスを説明する

「どうやってこの作品を作ったのか」「どんな工夫をしたのか」など、制作過程や考えたことを簡単に書いてみてください。これだけで、あなたのスキルだけでなく「考え方」まで伝えることができます。


以下は、採用者目線でポートフォリオを見る際のポイントをインタビュー形式でまとめている記事です。

私が初めてポートフォリオを作成する際、参考にさせていただきました。

自分の視点だけでなく、採用者側の視点を取り入れて作ることで、より効果的なポートフォリオが作れるはずです。ぜひ参考にしてみてください!

ポートフォリオに掲載する項目と内容

STEP
目次とメニュー

最初に、ポートフォリオ全体の構成がひと目でわかる目次やメニューを載せましょう。

  • 目次は簡潔に。例えば、「プロフィール」「作品集」「連絡先」などの見出しをつけるだけでOK。
  • PDF形式での提出でページ数が多い場合は、リンクでジャンプできるようにしましょう。
STEP
自己紹介(プロフィール)

あなたのバックグラウンドを簡潔に伝えるパートです。

基本情報(名前、経歴、資格など)と一緒に、自分のスキルやスキルセットを書きましょう。

  • スキルを箇条書きで書き、その後にスキルセットとしてどう活かしているかを補足すると、採用者にとってわかりやすくなります。
  • 自己紹介の最後に「どんな仕事をしたいか」「どんな問題を解決したいか」「5年後10年後の自分はどうなっているのか、どうなりたいか」といった意欲や目標・キャリアプランを具体的に書くと、熱意やどのように貢献できるのか採用担当者に伝わります。
スキルとスキルセットの違い
  • スキルは「できること」そのものを指します。たとえば、「Photoshopで画像編集ができる」「HTML/CSSでWebページを作れる」といった具体的な技術です。
  • スキルセットは、それらのスキルを組み合わせて達成できることや、活用分野を示します。たとえば、「UI/UXデザイン全般」「フロントエンド開発の経験」など、スキルの活用範囲を広げて伝えるイメージです。
STEP
作品紹介

あなたの実績やセンスを直接見てもらうための最重要項目です。

初心者の場合は、課題制作や個人プロジェクトでも問題ありません。自分の強みが伝わる作品を選びましょう。

作品紹介パートでは、以下のような要素が必要となります。

  1. タイトル
  2. 制作の目的
  3. 作品の概要(プロジェクト名や自分が担当した役割など)
  4. 制作で工夫したポイント
  5. 作品の成果
  6. 作品の制作時間
  7. 作品に使用したツール
作品紹介ページのチェックポイント
全体ボリュームを10ページ以内に抑える

PDFや紙で提出する場合は、コンパクトにまとめることで閲覧者が負担なく読めます。

Webサイトの場合は、4〜多くても5カテゴリ程度にまとめる。

画像は高画質かつ見やすいものを選ぶ

写真やデザインがぼやけていると印象が悪くなるため、視認性を重視します。

5W1H(誰が、何を、いつ、どこで、なぜ、どのように)を意識

成果やプロセスを明確に伝え、具体性を持たせます。

解説は長文を避け、簡潔にまとめる

短くても必要な情報が伝わる構成を心がけましょう。

トンマナを統一する

デザインやフォント、色使いに一貫性を持たせることで、丁寧で見やすい印象を与えられます。

トンマナ(トーン&マナー)とは?

デザイン、フォント・色・言葉遣いなど表現に一貫性を持たせるためのルールのことです。

ポートフォリオそのものも一つの作品です!

「この人の作品は価値がある」と思ってもらえる見せ方を考えましょう。

STEP
連絡先やSNS

採用担当者が簡単に連絡を取れるよう、連絡先を明記します。

  • メールアドレスや電話番号を記載。
  • SNS(Twitter、LinkedIn、Instagramなど)を掲載する場合は、仕事に関連する内容が中心のアカウントを選ぶこと。プライベート投稿が多いアカウントは避けましょう。
  • ポートフォリオに直接連絡用(お問い合わせ)フォームを設置しても良いでしょう。

限られたスペースで、どれだけわかりやすく情報を伝えられるかがポートフォリオ作りのポイントです。

他の人に見てもらう機会を増やして、フィードバックを活用しながら、ポートフォリオを改善していきましょう!

ポートフォリオ作成のコツ

「自分はこんな人間で、こんなことができる!」

という強いメッセージを込めることで、採用担当者やクライアントに印象を与えることができます。

未経験のデザイナーでも、しっかりと自分の個性やスキルを表現することで、他の応募者と差をつけることができるます。

ここでは、ポートフォリオ作成のコツを紹介します。

制作背景の説明が魅力を引き立てる!

ただ作品を並べるだけでは、あなたの実力や魅力を伝えるには不十分です。

作品制作の「背景」や「意図」を補足することで、説得力が増し、具体的にどんなスキルを持っているかが伝わります。

例えば、以下のようなポイントを盛り込むと良いでしょう。

  • どんな目的で作ったか?
  • こだわったポイントはどこか?
  • どんな工夫をしたのか?

具体例|背景のストーリーを伝える

たとえば、介護施設のウェブサイトをデザインしたとします。

こうしたターゲット層を考慮し、「ご高齢の方でも見やすいデザイン」を意識したとしましょう。

介護施設の利用を考えるのは主にご家族の方ですが、まだ元気なうちに「施設はどんなところなんだろう」と情報を確認したり、家族の勧めで高齢者本人が閲覧するケースが考えられます。

この場合、次のようなエピソードを添えることで、作品の価値を伝えることができます。

例:「このデザインは、高齢者でも見やすいように配慮し、色使いと文字サイズにこだわりました。

文字サイズは可変式にし、標準サイズと大きめのサイズを切り替えられる機能を追加しました。また、落ち着いた配色で目に優しいデザインを採用しました。」

このように、作品の背景や意図を説明すると見る人に「なるほど、そういう視点で作られているのか!」と納得してもらえます。

こうした工夫をポートフォリオに反映させることで、単なる作品集ではない、価値のあるアピールツールにすることができます!

全体の見せ方にも工夫を!

作品そのものの出来も大事ですが、「どう見せるか」も同じくらい重要になります。

ポートフォリオ全体の構成を考えながら、次のポイントを意識してみましょう。

  1. 見やすいレイアウトにする
    情報が整理されていて、読み手が迷わずに内容を理解できるデザインを心がけましょう。
  2. アピールしたい作品を目立つ場所に配置する
    最も自信のある作品や一番伝えたい内容を目につきやすい場所に配置することでインパクトを与えます。
  3. あなたらしさをデザインに反映する
    色使いやフォント選びなど、ポートフォリオ全体に自分の個性が感じられる工夫を取り入れましょう。

たくさん時間をかけて作った作品だからこそ、見る人にその魅力がしっかりと伝わるように見せ方を考えることが大切です。

ポートフォリオは、あなた自身をアピールするための「プレゼンツール」になります。

ぜひ、見る人の心に響くような構成やデザインを工夫してみてください!

未経験者向けスキルセット掲載例

未経験からデザイナーに挑戦する場合、

「〇〇について、学んでいる最中だけどスキルに書ける程ではないしな」

とスキル項目に書いて良いのか迷うときがあります。

ここでは、未経験の方がスキルをどのようにアピールできるか例を使ってご紹介します。

いま、学習していることもしっかりアピールしましょう!

スキル

  • 技術スキル
    • HTML/CSS: 基本的なWebページ作成が可能
    • Photoshop: 簡単な画像編集およびロゴデザインの制作経験
    • Git/GitHub: 個人プロジェクトでのバージョン管理を経験
    • Figma: 初心者レベルのUIデザイン制作に挑戦中
  • ソフトスキル
    • 学習意欲が高く、新しいツールや技術を迅速に習得
    • チームでの共同作業や問題解決能力

スキルセット

  • Web制作の基礎スキル
    HTML/CSSを使用して簡単なWebページを構築し、Gitを用いてコードを管理する基本的なプロセスを習得。現在、JavaScriptを学習中。
  • UI/UXデザインの基礎知識
    FigmaとPhotoshopを使用して、架空プロジェクトのUIデザインを制作。ユーザー視点を意識したデザイン設計を学び、操作性を考慮したプロトタイプ作成(実際のデザインや動作を再現)に挑戦中。
  • 成長と協力の姿勢
    学習コミュニティでの共同作業を通じて、チームメンバーと意見交換をしながらプロジェクトを進める経験を積む。

このように「未経験でもこれだけ準備している」という姿勢を見せることが大切です。

少ない作品でもポートフォリオを魅力的に見せる!

ポートフォリオは、自分のスキルや作品を見てもらうための重要なツールですが、未経験で作品が少ない場合や作成に時間がかかる場合は、工夫が必要です。

以下に、私の経験を交えながら具体的なアドバイスをお伝えします。

希望職種の関連作品を考える

私は、デザイナーになる前に少しだけバナー制作の経験がありました。

そのため、過去に作ったバナーを元にいくつか作り直してポートフォリオに追加することで、作品数を増やしました。

一つひとつが小さな作品でも、複数集まることでポートフォリオに「厚み」を出せます。

例えば、バナー制作もWebデザイナーに求められるスキルのひとつに含まれるため、目指すデザイン別に関連性のある作品も掲載するなどうまく活用しましょう!

未経験でもできる!効率よくポートフォリオを作るコツ

未経験からWebデザインを始めたばかりだと、ポートフォリオに掲載できるウェブサイトがなく、悩むことが多いですよね。

「とりあえず最低でも、5つくらいはWebサイトをゼロから作らなきゃ」と思いがちですが、それはあまり現実的ではありません。

もし、フルスクラッチ(ゼロからサイト制作)でサイトを作るとなると、時間がかかりすぎて転職活動が進まなくなってしまうからです。

数を増やすことに気を取られて、
クオリティが低くなってしまうと逆効果です。

採用担当者はすべての作品に目を通すわけではく、気になった作品だけ見られることがほとんど。

では、効率よくポートフォリオを充実させるにはどうしたらいいか、いくつかのポイントをご紹介します!

1. 得意なものを中心に、少ない作品でも質を重視

もしサイト制作に時間がかかる場合は、バナーやランディングページ(LP)など、比較的短期間で作れる作品をメインにしましょう。

大事なのは、数ではなく質やアイデアをしっかりアピールすることです。少ない作品でも、内容を深く掘り下げて魅力的に見せましょう!

2. 数合わせの工夫

完璧を目指しすぎると、かえって制作が進まなくなってしまいます。簡単なデザインやサンプル作品を追加することで、ポートフォリオの内容を充実させることができます。

大事なのは「自分ができること」をしっかりアピールすること。できる範囲で、自分のスキルを見せることが大切です。

3.自分の考えをしっかり伝える

「色味を工夫しました」といった表現では、採用担当者に響きません。

なぜその色を選んだのか、どんな考えでデザインを決めたのかを伝えることが重要です。

面接では口頭で説明できますが、書類審査ではその場で補足できないため、わかりやすく、かつ冗長にならないように自分の考えや意思を伝えることを心がけましょう。

採用担当者がポートフォリオで重視するポイント

ポートフォリオは単に「自分が作れるもの」を見せる場ではありません。

採用担当者は、あなたの作品を見ながら、次のようなことにも注目しています。

1. どんな人間性か

あなたがどんな考え方をしているのか、どのように作品を作り、仕事に取り組むのかが伝わることが大切です。デザインはただのビジュアルだけでなく、あなたの考え方やプロセスも大きなポイントです。

採用担当者は、あなたがチームの一員としてどんなふうに働くのか、どれだけ柔軟に対応できるかも見ています。

2. どうやって貢献できるか

あなたがその企業に入ったとき、どのように貢献できるのかを想像しやすい内容になっているかどうかも大事です。

たとえば、ポートフォリオに込めたアイデアや意図が、どのように企業の目標やビジョンに役立つかを感じさせることができれば、採用担当者は「この人と一緒に働きたい!」と思ってくれるかもしれません。


あなたがどんな人物で、どんな仕事ができるのかが伝わるように心掛けましょう。それが、採用担当者の目に留まるポイントになるはずです!

転職活動に向けたポートフォリオ活用術

ポートフォリオ作成の一番大切なポイントは、「ターゲットに合わせて、自分の魅力を最大限に伝えること」です。

これ、実は現場で仕事をする際にも同じことが求められます

ちょっと厳しい話ですが、ポートフォリオで採用担当者の心を動かせなければ、現場でターゲットに響く作品を作るのも難しくなってしまうかもしれません。

とはいえ、最初から完璧を求められているわけではないので安心してください。

大事なのは、「どうすれば相手に響くのか」をしっかり考え、本気で取り組む姿勢を見せることです。

採用担当者は、今のスキルだけでなく、あなたの「これからの伸びしろ」や「意欲」を見ています。

だからこそ、自分の魅力を最大限に伝えられるポートフォリオ作成に本気で向き合い、限られた作品の中でしっかりと自分の強みをアピールしてみてください!

ポートフォリオの作成で注意すべき点とは?

ここでは、ポートフォリオ作成する上で注意しておくと良いポイントを解説していきます。

1. 著作権に注意しよう

作品には必ず著作権が存在します。

あなたが制作に関わったとしても、その作品の著作権は基本的に「作った当時の企業」に属します。

そのため、ポートフォリオにその作品を載せたい場合は、企業やクライアントから掲載許可を取ることをおすすめします。

紙やファイルで作成したポートフォリオの場合、影響範囲は限られますが、Webで公開する場合は不特定多数の人に見られることになります。そこでは特に慎重に扱う必要があります。

とはいえ、ポートフォリオは「私的な使用」にあたるため、制作過程を語るだけであれば著作権侵害として訴えられるケースはほとんどないといえます。

訴えられないという保証はない、なぜか後ろめたい気持ちでポートフォリオ作成に挑みたくはないので、Webサイト上で公開する場合は、できる限り許可を取るようにしましょう

2. 公開NGの作品

まだ世の中に公開されていない情報や企業のプロジェクトでボツになった作品などは、公開しない方が無難です。

機密情報や未公開の内容が含まれている可能性があるため、注意しましょう。

3. 出典や引用元の明示

もしポートフォリオに引用した情報や素材がある場合は、出典元をしっかり示すことが大切です。

著作権の問題を避けるためにも、他人の作品や情報を使用する際は、その出典を明確にしておきましょう。

4. 情報漏えいや秘密保持には気をつけよう

企業のプロジェクトの多くは、NDA(秘密保持契約)を結んで進められます。

つまり、ポートフォリオに載せたい作品が企業プロジェクトの場合、その内容に秘密保持義務があることを忘れないようにしましょう。

特に、Webでポートフォリオを公開する場合は、セキュリティにも気をつけることが大切です。

たとえば、ポートフォリオサイトにパスワード保護をかけることで、アクセスを制限できます。これをすることで、企業秘密や他社のプロジェクトを不特定多数に公開せずに済みます。

Web制作では、ITリテラシーが求められます

セキュリティ面で気をつけているかどうかも、採用担当者があなたを評価するポイントのひとつです。

もしポートフォリオサイトに、公開設定のまま前職の作品や個人で受けた仕事を載せていると、採用担当者は「もしかしたら自分の会社の情報も勝手に公開するかも?」と心配になってしまうかもしれません。

ポートフォリオの中身だけじゃなく、その取り扱い方も大事です。誰でも見れるような状態で企業の秘密情報を載せてしまうのは、信用を失う原因にもなります。

せっかく作った作品が、セキュリティやリテラシー不足で評価されないのはもったいないです。だからこそ、ポートフォリオ作成は「自分ごと」として真剣に取り組み、ターゲット(採用担当者)がどう感じるかを意識して作り込んでいきましょう。

ポートフォリオ作成のためのツール

初心者におすすめのポートフォリオ作成ツールもいくつか紹介します。

  • Adobe XDやFigma
    デザインとプロトタイピングが同時にできるツール。
  • Wix、SquarespaceSTUDIO
    コーディングの知識がなくても、簡単にサイトを作成できるプラットフォーム。
  • WordPress
    無限のカスタマイズが可能で、SEOにも強い。

私はオリジナリティを出したかったのと、HTMLなどコーディングスキルをしっかりアピールしたかったので、ノーコードツールは使わず、ゼロからポートフォリオサイトを作成しました。

もちろん、効率化を重視したり、最新技術を使っていることを見せたい場合は、いくつかのツールを使ってみるのもアリです。

ウェブサイトを掲載する場合、作品のひとつはゼロからコーディングして作ってみるのもおすすめです!技術力もデザインの理解度も深まりますよ。

以下の記事では、Web制作の流れをまとめまてます。ポートフォリオサイトを作る時どのような手順で進めればよいかわからない方は参考にどうぞ。

まとめ

ポートフォリオは、自分をアピールする大切なツールです。

特に未経験の場合、たくさんの作品を並べるよりも、少ない作品でも自分の強みを伝えることが大事になってきます。ポートフォリオを通じて、あなたがどんな人で、どんな仕事ができるかを見せることがポイントです。

また、Webで公開する場合はセキュリティや著作権に気をつけましょう。作品に関わる情報漏洩や企業の秘密に関わることがないよう注意が必要です。しっかり管理されたポートフォリオは、信頼感にも繋がります。

ポートフォリオ作成の際、初心者向けのノーコードツールも大変便利ですが、Webデザイナーを目指すなら、コーディングを学んでゼロから作るのもおすすめです。

裏側の知識があると、より自信を持って作品を紹介できます。

ポートフォリオは自分の「今」を伝えるものです。ターゲットに合わせて、自分らしさをしっかり表現しながら作り上げていきましょう。

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

コメント

コメントする

CAPTCHA


目次