WEBデザイナーのポートフォリオ

【必見】売れっ子WEBデザイナーになるためのポートフォリオ作成術

この記事でわかること
✔️ ポートフォリオの重要性
✔️ ポートフォリオを作るメリット
✔️ ポートフォリオに入れるべき項目
✔️ ポートフォリオを作る流れ
✔️ ポートフォリオ作成の参考サイト

WEBデザイナーとして、あなたのスキルをアピールする機会はたくさんあります。
会社の面接、仕事をする際のアピール、フリーランスとして仕事を受注するときなど…
その際、どのようにスキルをアピールしますか?

人によっては、トーク力を活かしてアピールすることもあります。
ただ、世の中に存在するクリエイター達は、もっと効率的で効果があるものを使ってアピールしています。

それが、「ポートフォリオ」
デザイナーを目指しているのであれば、必ず持っといた方がいいと言われています。
それほど、凄く重要なものですからね。

この記事では、「ポートフォリオ」についてテーマ別に分けて詳しく書いてあります。

あなたがWEBデザイナーとしてキラキラした生活を過ごしたいのであれば、「最後まで読んでほしいな」と思っています。
最後まで読んでもらうことによって、その生活に更なる1歩を踏み出すことができますからね!

【お知らせ】
2000名以上が人生を変えるキッカケになった「好きなことで生きていく!WEBデザイナーという働き方セミナー」では、
  • WEBデザイン業界の「最新」ウラ事情
  • WEBデザイナーにおける「未経験OK」のワナ
  • WEBデザインの学習で失敗した「しくじり先生」の話
などをお伝えしています。「WEBデザインの学び方がわからない」「WEBデザイン業界について知りたい」という方はぜひご参加ください。

詳しくはこちら

WEBデザイナーになるうえでポートフォリオは必須なもの!

WEBデザイナーは、クリエイティブな仕事。
その分、多くの人にアピールできる機会があります。
そのアピールの1つが、ポートフォリオになるのです。

私は、「こういったスキルを持っていますよ」「このノウハウは、仕事に役立てます」などといった自分のアピールをすることで活躍する可能性が上がります。

例えば、「え?これってあなたが作ったの?」や「こんなに凄いのどうやって作ったの?」など。

多くの人に評価されて、仕事に繋がりやすくなります。

このように、ポートフォリオ1つで有名になった人もたくさんいますよ。
ここまでの話を聞いたら、「よし、私もポートフォリオを作ってみよう」と思うかもしれませんね。

ただ、いきなり作ろうとしないで、ポートフォリオの詳細をもっと知りましょう。

それでは、「ポートフォリオとは」といった初歩的なことから「具体的な作り方」などについてお伝えしますね。

クリエイティブな仕事をしている人の第2の履歴書

履歴書と言えば、就職や転職活動のときに面接官に見せるものですよね。
クリエイティブ業界を志望する場合、必ずと言っていいほど「ポートフォリオはありますか?」と言われます。

それは遠回しに、「あなたはどんなことができるの?」といった意味が含まれているのです。

「ポートフォリオはありますか?」といった質問に対して「ありません」と答えるのと「あります」と答えるのではどちらがいいと思いますか?

もちろん、「あります」と答えた方ですよね…
このように、クリエイティブな職業であるWEBデザイナーを志望するのであれば、
ポートフォリオは必須です。

そのポートフォリオは、あなたをアピール第2の履歴書となり、面接官を魅了しやすくなるのです。

ネット上に掲載すればより自分をアピールできる

ポートフォリオを1つでも作ってインターネット上に掲載すれば、365日24時間自分のアピールをすることができます。

インターネットは、世界中の人達が見ていますからね。
今後もインターネットの利用者数、検索時間、閲覧数などは増えていくでしょう。
そんな膨大な人が見るインターネット上に掲載されたポートフォリオは、あなたの魅力を伝え続けます。

そして、「あなたのポートフォリオを見ました」といった問い合わせもくることもありますよ!

1人1人に会って、「私のポートフォリオを見てください」と言うよりも、「インターネット上にポートフォリオ」を掲載した方がはるかに効率的ですよね。

このように、ポートフォリオをインターネット上に掲載することで、
あなたのことをアピールし続けることができるのです。

WEBデザイナーがポートフォリオを作るメリット

それでは、作成したポートフォリオをアピールしたときの具体的なメリットをお伝えしますね。
メリットを把握することで、WEBデザイナーとしてのモチベーションに繋がりやすくなりますよ!

就職・転職活動で内定を貰いやすくなる

ポートフォリオは、自分のスキルをアピールするもの。
アピールが上手くいけば、内定率が高まります。

ポートフォリオは、作品としてスキルを視覚で確認できる分、信頼されやすいですからね。
口頭で「私はこんなことができます」と言っても「本当なの?」と思われるかもしれませんからね…

だから、ポートフォリオは、ある意味「最強のスキル証明」と言っていいでしょう。
そして、会社の面接官は、そのスキルを「お給料」という名のお金で買うわけです。

フリーランスとして仕事を受注しやすくなる

もちろん、会社勤めだけでなくフリーランスとしてもポートフォリオは効果を発揮します。
むしろ、フリーランスの方が効果を発揮するかもしれません。
会社の面接は、対面で行われるものであり、フリーランスは面接が無いケースがあります。

つまり、クライアントと会わないことが多いのです。

それは、クライアントの立場で考えると、あなたのことを「優秀かどうかを判断する材料」が少ないわけです…

つまり、ポートフォリオがあるかないかで「仕事を依頼されるかどうか」が決まる可能性がグンと変わります。

「あなたに依頼したい」と思われたいのであれば、ポートフォリオを作った方がいいでしょう。

人脈を作ることにも役立つ

ポートフォリオは、人脈面においても役に立ちます。

業界交流会、セミナー、スクール、サークルなど。
多くの機会に、人との関わりがあります。

こういった場面においても、ポートフォリオを使ってアピールできます。
そのアピールが、周りの人を惹きつけるきっかけとなるわけですね。
人は、凄い人を見て近寄る生き物。

このようなことから、あなたの素晴らしさに気づいた人と人脈を構築しやすくなるのです。


【まずは無料でWEBデザインを試しませんか?
日本デザインスクールでは、豪華な無料プレゼントを用意しました。
✔️ WEBデザイナータイプ診断
✔️ 未経験から2ヶ月でプロのデザイナーデビューを叶えるヒミツ
✔️ 卒業生が特別に語る「月収100万を叶えた35のコツ」
受け取りは簡単30秒!QRコードを読み取るか、
下のボタンをクリックしてプレゼントの詳細をご確認ください。


プレゼントの詳細をチェックする

WEBデザイナーがポートフォリオに入れるべき3つの項目

WEBデザイナーがポートフォリオに入れるべき3つの項目

ここまでWEBデザイナーがポートフォリオを作るときのポイントをご紹介してきました。ポートフォリオの重要性は理解していただけたでしょうか?

ここからは実際にポートフォリオを作っていくときのことをお伝えしていこうと思います。しかし、ポートフォリオを作るといっても、ただ作品を作ればポートフォリオが出来上がるわけではありません。

ポートフォリオには入れなければならない項目が3つあるので、まずはそれらをご紹介していこうと思います。

プロフィール

第一に載せる必要があるのは、自身のプロフィールです。就職活動や集客において、ポートフォリオは一種の履歴書のようなものです。そのため、一般的な履歴書に載せるような「名前」「写真」「生年月日」「経歴」などを記載する必要があります。

また、就職活動などにポートフォリオを使用するときは、「自己PR」「志望動機」「入社後にやりたいこと」などを記載しておくと、面接のときに自然な流れでそれらを伝えることができます。

応募企業に合わせた作品

2つ目は作品です。多くの職業とクリエイターの違うところがここだと思います。プロフィール載せるものの、最終的には作品のクオリティーで合否を判断されることが多いので、一番力を入れるべき項目です。

既にWEBデザイナーとしていくつかの案件をこなしている場合は、その作品を掲載すればよいのですが、実務未経験で自分の作品がない場合は、ポートフォリオ用に作品を作る必要があります。

「どんなものを作ればよいの?」と悩まれる方もいるかもしれませんが、基本的には応募した企業で作っているようなものを選ぶのが無難です。例えば、化粧品のサイトを作っている企業であれば化粧品のサイト、採用関係のサイトを作ることが多い企業であれば採用関係のサイトなど、志望する企業ごとに作品を作れば自分の熱意を見せられます。

「実務を経験したことないし、WEBサイトを作るなんて自分には無理…」と思う方も安心してください。現在では誰でもWEBサイトを作れるサイトがあります。のちに未経験の方でもポートフォリオ内の作品を作れるように、「作品を作る流れ」をご紹介するので、ぜひそちらを参考にしてみてくださいね。

作った作品の説明

実はポートフォリオは作品だけを載せておけばよいものではありません。作品の説明も丁寧に記載しましょう。具体的には

  • 作品のコンセプト
  • 制作時に使用したスキル
  • 作るに当たって工夫したところ

などを書いておきましょう。WEBデザイナーにとって「なぜそのようなデザインにしたのか」を話せるのは非常に大切な能力です。

ポートフォリオに作品の説明を書いておくことで面接官やクライアントから論理的に作品を作ってくれる人だと思ってもらえるので、必ず説明は書くようにしておきましょう。

WEBデザイン未経験者がポートフォリオの作品を作る流れ

WEBデザイン未経験者がポートフォリオの作品を作る流れ

ポートフォリオに入れる項目は押さえられたでしょうか?ご紹介した項目さえ入れることができれば、面接でも集客でも採用してもらえる可能性は一気に高まります

とはいえ、一番の問題は実際にポートフォリオに入れる作品をどう作るかですよね。特に実際に作品を作ったことがない人は、本当に作品が作れるか心配だと思います。そこで、ここからはポートフォリオの作品を作る流れをご紹介していきます。ぜひ、参考にしてくださいね。

1.作品のテーマを決める

まずは、作品のテーマを決めましょう。テーマとはどのようなサイトを作るかということ。先ほどもお伝えしたように、基本的には応募した企業が作っているようなサイトを選ぶのがおすすめです。

応募企業のホームページをみれば、その企業の制作実績が掲載されていると思うので、それらを参考にコンセプトやテイストを決められます。制作実績が掲載されていない場合でも、その企業のホームページを見て、そのホームページに合わせた作品を作れば間違いありません。

まずは、どんな作品が求められているのかリサーチしてみましょう。

2.作品の目的・目標を決める

どんな作品を作るかを決めたら、次は作品の目的・目標を決めましょう。目標と目的を決めることで作品が作りやすくなりますし、作品の説明もできるようになります。例えば、採用サイトを作る場合の目的と目標は以下のように設定できます。

目的:クライアントの採用数増加
目標:クライアントの求人応募を増やす

3.作品のペルソナを決める

作品の目的と目標が定まったら、次はペルソナを設定しましょう。ペルソナとはザックリいうとWEBサイトを見る人の詳細です。ペルソナを設定することで、どのような人がどのような気持ちでサイトを見るかが明確になり、サイト制作がスムーズに進むようになります。

また、ペルソナを設定しておけば「なぜこのようなデザインにしたか」についても説明しやすくなるので一石二鳥です。

4.ポートフォリオに載せる情報を決める

ペルソナを決めたら実際にポートフォリオに載せる情報を決めていきましょう。ペルソナを決めると、サイトを見る人がどのようなことを知りたいかがわかってくるので、それに合わせてサイトに載せる内容を決めていきましょう。

例えば、採用サイトを見にくる読者が「実際、どのように働いているか知りたい」というニーズを持っているのであれば、「具体的な仕事内容」や「社員の声」をサイトに載せる必要があります。

ニーズはわかるけれど、実際にどのような情報を載せればよいかわからないという方は、類似のWEBサイトを参考にして、サイトを作っていきましょう。WEBサイトの構成も他のWEBサイトを参考にするのがおすすめです。

クオリティーの高いサイトが数多くデザインギャラリーをまとめた記事を載せておくので、ぜひサイトを作るときの参考にしてくださいね。
参考にするならココ!WEBデザインのおすすめギャラリーサイト一覧

5.サイトのイメージを決めていく

サイトの内容が決まったら、実際にサイトを作っていくのですが、一度その前にサイトのテイストイメージを固めていきましょう。「自分が応募する企業のサイトの世界観」や「ペルソナ趣味嗜好」に合わせて、使えそうな素材を集めておきましょう。

デザインをするまではいきませんが、この段階でイメージをはっきりさせておくと、実際にデザインするときもスムーズに作業を進めることができます。

素材を探すときに役立つサイトをまとめて記事を載せておくので、ぜひ参考にしてくださいね。
WEBデザインのクオリティUP!使える画像素材サイト集
【商用OK】現役デザイナーが使うフリー素材サイト10選

6.サイト全体のワイヤーフレームを作る

ここまで、細かく内容を決めてようやく制作が始まります。ただ、いきなりデザインをしていこうとしてもどこに何を配置すればよいかわからないし、大変ですよね。そこで、まずはサイト全体のワイヤーフレームを作成します。ワイヤーフレームはサイトの骨格になる部分で、サイト全体のレイアウトや構成に当たります。

ワイヤーフレームが完成してしまえば、あとは「どんな配色にしようかな?」などデザインに集中できるので、先に作っておくようにしましょう。

ワイヤーフレームについて詳しく解説した記事を載せておくので、気になる方はぜひ読んでみてくださいね。
WEBデザイン初心者のためのワイヤーフレームの作り方と注意点をご紹介

7.デザインを作成していく

ワイヤーフレームが完成したら、おまちかねのデザインです。これまで決めてきたことに沿って、サイトを装飾していきましょう。デザインといっても「写真」「余白」「配色」「大きさ」などさまざまなことを考えることがあります。

デザインに正解はありませんが、より綺麗に見えるようにデザインの基礎は事前に押さえておくようにしましょう。

以下にWEBデザインの基礎をまとめた記事を載せておくので、デザインをするときの参考にしてみてくださいね。
【WEBデザイン初心者へ】基本ルールから考え方までを教えちゃいます! 
誰でも簡単にできる!WEBデザインのクオリティを上げる8つのコツ

ポートフォリオを作る上でおススメなサイト!

ここまで、ポートフォリオを作る流れをお伝えしてきましたが、最後に誰でも無料でポートフォリオを作れるサイトをご紹介しますね。これらを使えば、実務未経験の方でも簡単にWEBサイトを作れるので、ぜひ試してみてくださいね。

PORTFOLIOBOX

このPORT FOLIOBOXは、非常に操作が簡単です。
扱いやすいことから、WEBデザイナーだけなく建築家やアーティスト、カメラマンなどのクリエイター達が使っています。

全世界25万人以上のクリエイター達が登録しているサイトなので、安心して使えると思います。

また、無料プランと有料プランがあり、有料プランに登録すれば1000枚までポートフォリオを登録することができます。
初心者に優しいポートフォリオサイトと言ってもいいでしょう。

PORTFOLIOBOX

Wix

Wixは、基本無料のホームページ作成ツールです。
初心者のWEBデザイナーでも、簡単に使えて機能面も充実しています。

また、初心者向けからプロに応じて料金プランが充実しているのも特徴の1つ。
もちろん、無料プランもあり、多くのことができますよ。

「できるだけ簡単に多くのことをしたい人」にとって、おススメなポートフォリオサイトです。

Wix

Adobe Portfolio

PhotoshopやIllustratorを開発したAdobeという会社が運営しているポートフォリオサイト。
それが、「AdobePortfolio」

このポートフォリオサイトは、「クリエイターご用達」と言っていいでしょう。
多くの作品を登録しても、処理スピードは早いまま。
もちろん、それだけではありません。

手がけた作品のテーマを簡単に変えることができます。
これは、WEBデザイナーを含めたクリエイターにとって嬉しいもの。

クリエイティブな職業は、「考えて修正する」という過程がありますからね。
その過程に対応したのが、「AdobePortfolio」なのです。

Adobe Portfolio

まとめ

WEBデザイナーとしてスキルアピールをするのに、ポートフォリオは役立ちます。

会社からの内定仕事の受注など、人生を変えるきっかけをもたらしますからね。

それは、あなたが仕事を通してキラキラしている生活をするために役立つもの。WEBデザイナーとして活躍するために更なる1歩を踏み出すために、ポートフォリオを作りましょう!

WEBデザイン20レッスンを無料プレゼント中
特典を詳しく見る