スクール受講生のポートフォリオ作品例！作り方や印象に残すためのコツも解説

デザイナーやWeb制作者などのクリエイターを目指す方にとって、ポートフォリオは自分のスキルや作品を伝えるための大切なツールです。

一方で、「どのような作品を載せればよいのか」「そもそも作り方がわからない」と悩む方も多いのではないでしょうか。

本記事では、女性向けキャリアスクールSHElikes（シーライクス）の受講生が実際に作ったポートフォリオを紹介しながら、デザインや構成など、印象に残るポートフォリオを作るコツを解説します。

ポートフォリオはなぜ重要？

ポートフォリオは、クリエイターが自分のスキルや実績を目に見える形で伝えるための作品集です。

転職活動やフリーランスとしての営業では、これまでの制作物を通じて実力を具体的に伝える大切な材料になります。

履歴書や職務経歴書だけでは、「実際にどのようなものを作れるのか」は伝わりにくいものです。ポートフォリオがあれば、作品の完成度に加えて、制作の考え方やプロセスも見てもらえます。

SHElikes受講生のポートフォリオ作品例

ここでは、デザイナーやWebライターなど、異なる職種のSHElikes受講生の作品例を紹介します。

• まゆこさん｜Webデザイナー
• みやびんさん｜Webデザイナー
• meguさん｜LPデザイナー・Webデザイナー
• クガイシオリさん｜Webライター
• 楓子さん｜デザイナー

構成の工夫やサイト全体の見せ方など、参考にしてください。

まゆこさん｜Webデザイナー

まゆこさんのポートフォリオは、シンプルで洗練されたデザインが特徴で、全体を通して統一感と見やすさがあります。

特に印象的なのは、トップページに自分の写真を載せている点です。閲覧者に親しみや安心感を持ってもらうための工夫が伝わります。

全体のレイアウトやナビゲーションも直感的で、ユーザーエクスペリエンス（UX）を意識した設計です。掲載作品のバリエーションや色使い、フォント選びなど、まゆこさんならではのセンスやこだわりも随所に表れています。

＞＞まゆこさんのポートフォリオはこちら

みやびんさん｜Webデザイナー

みやびんさんのポートフォリオの特徴は、作品の幅広さです。コーポレートサイトやECサイト、ランディングページまで幅広いジャンルの作品を載せており、案件ごとに異なるデザインアプローチをとっていることがわかります。

クライアントからのコメントも掲載されており、実際にどのような評価を受けたのかを確認できます。

みやびんさんがクライアントの要望をくみ取り、丁寧に対応してきたことが伝わる構成です。

＞＞みやびんさんのポートフォリオはこちら

meguさん｜LPデザイナー・Webデザイナー

meguさんのポートフォリオの魅力は、デザインに対する考えや工夫がしっかりと言語化されている点です。

文字や画像の配置、配色、フォントの選定のそれぞれに意図があり、マーケティングの視点やユーザーの行動を踏まえて設計していることが伝わります。

デザインの根拠が説明されていると、クライアントは「意図を持ってデザインできる人だ」と判断しやすくなります。

サイト全体の構成もシンプルで、閲覧者が実績やプロフィールにスムーズにたどり着ける導線になっていることもポイントです。

＞＞meguさんのポートフォリオはこちら

クガイシオリさん｜Webライター

Webライターのクガイシオリさんは、Notionを使って文章ベースのポートフォリオを作っています。SEOライティングやインタビューなど、記事をジャンル別に分けて読みやすく整理しているのが特徴です。

キャリアスクールでのコミュニティプランナーとしての活動や、フリーランス限定コミュニティの運営経験も紹介されています。「書く」以外の経験も載せることで、仕事への姿勢や人柄まで伝わる内容です。

クガイシオリさんは、入会3ヶ月目にライターコンペで優秀作品に選ばれています。入会から半年でお仕事チャレンジ^_※1に挑戦し、大手メディアの取材案件を担当しました。

入会8ヶ月目にはライターコミュニティのリーダーになり、その運営経験をきっかけに、企業からコミュニティマネージャーとしてのスカウトも受けています。

※1：学んだスキルで実際のお仕事にチャレンジする機会

＞＞クガイシオリさんのインタビュー記事はこちら

＞＞クガイシオリさんのポートフォリオはこちら

楓子さん｜デザイナー

楓子さんのポートフォリオは、個性的なデザインセンスと、統一感のあるブランディングが印象的です。

注目したいのは、飲食業界に9年間在籍していた経験から「デザインにも栄養を与えられるデザイナーでいたい」というコンセプトを明確に打ち出していること。

自分の背景とデザインの方向性が結びついているため、見る人の記憶に残りやすい構成になっています。

各作品には制作時の想いも添えられており、デザイナーとしての人柄や価値観も伝わってきます。イラストからWebデザインまで幅広い作品を載せ、対応できる領域の広さを示している点もポイントです。

＞＞楓子さんのポートフォリオはこちら

ポートフォリオを足がかりに内定や社内異動をつかんだSHElikes受講生の事例

作品例を見るだけでなく、その作品がどのように仕事につながったのかを知っておくと、自分のポートフォリオに何を載せるかを決めやすくなります。

ここでは、ポートフォリオを作り込んで新しい仕事についた受講生を2名紹介しましょう。

課題の作品でポートフォリオを仕上げ、広告代理店の営業から制作会社のデザイナーになったゆりこさん

ゆりこさんは、広告代理店の営業職からデザイナーへの転職を目指し、2023年12月にSHElikesの短期集中コース「SHElikes PRO デザイナー」_※2に入会。

働きながらでも転職準備を進められる環境を求めたことが、きっかけでした。

入会2ヶ月目には、Webサイト制作課題の作品でポートフォリオを完成させ、講師のフィードバックを反映して転職活動へ。

選考では作品について説明する機会があり、「デザインの意図を言語化する力を褒めていただけた」そうです。フィードバック会で作品の意図を説明してきた経験があったからこそだと、ゆりこさんは振り返っています。応募した30社のうち、内定は2社でした。

＞＞ゆりこさんのインタビューはこちら

※2：実践課題とプロ講師のフィードバック、1on1キャリアコーチングで、デザイナーへのキャリアチェンジを目指す人気の4ヶ月短期集中コース
（旧名称：MULTI CREATOR COURSE Designer）

一度は社内公募に落ちたあと、ポートフォリオを作り込んで営業からデザイナーに社内異動したあみんこさん

あみんこさんは、新卒から6年間営業職として働いたあと、2023年3月にSHElikesに入会。

同年11月の社内公募には一度落ちており、本人も「明らかな準備不足」と振り返るように、当時のポートフォリオにはコース課題が数個あるだけでした。

そこからコース課題やコミュニティのイベントバナー制作に取り組み、作品を増やしていきました。すべての制作物に「目的」や「デザインの根拠」を言語化して添えているのも、あみんこさんのポートフォリオの特徴です。

面接では「ここまで勉強して準備してきた人はこれまでいなかった」と評価され、デザイナーへの社内異動が決まりました。現在はフルリモートで働いています。

＞＞あみんこさんのインタビュー記事はこちら

作品例から見るポートフォリオの構成要素と作り方

魅力が伝わるポートフォリオを作るには、基本的な構成要素を理解し、それぞれをわかりやすく見せることが大切です。

ここでは、就職・転職活動やお仕事の依頼につなげるために押さえておきたい、ポートフォリオの4つの要素と作り方を解説します。

• 自己紹介
• 作品紹介
• スキル
• 将来のビジョン

自己紹介の書き方や掲載する作品の選び方は特に重要となるため、しっかりおさえておきましょう。

自己紹介

自己紹介は、人柄やバックグラウンド、クリエイターとしての想いを伝えるセクションです。経歴を並べるだけでなく、なぜこの分野を選んだのか、どのような価値を提供できるのかを具体的に書きましょう。

たとえば、前職での経験がデザインにどう生きているか、どのような課題解決にやりがいを感じるかなど、自分だけのストーリーを盛り込むと印象に残りやすくなります。

趣味や興味のある分野を少し加えると、人柄が伝わるプロフィールに仕上がるでしょう。

作品紹介

作品紹介は、ポートフォリオの中核となるセクションです。ただ作品を並べるだけでなく、以下の内容を体系的に整理して紹介しましょう。

• 制作背景
• 課題設定
• 解決アプローチ
• 使用ツール
• 制作期間　など

可能であればクライアントからのフィードバックや実際の成果（アクセス数向上、問い合わせ増加など）も併記すると、より説得力のある作品紹介になります。

スキル

スキルのパートでは、自分が使えるツールや技術を、習熟度とあわせてわかりやすく整理します。

デザインソフトやコーディングスキルは、次のように書くと伝わりやすくなります。

ツール名を並べるだけでなく、経験年数や得意分野、作ったものまで添えるのがポイントです。

将来のビジョン

将来のビジョンでは、キャリアの目標や今後挑戦したい分野を伝えます。

たとえば「UIデザインの経験を積み、将来はサービス全体の設計に関わりたい」のように目指す姿を具体的に書くと、読み手にもイメージが伝わりやすくなるでしょう。

営業・人事の仕事から制作会社のWebディレクターに転身したSHElikes受講生の愛さんも、基礎を学んだあと「自分がどのような方向性のデザインをしたいのか明確にできず」、なかなか行動できなかったそうです。

短期集中のSHElikes PRO デザイナー_※3で「どんな制作物を作りたいのか、どんなお客さまに貢献したいのか」を考えるうちに、長期的なビジョンが見えてきたといいます。」

※3：SHElikes PRO デザイナーは、SHElikesに入会後に追加で利用いただけるコースのため、利用中はSHElikesのご継続が必須となります。

印象に残るポートフォリオ作りのコツ

ここでは、クリエイターとして印象に残るポートフォリオ制作のコツを紹介します。

• 読み手に合わせた内容にする
• 制作背景やプロセスの説明を添える
• 見やすいレイアウトと一貫性のあるデザインにする
• 定期的にアップデートする

自分の強みや個性がしっかりと伝わるポートフォリオにするために、ぜひ参考にしてください。

読み手に合わせた内容にする

最初のコツは、採用担当者やクライアントなど、想定する読み手が知りたいことに合わせて内容を調整することです。

Web制作会社への転職を目指すなら企業サイトやECサイトの実績を中心に、フリーランスならジャンル別に作品を並べて、対応できる幅を伝えましょう。

作品例で紹介したみやびんさんも、応募先に合わせて「特に見てほしい自主制作の実績や関連する経験をピックアップし、文章を添えて伝えるようにしています」と話していました。

制作背景やプロセスの説明を添える

作品を載せるだけでなく、制作の背景やプロセスを説明すると、課題を解決する力や考える力を伝えられます。

たとえばWebサイト制作なら、次の流れで整理しましょう。

• クライアントの課題
• ターゲットユーザーの分析
• コンセプト設計
• ワイヤーフレーム作成
• デザイン制作
• テスト・改善

制作の意図は、選考でも問われるポイント。UI/UXデザイナーに転職したふかさんも、選考で作品の制作意図を深く質問され、「なぜこのデザインにしたのか？」を考えながら制作した経験が役立ったと振り返っています。

見やすいレイアウトと一貫性のあるデザインにする

デザイナーを目指す場合、ポートフォリオ自体のデザインも、スキルを伝える材料のひとつになります。

情報の優先順位を整理し、余白や文字組み（タイポグラフィ）を工夫して、読みやすさを意識しましょう。

次の要素に一貫性を持たせると、全体がまとまった印象になります。

• 配色
• フォント
• アイコン
• 画像のトーン　など

たとえば、メインカラーを2〜3色に絞り、全ページで統一感のある見せ方を意識するとよいでしょう。

定期的にアップデートする

ポートフォリオは、一度作ったら終わりではありません。新しい作品の追加はもちろん、スキルが上がったタイミングで既存の作品紹介も見直しましょう。

特に、転職活動を始める前や応募先が変わるときは、載せる作品や説明文を見直す良い機会です。

あみんこさんのように、作品を増やしながら作り込んでいくことで、伝えられる内容も変わっていきます。更新するときは、現役のクリエイターに見てもらい、フィードバックをもらうのもおすすめです。

SHElikesならポートフォリオ作りにも役立つ実践スキルが学べる！

ポートフォリオに載せる作品作りに役立つスキルを幅広く学べます。

まずWebデザインコースで配色・レイアウト・フォントといったデザインの基本を学び、CanvaとChatGPTを活用した自己紹介バナー制作に挑戦。

そこからPhotoshopやIllustrator、Figmaなどのコースに進めば、本格的な制作にも取り組めます。

ライティングコースやマーケティングコースもあわせて受講すると、作品説明文の書き方やSEOの考え方も身につき、伝わりやすいポートフォリオ作りに役立つでしょう。

載せたい作品の種類からコースを選ぶ

SHElikesでは、ポートフォリオに載せたい作品に合わせて受講するコースを選ぶことができます。主なコースと、それぞれで作れるものは次のとおりです。

作品例を参考に自分らしいポートフォリオを作ろう

ポートフォリオは一朝一夕で完成するものではありませんが、目的に合わせて作品を選び、更新を続けることで、キャリアを広げる心強い味方になります。

女性向けキャリアスクールSHElikesでは、未経験から50以上のスキルが定額で学び放題。

基礎から学べるコースから実践的な演習コースまでそろっており、講師からのフィードバックを受けながら、スキルアップとあわせてポートフォリオに載せる作品を作れます。

「自分のポートフォリオを作りたい！」と感じた方は、ぜひ無料体験レッスンにお越しください。

関連記事

• 「Webデザイナーになりたい…」だったらSHElikesを使ってみよう！【受講生のポートフォ…
• Notionを使ったポートフォリオの作り方を解説！スクール受講生の作品例も紹介
• ポートフォリオの自己紹介はどう作成する？魅力が伝わるプロフィールの書き方