WEBデザイン

仕事が取れるWEBデザイナーのポートフォリオの作り方7選!参考サイト5つもご紹介

WEBデザイン

「WEBデザインスキルを習得したけど、なかなかお仕事が獲得できない・・」

「稼げるWEBデザイナーの方はどんなポートフォリオを作っているの?」

「ポートフォリオを作る際のポイントが知りたい!」

という方向けに、WEBデザイナーがポートフォリオを作る際のポイントや作り方、参考になるサイト5選を解説します。

WEBデザイナーにとって、自分のポートフォリオサイトは、仕事を獲得するための重要な武器になるので、この記事で解説するポートフォリオの作りのポイントを参考にして、作成してみてください。

また、記事後半ではWEBデザイナーがポートフォリオを作成する際の注意点も解説しているので、ぜひ最後までご覧ください。

WEBデザインのポートフォリオとは?

WEBデザイナーにとってポートフォリオは非常に重要です。

ポートフォリオとは、WEBデザイナーのスキルや実績を表現するもので、取引先に営業を行う際や、WEB制作会社の面接を受ける際に活用します。

ポートフォリオは紙で作るのではなく、多くの場合WEBサイトとしてポートフォリオを作成します。

WEBデザイナーのポートフォリオは以下の要素を含めることが大切です。

  • 自己紹介
  • スキル
  • 実績
  • 価格表
  • 連絡先

詳しくはこの記事で解説していくので、ポートフォリオとはどんな内容なのかをイメージしておきましょう。

WEBデザイナーが自分の実績やスキルを伝えるには、ポートフォリオを活用するのが最も最適です。

もしポートフォリオがなければ、どれだけ口頭やテキストで実績やスキルを伝えても、信頼感を得ることができずに、案件を受注することは難しいです。

なので、WEBデザイナーを目指している方は、取引先の信頼を獲得できるように、必ずポートフォリオを作成してください。

WEBデザインのポートフォリオを作る際のポイント

では早速、WEBデザイナーがポートフォリオを作る際のポイントを解説します。

仕事を受注できる稼げるWEBデザイナーのポートフォリオに共通する内容なので、以下の要素を含めて、ポートフォリオを作成するのは必須です。

  • 問い合わせフォームがある
  • スキルや実績の記載がある
  • ポートフォリオを見るだけでスキルが伝わる
  • SNSへのリンクがある
  • 価格表を掲載している
  • 定期的に更新されている
  • お客様の声が掲載されている

この要素を含んで、クオリティの高いポートフォリオサイトを作ることができれば、全く仕事を受注できないことはないはずなので、ひとつずつ確認していきましょう。

問い合わせフォームがある

ポートフォリオは営業ツールなので、問い合わせフォームを必ず設置してください。

担当者の方に「お!良いWEBデザイナーだな」と思われても、連絡手段がなければ、依頼を受けることができません。

面接でポートフォリオを使用する場合は「連絡先は履歴書に書いてあるからいっか」とはなりません。

常に担当者の方の手間を減らすことを考えて、履歴書に連絡先が書いてあっても、ポートフォリオサイトに問い合わせフォームを設置してください。

スキルや実績の記載がある

担当者の方の信頼を獲得して、仕事を受注できるように、スキルや実績の記載は必須です。

スキルは絶対に盛らずに、今できることを全て記載します。

もちろんWEBデザインに関わるスキルだけ記載しますが、自分で「これは書かなくていいな」と簡単に判断するのではなく、なるべく全てのスキルを書いておきます。

次に、実績も必ず記載します。

ポートフォリオサイトはスキルと実績だけを見ているといってもいい程、この項目が大切です。

もし、初心者WEBデザイナーの方で、実績が少なかったり、全くない場合は、架空のデモサイトのデザインを行って、それを実績として掲載しても問題ありません。

ポートフォリオを見るだけでスキルが伝わること

ポートフォリオを見るだけでスキルが伝わることを意識して作成するのも大切です。

面接ではなく、ポートフォリオを使用して、企業やWEB制作会社に営業を行う場合は、ポートフォリオサイトが依頼するかしないかの判断材料になります。

疑問点がないように、ポートフォリオを見るだけでスキルが伝わり、信頼を獲得できることを目指しましょう。

SNSへのリンクがある

ポートフォリオサイトには使用しているSNSのリンクを掲載しておきましょう。

SNSでどんな発信をしていて、どんな人物なのかも担当者は確認している場合があります。

特に面接の場合は、SNSをチェックすることが多いので、SNSへのリンクは可能な限り掲載しておきましょう。

価格表を掲載している

価格表を掲載していることも大切です。

価格表は、いくらでWEBデザインの仕事を行うのかを伝えるために掲載します。

価格表がなければ、依頼しづらくなりますし、希望価格を伝えることができないので、安く買い叩かれてしまう可能性もあります。

価格表を作ったことがない方も、いずれ必ず必要になるので、他のWEBデザイナーの価格表を参考にしながら、作成してみてください。

価格表を作成する際の注意点は、絶対に自分を安売りしすぎないことです。

初心者WEBデザイナーの方に多いのですが、自分に自信がなく適正価格よりも低い値段をつけてしまいます。

実績が多くなくても、WEBデザイナーとして、仕事をこなせるスキルを習得したのであれば、安売りせずに適切な価格表を作成しましょう。

定期的に更新されていること

そして、定期的に更新されていることも大切です。

ポートフォリオに掲載された実績が、半年前から更新されていない場合は、この半年間WEBデザイナーとして活動していないと思われてしまいます。

なので、実績が増えた場合は、定期的に更新して、アピールできる部分は積極的に追加していきましょう。

また、時代と共に流行のデザインも変化するので、ポートフォリオサイト全体をリニューアルしても良いでしょう。

お客様の声が掲載されている

実績と共に掲載すると信頼を獲得しやすいのが、お客様の声です。

取引先の方の感想を掲載しておけば、第三者からの評価をアピールすることができ、信頼に繋がります。

なので、仕事を終えるごとに、「もし良ければ制作したサイトの感想をお聞きしてもよろしいでしょうか?」と確認しておきましょう。

仕事をきっちり行っていれば、断られることもないので、安心してください。

WEBデザイナーを目指すためのポートフォリオの作り方

WEBデザイナーのポートフォリオを作る際のポイントを解説しました。

解説した要素を含めてポートフォリオを作ってください。

すでにWEBデザインのスキルを習得している方は、実際に企業のWEBデザインを行う時と同様に、ワイヤーフレームを作成して、デザインとコーディングを行いましょう。

初心者の方はポートフォリオサイト作成にそこまで時間をかける必要はありません。

最初から完璧なポートフォリオを作ろうとは思わずに、実績やスキルが増えるに従って、改善しながら作成してください。

WEBデザイナーのポートフォリオに参考になるサイト5選

ではWEBデザイナーの参考になるポートフォリオサイトを5選紹介します。

どんなポートフォリオサイトを作れば良いか分からない方は、実際にポートフォリオサイトをたくさん見ることで、イメージが膨らんで行くので、以下を参考にしてください。

  • UNDERLINE
  • PRESENT
  • S5-Style
  • KATOSHUN.com
  • Mike Ingham

UNDERLINE

フリーランスとしてWEBデザインやコーディング、サイトディレクションを行っている徳田優一さんのポートフォリオサイトです。

一度見ただけで、どんなスキルがある人物で、どんな実績があるのかを知ることができ、無駄な要素がなく見やすいポートフォリオサイトです。

WEBデザイナーのポートフォリオはいかにスキルと実績を伝えて、信頼を獲得できるかが大切なので、大変参考になるサイトです。

UNDERLINE

PRESENT

デザイナーやディレクターとして活躍している宇都宮勝晃さんのポートフォリオは、スクロールすると画面がヌルッと切り替わり、スクロールエフェクトやマウスオーバーアクションを活用して、シンプルかつ上品なポートフォリオサイトです。

過去の実績は新着順に掲載されているので、直近の実績やスキルを確認しやすいです。

文字と画像のバランスも参考になるでしょう。

PRESENT

S5-Studios

WEBデザインやフロントエンジニアとして活躍している田渕将吾さんのポートフォリオサイトは、画面全体に適用されたアニメーションやマウスオーバーで、スキルの高さがすぐに伝わります。

そして、プロフィールページには顔出しで写真を掲載して、信頼性を高めています。

アニメーションなどのアクションを実装するのは難しいかもしれませんが、クオリティの高いデザインや、顔出しして信頼性を高めていることなど参考になるはずです。

S5-Studios

KATOSHUN.com

WEBデザイナーとして活躍している加藤俊司さんのポートフォリオサイトは、左のリンクからスキルや実績をワンクリックで確認することができて、スクロールするごとにメインの画像が変化するクオリティの高いデザインです。

他のポートフォリオサイトではあまり見たことがないデザインなので、差別化したい方の参考になるはずです。

KATOSHUN.com

Mike Ingham

イギリスを拠点にWEBデザイナーやグラフィックデザイナー、フロントエンジニアとして活躍しているMike Inghamさんのポートフォリオは、シンプルながら、スキルと実績が伝わるので、英語が分からない方でも参考になるはずです。

ポートフォリオサイトはあれこれ情報を盛り込めば言い訳ではなく、Mike Inghamさんのポートフォリオサイトのように短めのページにスキルと実績、お問い合わせフォームがあれば十分です。

Mike Ingham

WEBデザイナーがポートフォリオを作る際の注意点

WEBデザイナーのポートフォリオ作成のポイントと、参考サイトを解説しました。

参考サイトの良い部分を取り入れて、ポイントの要素を含めて作成すれば、良いポートフォリオサイトを作ることができるでしょう。

しかし、細かい部分でポートフォリオを作る際の注意点がいくつかあるので、こちらも確認してください。

  • 掲載する実績の順番
  • 掲載する実績の数
  • 掲載する実績の数

掲載する実績の順番

ポートフォリオを確認する方は、基本的に上から順番にスキルや実績を確認していくので、掲載する実績の順番がとても大切です。

なぜなら、そこまで時間をかけて全ての実績を確認することはできないからです。

例えば、クラウドソーシングサイトの案件に応募した場合は、ひとつの案件に対して、数十件の応募があることも珍しくありません。

そんな中、全ての方のポートフォリオサイトをじっくり確認できるかと言われれば、もちろん不可能です。

なので、掲載する実績の順番を変えて、最も見てもらいたい実績を上に表示させるようにしましょう。

場合によっては、ひとつの実績を目立たせて表示させるのも効果的です。

実績が複数ジャンルで豊富にある場合は、簡単に切り替えられるボタンを用意して、実績の業種ごとにカテゴリー分けして表示させると良いでしょう。

掲載する実績の順番を特に意識せずに、ポートフォリオサイトを作っている場合は、この機会に順番を変更してみてください。

掲載する実績の数

次に掲載する実績の数も大切です。

これも実績の掲載順番と同じ理由で、担当者がポートフォリオサイトを見やすいように実績の数を厳選します。

具体的な数字でいうと、実績数は10個以内が確認できる限界でしょう。

それ以上多くの実績を掲載したとしても、担当者の方に見てもらえません。

見てもらえない実績を掲載しても、自己満足にしかならず、仕事の獲得には繋がらないので、思い切って減らしてみてください。

掲載する実績は、数を増やすよりも、ひとつ一つの質を意識して、仮に実績が3つしかないとしても、どんな考えで作成したのか、どんな成果をあげたのかなどを解説付きで掲載すれば全く問題ありません。

掲載する実績の種類

掲載する実績の種類も非常に重要です。

同一業種の実績が多くても、他業種の案件獲得に繋げることは難しいので、できる場合はなるべく複数業種の実績を掲載しましょう。

もし、複数業種の実績がない場合は、案件ではない自ら制作したデザインでも問題ありません。

初心者WEBデザイナーのうちは、とにかく様々な業種の仕事を獲得できるように、掲載する実績の種類に注意してください。

もし、ひとつの業種に特化したWEBデザイナーを目指しているのであれば、複数掲載しなくても問題ありません。

紙のポートフォリオは必要か?

最後に、WEBサイトのポートフォリオではなく、紙のポートフォリオは必要なのかについて解説します。

結論、紙のポートフォリオは無理に作成する必要はありません。

以前は紙のポートフォリオを用意して、面接に使用することもありましたが、今ではほとんどありません。

面接時もパソコンやタブレットを持参して、ポートフォリオサイトを確認してもらったり、事前にポートフォリオサイトのデータを送っておくことが一般的です。

まれに今でも紙のポートフォリオを求める企業もあるかもしれませんが、WEB制作業界でその可能性は低いでしょう。

印刷紙のデザイン会社の場合は、紙のポートフォリオが必要になるかもしれません。

まとめ

今回はWEBデザイナーがポートフォリオサイトを作る際のポイントや、参考になるサイト5選、作る際の注意点を解説しました。

解説した通り、WEBデザイナーにとってポートフォリオサイトは自分のスキルや実績を表現して、仕事を獲得するための武器になるので、この記事を参考にしながら本気で作成してみてください。

魅力的で信頼を獲得できるポートフォリオサイトを作ることができれば、仕事の受注率が高まり、稼げるWEBデザイナーになることができるでしょう。

WEBデザイナーを目指しているのなら、こちらの記事をご覧ください。

ABOUT ME
小山温
小山温
「未経験から2週間でWEBデザイナーへ」 がモットーの“週末WEBデザイナー”。 未経験からフリーランスのデザイナーになり、 現在も現役のデザイナーとして 企業や本著者、投資家、士業、スクール、 有名Youtuber関連のWEB、紙のデザインに携わる。 デザイナーとして活動を始めて7年、 クライアントからのリピート率は高く、 5年ほど新規集客なし、 紹介とリピートだけでビジネスを成立。 また、自由を確保するために効率化しつつも、 社員ゼロで毎年8桁の売上を作っている。
【無料LINE講座】週末WEBデザイナー