エンジニア・プログラマーのポートフォリオ作成のポイント!&無料で作成できるツール4個|
フリーランスエンジニアの求人案件・仕事、募集サイトならSEプランナー

電話番号

無料登録
関連する案件:フリーランスエンジニアプログラマー(PG)システムエンジニア(SE)
フリーランスエンジニア向けのIT求人・案件TOP お役立ちコラムコラム仕事の探し方エンジニア・プログラマーのポートフォリオ作成のポイント!&無料で作成できるツール4個

POST DATE | 2019.04.27

エンジニア・プログラマーのポートフォリオ作成のポイント!&無料で作成できるツール4個

このエントリーをはてなブックマークに追加

エンジニアやプログラマーとして働いていると、「ポートフォリオ」という言葉を聞くことがあります。しかし、具体的にどんなものを指すのか、ご存知でしょうか。今回は、エンジニアの方およびプログラマーの方に必要なポートフォリオの作り方について紹介します。

ポートフォリオとは

ポートフォリオ(Portfolio)とは、英語で「書類入れ」を意味します。そして、ファッションやデザインに関わる業界で働く人が就職活動で企業などに提出する作品集もポートフォリオと呼ばれます。
それにならってIT業界でも、自分の実績や成果物を対外的にアピールするためのものをポートフォリオと呼んでいます。ポートフォリオには大きく分けて「紙ポートフォリオ」と「WEBポートフォリオ」の2種類があります。
紙ポートフォリオは、主に面接の場で面接官に直接見てもらう場合や郵送で応募書類を提出する場合に使用します。
それに対して、WEBポートフォリオはメールなどでポートフォリオサイトのURLを伝えて、自分の成果物を伝えることが可能です。もちろん、WEB上に公開して広く一般の人が閲覧できるようにすることで、営業ツールとしても活用できます。

エンジニア・プログラマーにポートフォリオが必要な理由

エンジニアやプログラマーなどのIT技術者が就職・転職活動を行う際にポートフォリオの提出を求められることは、実はそんなに多くはありません。しかし、自発的にポートフォリオを提出することが就職活動で有利に働くことはあります。なぜなら、ポートフォリオを提出することで、仕事に対して熱意を持っていることが示せるから。
また、クオリティが高いポートフォリオを用意しておけば、自分自身のスキルを評価してもらいやすくなります。特に、WEBポートフォリオはプログラミングの技術を示すこともできるため、プログラマーにとっては自分自身を売り込む絶好の場といえるでしょう。

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

  • 完全無料
  • しつこい電話等はなし

SEプランナー登録はこちらから!

お名前をご入力ください
STEP
STEP
STEP
お名前

次へ進む

ご連絡先をご入力ください
STEP
STEP
STEP
メールアドレス
お電話番号
 -  - 

次へ進む

戻る

スキルシートをお持ちの方はアップロードしてください
STEP
STEP
STEP
スキルシート

個人情報の取扱いについてご同意の上、
「同意して無料登録する」ボタンをクリックしてください。

戻る


ここからは、エンジニアやプログラマーにとって重要なWEBポートフォリオを作成する上でのポイントについて解説します。

レスポンシブWEBデザインで作成する

「レスポンシブWEBデザイン」とは、PC・タブレット・スマートフォンなど複数の端末に最適化したウェブサイトをひとつのHTMLで構築する制作手法のことです。レスポンシブWEBデザインは、WordPressなどのCMS(Content Management System)や、BootstrapなどのWEBフレームワークを使用すれば、複雑なコードを書かずに簡単に実現できます。
しかし、プログラマーがWEBポートフォリオを作成する場合は、あえてHTMLとCSSだけで実装することをオススメします。なぜなら、WordPressやBootstrapを使えばレスポンシブWEBデザインにするのは簡単ですが、自分のプログラミングのスキルをアピールできないからです。イラストレーターのようにプログラミングが本職ではない人がポートフォリオを作成する場合は構いませんが、プログラマーはぜひ自力でコードを書いてみましょう。より高度なWEBポートフォリオを作りたい場合は、JavaScriptなども使用して凝ったサイトにしても良いかもしれません。

わかりやすい構成にする

プログラマーは、他の人が見てもわかるようなプログラミングを構成できる必要があります。そのため、WEBポートフォリオもわかりやすい構成になっていないと、プログラマーとしてのスキルをアピールできません。
例えばグローバルナビを配置するなど、使いやすいユーザーインターフェースを心がけましょう。また、WEBポートフォリオの構成がわかるサイトマップを用意することもオススメです。

経歴やスキルを紹介する自己紹介ページを用意する

ポートフォリオは成果物をアピールするためのものですが、誰が作ったものかがわからなければ意味がありません。必ず自己紹介のページを用意しましょう。
必要となるのは、主に以下の情報です。

・エンジニアやプログラマーとしての経歴や実績
・仕事に対するこだわり
・使用できる言語、OS、ツールなど
・居住地や活動可能な地域

成果物を紹介するページを用意する

成果物を紹介するページはWEBポートフォリオのメインとなる部分なので、ぜひ力を入れて作成してください。これまで自分が関わった案件で「これは自信がある」と言えるものを厳選して掲載すると良いでしょう。
また、それぞれの成果物に対して説明文をつけるのも忘れずに。説明文には以下のような情報について可能な範囲で記載します。

・プロジェクト名
・クライアント名
・プログラムの概要
・ウェブサイトやアプリの場合はメインビジュアル
・制作時期や工数
・制作に複数のメンバーが関わった場合は自分の担当箇所
・使用言語や開発環境

守秘義務がある成果物は管理に気をつける

エンジニアやプログラマーが関わる案件によっては、守秘義務によって成果物を一般に公開できない場合もあります。新規の案件を受注する場合には、ポートフォリオに掲載しても問題ないかをクライアントに必ず確認してください。
また、インターネット上で誰でも閲覧できる状態はNGでも、限られた人だけが閲覧できる場合はOKというケースがあります。その場合はBasic認証を施して、ユーザー名やパスワードを知っている人だけが閲覧できるようにするなど、管理に配慮すると良いでしょう。

コンタクトフォームを用意する

前述のとおり、WEBポートフォリオは営業ツールとしても活用できます。あなたの成果物をみて「仕事を依頼したい」と思った人がいたらスムーズに問い合わせてもらえるように、ぜひコンタクトフォームを設置しましょう。
メールアドレスを記載するという方法もありますが、プログラマーの場合はコンタクトフォームがあった方がWEBポートフォリオの体裁がよくなり、信頼性も高まります。

ポートフォリオの活用例

ポートフォリオが完成したら、ぜひ最大限に活用しましょう。
具体的には、以下のような活用方法があります。

名刺などの営業ツールにURLを記載する

せっかくWEBポートフォリオが完成しても、存在を知ってもらえなければ意味がありません。ぜひ名刺などにURLを記載して、営業相手に閲覧してもらえるようにしましょう。
また、SNSなどを利用している場合は、アカウントの紹介文にもURLを記載しておけば、より多くの人にWEBポートフォリオを閲覧してもらえるかもしれません。

SNSで成果物を拡散する

WEBポートフォリオを公開しただけでは、すぐに閲覧者は増えません。ぜひSNSで成果物を紹介して、ネットユーザーに知ってもらえるようにしましょう。少しでも多くの人に成果物を拡散してもらうためには、日頃から仕事仲間や同業者の人とSNS上で繋がっておくことも重要です。

求人への応募やメールで営業する際にURLを記載する

前述のとおり、WEBポートフォリオは仕事を獲得する上であなたのやる気をアピールする絶好のツールです。求人への応募やメールで営業する際は、ぜひ積極的にWEBポートフォリオのURLを伝えるようにしましょう。

ポートフォリオが作れるツール・サービス

エンジニアやプログラマーであれば、自分でサーバーを構築してオリジナルwebポートフォリオを作成するのも簡単でしょう。とはいえ、そこまで時間をかけることができないという方も多いと思います。
その場合は以下のようなポートフォリオを簡単に作成できるサービスを利用することで、さほど手間をかけずに魅力的なポートフォリオ作成を行うことができます。

Strikingly

テンプレートが非常に充実しているポートフォリオ作成サイトです。無料版と有料版とがありますが、転職など一時的な利用であれば無料版で十分です。ただし、転送データ量制限やカスタムドメイン制限があるため、交流やSNSリンクなど長期利用を前提とする場合は有料版がおススメです。

salon.io

3ページ・150イメージまで無料で利用できるポートフォリオ作成サイトです。ドラッグ&ドロップで簡単に作成できるため、時間がないけど魅力的なポートフォリオを作りたいと考える方にはぴったりです。HTMLやCSSを追加できるエディター機能もあるため、エンジニアとしてのスキルもアピールできる点がメリットです。

Ameba Ownd

ブログサービスで有名なアメーバにもポートフォリオサイトがあります。非常にスタイリッシュかつ多機能であり、スターバックスコーヒージャパンをはじめとした大手企業もこのサービスを活用しています。Ameba Owndのロゴは数か所に表示される点がネックですが、それを除けば最も”映える”ポートフォリオを作ることができるでしょう。

IM Creator

名前の通りクリエイターのためのポートフォリオサイトですが、エンジニアやプログラマでも効果的なポートフォリオを作ることができます。ただし、英語版であるため苦手な方は苦労すると思います。無料版でも多くの機能が使えるため、まずは無料版で試してみると良いでしょう。

まとめ

今回はエンジニアやプログラマーに必要なポートフォリオの作り方について紹介しました。ポートフォリオはIT技術者としてのスキルの向上に役立ち、営業にも使える便利なツールです。
ぜひオフの時間などを有効に使って、エンジニアやプログラマーとしての成長に繋がるようなポートフォリオを作ってみてください。

このエントリーをはてなブックマークに追加

案件数20,120件 開発会社が運営だからフリーランス向けの優良案件多数

5つの魅力

常駐型フリーランスとは

個別相談会

謝恩忘年会

ご利用者の声