エンジニアのポートフォリオの作り方とは？ポイントを確認して転職を成功させよう

Webエンジニアの転職にポートフォリオは必要？

ポートフォリオとは、自分の作品や書類をまとめたもので、特に、Webやコンテンツ、プロダクトデザイン業界のデザイナーやクリエイターが自分の実績をまとめて「自分の作ってきたものはこれだ！」と面接時にアピールしたりするのに使います。

しかしエンジニアの場合、ポートフォリオという言葉を耳にしたことはあっても、具体的な内容については分からない、また見たこともないという方は多いのではないでしょうか。

Webエンジニアの転職にポートフォリオは必要なの？職務経歴書（スキルシート）があれば十分ではないの？と思われる方もいらっしゃるかもしれません。 ここでは、エンジニアがポートフォリオを作成するメリットについて解説します。

現場以外の人が見たときにもスキルが伝わりやすい

「Web系エンジニアの職務経歴書（スキルシート）のポイントと書き方」の記事で、「職務経歴書（スキルシート）はあなたを勝手にプレゼンする資料」であるということを述べました。これはポートフォリオにも言えることで、むしろ職務経歴書（スキルシート）以上に（プロジェクトマネージャーや人事などといった）採用決定権がある人に対しての訴求力が期待できます。

なぜなら、ポートフォリオは「こういうのを作れる人なんだな。」ということが一発で伝わるからです。非常に大きなアドバンテージとして有利に働くこととなるでしょう。

システムエンジニア 兼 プロジェクトマネージャ

萬徳 邦尚 さん

私がポートフォリオを作りはじめた理由ときっかけ
私は、以前勤めていた企業で、Webサービスの管理画面のフロントエンドデザインなどを担当することが多かったのですが、面接時にそのスキルを具体的にどう伝えたらよいだろうかという悩みを抱えていました。

そんなときに、Webデザイナー出身の同僚のポートフォリオを真似て、自分のポートフォリオを作ってみたのです。実際に転職での面接時に、ポートフォリオを使いながら話をすると、自分の行ってきたことが伝わりやすくなったというのを感じています。 経験してきた職務や業務内容をわかりやすく相手に説明するにはポートフォリオがうってつけであると思います。

なお、私は、職務経歴書（スキルシート）のアップデートを1年に数回実施していますが、あわせてポートフォリオの更新も行っています。

プレゼンテーションのシミュレーションができる

応募者は、ポートフォリオを作成することで面接のシミュレーションを行うことができます。どういうことかというと、採用面接時には、経験してきた業務をの説明を求められることが多いのですが、ポートフォリオを作りながら「ここではこれを説明すればいいな。」「この質問が飛んでくるかもな。」といったことが見えてきます。面接をイメージしながらポートフォリオを作ってみてください。

自分が行ってきたことの振り返りになる

特にポートフォリオをWebサイトで公開する場合にいえることですが、ポートフォリオを作ることで自分が学んできた知識を振り返ることができます。

何の言語で、どういうデザインフレームワークを使って、どこで公開するか。 応募者はポートフォリオを作るというモチベーションのために、今まで積み重ねてきたスキルを振り返ることができます。その中で、もし欠けている知識があれば、ポートフォリオをきっかけに学ぶというのも良いでしょう。

Webエンジニアがポートフォリオを作成するメリット

Webエンジニアがポートフォリオを作成するメリットについてご紹介します。

面接時に話をふくらませやすい

ポートフォリオがあることで、面接時に圧倒的に話をふくらませやすくなります。

職務経歴書（スキルシート）は、あくまでも応募者が経験してきた業務の概要（業務内容や経験スキルなど）のみを記載することがほとんどです。一方で、ポートフォリオではコード・デザイン・場合によってはUML図などを掲載することができます。これがあると、面接官や採用する立場の人間は、応募者がどう開発に携わっていたか具体的に想像しやすくなるのです。

そして、実際にどうやって作ったのか、運用はどうしていたか、開発していたときにどういう問題やトラブルがあったのか、といった質問を面接官がしてくると期待できます。 面接時に話がふくらむということは、あなたを評価する軸が増えるということですので、採用にむけて優位に働くことでしょう。

作るだけで頭ひとつ抜けられる・差をつけられる

Webエンジニアの人で、ポートフォリオを作っている・公開している人というのはそこまで多くないでしょう。ということは、ポートフォリオがあるだけで加点対象となるかもしれません。

逆に考えてみてください。もし、あなたが採用する側として、職務経歴書（スキルシート）しか持ってきていない人と、職務経歴書＋ポートフォリオの2つがある人がいたら、どう評価するでしょうか？きっとポートフォリオもある人のことを高くみると思います。作るだけで、評価があげられるならばこんなに簡単なことはありません。

面接で話がうまくできなかったとしても、ポートフォリオがあなたを救ってくれることも

Webエンジニアの採用条件において、スムーズに喋ることは必須条件ではないですが、「あがってしまって全然話せそうにない。」「相手がどういう質問をしてくるか心配だ。」ということもままあると思います。

こういった不安に、ポートフォリオは応えてくれるかもしれません。先述の通り、ポートフォリオがあると面接官はそれを見ながら質問してくる可能性が高くなる…ということは、応募者にとって答えやすい質問が返ってきやすくなるからです。

Webエンジニアのポートフォリオの作り方

次に、実際にエンジニアがどうポートフォリオを作ればよいのか、解説します。ポートフォリオは、下記の2つの形態のどちらかで作成するのが一般的です。

Web・GitHubポートフォリオ

Web上で作成するポートフォリオです。コードを見せたい場合などはこちらを選択します。レンタルサーバやAmazon Lightsailなどを利用する方法もありますし、GitHub Pagesなどを使ってもよいでしょう。

また、Web・GitHubポートフォリオには、GitHubはもちろんのこと、QiitaやStack Overflowなどに投稿している人はそこへの動線もあると尚良いでしょう。

▲Webポートフォリオの一例。対応できる業務や実績などを記してみてください。

紙ポートフォリオ

スライドで作成するポートフォリオです。プレゼン資料のイメージに近いものだといえます。

メリットは、ネット環境に繋げない場合でもさっと見てもらえることです。要件定義やドキュメント制作が主な業務となるシステムエンジニアやプロジェクトマネージャー職の方にはこちらも向いています。

▲紙ポートフォリオの一例。

職種別ポートフォリオ作成例

ポートフォリオは、デザイナーやフロントエンドエンジニアはもちろんのこと、SEやバックエンドエンジニア（プログラマー）、サーバーサイドエンジニアといった職種に応募する際もおすすめです。以下にいくつかの職種別にこんなことを載せるとよいという一例を記します。

フロントエンドエンジニア

フロントエンドエンジニアの方がポートフォリオを作成するのであれば、最低でもHTML・CSS・JavaScriptによるコーディングスキルが分かるようなポートフォリオとすることが必要です。この3つはたいていどこの現場でも使います。

そして、以下の要素もできるだけ入れるようにしてください。

デザイナーではないので、かっこいいWebサイトを作る必要はありませんが、使いやすい、見やすいサイトになっているかを意識するようにしましょう。

バックエンドエンジニア

バックエンドエンジニアの方がポートフォリオを作成するのであれば、データベースとの連携処理の部分やOAuth、API連携のところのコードをみてもらえるようにするとよいでしょう。理由としては、外部との連携部分を作ったことがあるということがアピールできるようになるからです。

また、AWSやMicrosoft Azureといったクラウドを使っているような処理が入っているところをみせると、この人はクラウド環境での開発構築をしていたんだなというのが伝わりやすくなります。

さらに、セキュリティ対策を行っている・意識していることをアピールできるような処理が入っているとよいでしょう。

システムエンジニア・プロジェクトマネージャー

システムエンジニアやプロジェクトマネージャーの場合、設計書の作成やドキュメント・チケット管理、もしくは稼働計画などを作ることが多く、フロントエンドエンジニア、バックエンドエンジニアのポートフォリオのようにわかりやすいものがない…というのが実情です。

私の場合、UML図を模したものをいれたり、ドキュメント制作やスケジュール管理をどのようにしていたかを説明できるようにしています。具体的には、PlantUMLやdraw.ioなどといったツールを使ってUML図を見せられるようにしていたりなど…。自分の行ってきた業務をマークダウン形式で整理しておくのもよいでしょう。

▲ワークフローの一例。これは実際の業務を模して作成したものです。

ポートフォリオを作成するにあたっての注意点

Web・GitHubポートフォリオを作成する場合はコードを整える

コードを見られる可能性があるポートフォリオの場合、コードのインデントは揃えるようにします。また、Syntax Errorなどおこらないように、事前に動作確認をしておきましょう。余計なゴミコードや不必要なコメントも削除しておいてください。

秘密保持契約には気をつけて！

どの形態、どの職種でもですが、ポートフォリオは秘密保持契約の範囲内で書けることのみとなりますので注意してください。業務で作成したコードや画像、仕様書を流用するのはほとんどの場合NGです。

ポートフォリオを作って評価を上げよう

よく「当たり前のことをやっている人は評価される。」と言いますが、ポートフォリオはその一つだと思います。

「職務経歴書（スキルシート）に加えてポートフォリオを作るのは面倒…。」と思う方も多いかもしれません。しかし、ポートフォリオは時間さえかければ必ず作れるものですので、早めに、そしてゆっくり準備して転職に望むようにしてください。

文中でも述べましたが、プラスになることはあっても、マイナスになることはありません。

あなたを救ってくれるかもしれないポートフォリオ、ぜひ作ってくださいね。