ポートフォリオとは？掲載するべき3つの要素と基本の作り方

まずはじめに：ポートフォリオを作成 →｜ドメインを取得 →

更新日 2024年10月10日（公開日 2019年3月28日）

クリエイターやアーティストが、自分の魅力を宣伝するために欠かせない「ポートフォリオ」。NFT アートやデザインなどの分野で活躍するプロには欠かせない仕事道具の一つです。
 

しかしその必要性は理解していても、「印象的なポートフォリオの作り方がわからない...」という悩みは多いのではないでしょうか。

そこでこの記事では 「Web デザイン未経験でも魅力的なポートフォリオを作る」ためのポイントをくわしく説明します。ホームページの作り方の基本から、魅力的なポートフォリオにするためのコツ、そしておしゃれなポートフォリオ事例まで、全て解説します。

＼いますぐポートフォリオを作成しよう／

Wix の AI サイトビルダーをご存知ですか？ Web 制作に特化した無料の AI でホームページを作成し、あなたの理想のポートフォリオを公開することができます。まだ、ポートフォリオをお持ちでない方はぜひお試しください。
 
 目次

ポートフォリオとは？

ポートフォリオに載せたい3つの要素

ポートフォリオサイトの作り方

ポートフォリオサイト作成事例 6 選

ポートフォリオ（Portfolio）とは、本来「複数の書類をまとめて運ぶケース」のことを意味します。一般的に耳にするポートフォリオは、クリエイターの実績や強み、能力を一目でアピールするための「作品集」のことを意味します。

ポートフォリオを Web サイトとしてネット上で公開したものをポートフォリオサイトと言います。ポートフォリオサイトを作成すると URL やQR コードをシェアして簡単に自分の作品をアピールできるようになり、さらに検索エンジンや SNS を通じて、作品を知ってもらう機会が増えるといったメリットがあります。

ポートフォリオサイトは、デザイナーやイラストレーターとして顧客や雇用者とのネットワークを構築することを目的に作成します。イラストレーターやデザイナーなどクリエイティブな仕事を専門にする人にとって、企業や顧客に提出する用のポートフォリオを制作することは収入に直結する需要なプロジェクトです。

ポートフォリオにとって、自己紹介パートは最も重要な要素と言ってもいいでしょう。ここでは、アーティストとしての背景、経歴、スキルなどを端的に伝え、クリエイターとしてのあなたを魅力的に紹介します。ポートフォリオを仕事探しに使う場合には、履歴書を作成する気持ちで作成しましょう。

自己紹介（About）に掲載するべき内容は以下を参考にしてください。

自己紹介を作成する際は、「誰に」読んでもらいたいのかを常に考えましょう。仕事を獲得するためにポートフォリオを作成するなら、自分になんのスキルが求められているのかを明確することで、理想の採用担当者に刺さる自己紹介に近づけることができるでしょう。
 
 また、プロフィールに載せる画像は、自身の顔写真またはSNSアイコンを含めて 複数掲載すると、より本格的な印象になります。

自身を代表する作品を厳選して掲載しましょう。アートディレクターや採用者に、印象を強く与えるため、作品は戦略的に選択する必要があります。

作品紹介（Portfolio）に掲載するべき内容は以下の通りです。

作品を選択する際には、テーマやスタイルの一貫性を意識しましょう。一貫性のある作品を選択することでクリエイターとしてのアイデンティティが明確になり、採用者側の期待値をコントロールすることができます。

作品紹介を作るポイントは、各作品がどのように生まれたかというプロセスも併せて表現することです。こうすることでデザインスキルのみではなく、企画力や調整力なども伝えることができ、採用率や受注率を高めることができるでしょう。

作品紹介と自己紹介を目にした採用者やクライアントが、あなたにすぐに仕事を依頼できるように、わかりやすい場所に連絡先を掲載しましょう。

 特に案件を受注することが目的の場合、お問い合わせページが見つけやすいことは非常に重要です。コンタクト率を上げるために、お問い合わせフォームへのリンクはポートフォリオの最後やメニューに配置し、いつでもクライアントがアクセスできるようにしましょう。
 

また、「 3 営業日以内に返信します。」など、返信の目安を記載しておくと親切です。

Wix のポートフォリオ用テンプレートなら、すでに必要なページが作り込まれています。あなたのイメージに近いものがあれば、そこから自由にカスタマイズすることで、自分だけのユニークなサイトが簡単に作成できます。まずは、豊富なテンプレートをチェックしてみましょう。

まず最初に、作ろうとしているポートフォリオサイトの目的を明確にしましょう。目的によってサイトの構成はもちろん、強調すべきアピールポイント、掲載する作品の選び方などが異なります。

例えば就職活動時に企業に提示することを目的としたポートフォリオの場合。応募する企業のことや求人内容はもちろん、業界についても事前によく調べましょう。求められている人物像やスキルに応えるように自己紹介文を書いたり実績をアピールすることが、採用確率を上げるためには大切です。また、ポートフォリオサイトも送付する企業ごとにコンテンツを最適化しましょう。応募する企業ごとにサイトを更新したり、場合によっては異なる URL のポートフォリオサイトを作成することも必要です。

一方で、オンライン上で広く集客してフリーランス案件を受注することを目的とするポートフォリオサイトでは、サイト訪問者に「この人への発注を検討したい」と思わせ、コンタクトしてもらうことがゴールです。この場合、サービス紹介ページを充実させたり、コンタクトフォームへのリンクをサイト内の分かりやすい箇所に配置したりなどの工夫も重要です。加えてポートフォリオサイトの SEO 対策も意識する必要があり、サイト内にブログを併設するのも効果的です。多くの検索ワードで上位表示させ、サイト訪問者を増やせるほど、案件の受注につながるからです。

このように「何のために作成するのか」「誰に見て欲しいのか」「見てもらった後にどのようなアクションを取って欲しいのか」をしっかり決めてから作成に取り掛かることで、仕事を獲得できるポートフォリオサイトを作ることができます。

Wix のオンラインコースなら Wix エディタの使い方から、Web デザイン講座まで専門家から学ぶことができます。ぜひチェックしてみましょう。

ポートフォリオサイトのトップページは、あなたの第一印象を決める大切な要素です。そのため「ひと目で必要な情報がわかる」する必要があります。

採用担当者や、潜在顧客があなたのポートフォリオを見た瞬間に、魅力を伝え切れるようアイキャッチなデザインにしつつもわかりやすいページとなるよう心がけましょう。

・トップページに掲載する作品を選択

ポートフォリオサイトのトップページは、あなたの才能やスキルをアピールするための恰好な場所です。ぜひあなたの代表的な作品や力作を厳選して掲載しましょう。作品を 1 つに限って大きく掲載する王道スタイルから、近年の Web デザイントレンドに習いグリッドレイアウトを使って複数の作品を掲載する方法など、トップページの見せ方は様々です。迷ってしまったらポートフォリオサイトのテンプレートなどを参考に、あなたの好みにしっくりくるレイアウトを見つけましょう。

・個人名もしくはビジネス名を明確に記載

作品を魅せることに注力しすぎるあまり、氏名やビジネス名が小さすぎてわかりにくいポートフォリオサイトをよく見かけます。これでは「なんだかすごい」けれど「よくわからない」サイトになってしまいます。ポートフォリオサイトの主役は、あくまで「あなた」です。誰かの作品集ではなく、「あなたの作品集」であることが一瞬でわかるように、個人名もしくは屋号名などのビジネス名は、明確に記載しましょう。

・職種や肩書きも明確に記載

個人名やビジネス名は明記しても、職種や肩書きを表記しないのもよくあるミスの一つです。ポートフォリオサイトのトップページは、見た人が「一瞬でわかる」ことが重要です。掲載作品から職種や肩書きを察してもらうことを期待すしているのでは、取れる案件も逃してしまいかねません。例えば「山田花子/インテリアデザイナー」や「山田太郎｜クリエイティブディレクター」などのように、名前の後に「 / 」「 | 」を入れたり、名前の後に改行したりすることですっきりとわかりやすく記載することができます。

・ナビゲーションメニューはわかりやすく

掲載している作品にフォーカスを当てたいあまりに、サイトのナビゲーションメニューのサイズが小さすぎたり、サイトの隅っこにさりげなく設置しているポートフォリオポートも多いものです。もっと詳細を知りたいと思った閲覧者が、すぐに他のページへ移動しやすいように、ナビゲーションメニューをわかりやすい場所に設置しましょう。ここでナビゲーションがわかりにくいと、サイトから離脱してしまう確率を高めてしまいます。

フリーランス案件を受注することが目的のポートフォリオサイトの場合、サービス概要のページを設けるようにしましょう。受注することができるタスクやプロジェクト内容を明記しておくことで、コンタクトする側の心理的障壁が低くなり、コンタクトを貰える確率がグンと上がるからです。

なお、サービス概要に料金を載せるべきか否かという点は、業界やビジネスの戦略によるので、一つの正しい答えはありません。料金を表示するにもさまざまな方法があり、最低料金のみを表示したり、だいたいの価格帯を表示したりすることで、全く予算に見合わない顧客を見切ることができるなど、サイト上に料金を提示する利点もさまざまです。逆に、各クライアントと相談しながら料金を決めたい場合は、問合せフォームを細かくカスタマイズして、出来るだけ多くのニーズを汲み取る工夫をしましょう。

ファビコンは PC のブラウザのタブの部分に小さく表示されるアイコンです。デザインスキルを伝えることが目的のポートフォリオサイトでは、このような小さな部分でも気を抜かないことが大切です。

すでに自分のビジネスのロゴを持っている場合は、ロゴをファビコンとして設定しましょう。まだロゴを持っていなくて、イラストレーターやグラフィックデザイナーなど絵を描くのが本業ではない場合は、ロゴメーカーなどを利用して、ファビコンを作ってみましょう。

ポートフォリオサイトと SNS アカウントは必ず連携するようにしましょう。サイト上には限定した数の作品や実績しか掲載できませんが、SNS アカウントでその他の多くの作品を見てもらうことがでできるからです。あなたへの評価をさらに上げることに繋げれるかもしれません。SNS アカウントへのリンク先は、サイトのヘッダー部分に含めるなどして、全てのページ上に表示することで、クリック率をあげる工夫もしましょう。もちろん SNS のアカウントには、あなたのポートフォリオサイトの URL を載せることを忘れずに。

ポートフォリオサイトはあなたのキャリアを左右する、とても重要なツールです。必ず独自ドメインを取得して運営しましょう。ドメイン名を選ぶ際には、自身のブランドを表現したり、ビジネスの認知度を向上したりといった利点があるからです。

ポートフォリオサイトの独自ドメインは、覚えてもらいやすいように、また一目見ただけであなたが誰なのかわかるよう選びましょう。

例えばあなたが「山田花子」という名の写真家であれば、氏名だけをドメイン名に入れた「hanako.com」より、氏名と専門分野をドメイン名に入れた「hanako.photo.com」としましょう。

さまざまな分野のクリエイターやアーティストが Wix を使ってポートフォリオを作成しています。この章では、 Wix を使って作成されたポートフォリオサイト事例を紹介します。ぜひ参考にしてみてください。

美しい植物やかわいらしい動物、美味しそうな食べ物をモチーフに、柔らかなイラスト作品を手掛けるイラストレーターのむらもと ちひろさん。トップページでは、ゆっくりなスピードのスライドショー機能を使って、複数の作品を1点づつ見せることに成功しています。複数の作品をじっくり見てもらいたい場合に、真似したいテクニックです。

ライブペイント活動など音楽にも携わっているイラストレーターのツチヤヒトミさん。作品集である「ILLUSTRATION」のページは、作品によって表示サイズを変え、見せ方に工夫を施しています。また、手書き風の署名ロゴ「ht」を配置することで、オリジナリティと暖かみさを表現し、ブランドイメージを視覚的に認識するための上手な使い方をしています。さらに、「WORKS」に過去の実績を掲載することで、クライアントにとってイメージの湧きやすいサイトとなっています。

劇作家、演出家、パフォーマー、​映像作家、そしてグラフィックデザイナーと、多方面で活躍する​​大串 潤也さん。「ABOUT」ページではご自身の写真と共に、活動内容と自己紹介文、仕事に対する姿勢などが簡潔にまとめられていて、大串さんの人間性がよくわかるポートフォリオとなっています。

国内外で多くの個展開催や受賞歴を誇る実力派アーティスト、森洋史さん。トップページでは、作品そのものではなく自身の個展の一角を掲載することで、実力を上手くアピールしています。コンタクトフォームのページには背景に拡大されたイラスト作品を使うことでユニークでインパクトのある仕上がりとなっています。また、こうした遊び心から、森さんというアーティストの人物像がよく伝わってくる点にも注目です。

数々のフォトコンテストで受賞歴のあるフォトグラファーの Yasutomo Kato さん。ウェルカムページでは、息を呑むような美しい風景写真を、画面全体にスライドショーを用いて表示しています。また、「Gallery」ページで季節やジャンルごとの高画質な画像をスライドショーで見せることで、シンプルなサイト構造だからこそ作品のクオリティを前面に押し出したポートフォリオサイトとなっています。コンタクトフォームのページの背景にも写真を使い、サイトの隅々まで写真家らしさを発揮するデザインとなっています。

トップページでは、作品とその世界観を表現するスライドショーと、クリーンなメニューだけというシンプルなデザイン。しかし、ポートフォリオに訪れた人を一瞬で作品の世界に誘い込む、お手本のようなポートフォリオデザインです。

ミニマルでありながら、非常に機能的で作品そのものを表現しているかのようですね。またページを切り替えると、フェードアウトアニメーションによってページが混じり合うように移動するデザインも素敵です。

トップページのヘッダー左にプロフィール・連絡先・肩書き・SNSを掲載。右にはユーザーが使いやすいように、コンテンツの種類でフィルターがかけられるメニューを設置しています。

ポートフォリオを見た潜在顧客が、直感的に目的のコンテンツを探すことができるUI に優れたデザインです。その上、問い合わせやすい作りになっており、仕事につながる実用的なポートフォリオサイトです。職種にかかわらず、どんなポートフォリオへも適応できるコツが満載なので、ぜひ参考にしてみてください。

ポートフォリオサイトを作成する準備は出来ましたか？ まずは、ポートフォリオを作る目的を明確にすることで、見た目だけとは言わせない、実用的なサイト作りを目指しましょう。

他にも、人気イラストレーターによるポートフォリオサイトはこちらのブログ記事でも特集しています。ぜひ、インスピレーションの参考にしてみましょう。

Wix には魅力的なポートフォリオを作成するために必要な機能が揃っています。Wix プロギャラリーを利用すれば、右クリック防止機能により無断ダウンロードが阻止できたり、アニメーションやエフェクトを追加したりすることも簡単です。

まずは無料で、Wix のパワフルなエディタを体感してみてください。

作品の適切な掲載点数とは？

たくさんアピールしたいあまり、これまで手掛けてきた作品やプロジェクトを全て掲載したくなってしまうのが、ポートフォリオ作成時の心理です。しかし、ポートフォリオは量よりも質が重要です。

最大でも 10 〜 20 を上限として、厳選した作品のみに絞って掲載しましょう。特に就職活動のためのポートフォリオ作成時には、応募する企業や、仕事内容に関連する実績を選ぶことも重要です。

ポートフォリオはウェブと紙媒体どちらがいい？
 

ポートフォリオをオンラインと紙媒体のどちらで作成するかは、目的や状況に応じて異なります。しかし、オンラインで簡単に共有できるオンラインポートフォリオはより汎用性が高いと言えます。

 オンラインポートフォリオ

紙媒体ポートフォリオ

編集者：Junko Tazawa

SEO マネジャー