【フリーランス】リモートに強いエージェント5社
フリーランスエージェントのおすすめ30社をランキング 気になる1位は?
50,000円がもらえる!フリーランスエージェントの紹介キャンペーン

ポートフォリオは自作とテンプレどっちがいい?半テンプレを無料公開

本ページにはプロモーションが含まれます

Web転職する
ポートフォリオってそもそもどうやって作ったらいいの?
ネットに落ちてるテンプレを使っていいもの?
という疑問についてお答えします。
世間的にポートフォリオを自作するのとテンプレを利用するのでどちらが多いのかも調査しました。

ポートフォリオとは?

Webポートフォリオは自己紹介サイトです。
でもただ自己紹介してもしょうがないですよね。
目的をもって作る必要があります。

ポートフォリオの目的を理解する

まずはポートフォリオの目的を理解しましょう。
ポートフォリオの目的は大きく分けて3種類あります。
  • 就活・転職で自分をアピールする
  • 勉強や自己表現の為
  • 営業ツール(フリーランスが多い)
以上のいづれかの場合かもしくはそれらを複数組み合わせ場合があります。
勉強や自己表現の為、もしくは営業ツール(フリーランスが多い)ではレベルが高くなる傾向がありますが就活・転職目的であれば特別な場合を除いてポートフォリオにハイレベルを目指す必要はありません。特別な場合というのは、狭き門であるハイレベルで人気のWeb制作会社(わからないですがLIG等)はインパクトを求めるかもしれませんが、そうでもなければ問題ありません。以降は就活・転職で自分をアピールする目的について書いていきます。

ポートフォリオ制作において注意すべき点

就活・転職の場合特に注意すべきは以下です。
  • 自分の技術レベルが反映されてる
  • 見る人(面接官)のことを考える

自分の技術レベルが反映されてる

面接もそうですが、自分をあるがまま見せるのは良いですが、大きく見せすぎるのはあまりよくないです。なぜなら技術レベルのマッチングがしないと双方ともに損をします。
例えば、もし未経験であってもポテンシャル採用で入社したい場合、会社側はその全体があれば受け入れ部署や教育者に技術レベルの共有ができますが、そこに差異があると余計なコストや不利益をもたらしてしまいます。なので、そんなことをする人はいないと思いますが、ポートフォリオの外注などは考えないことですね。
堂々と今の自分の技術レベルを認めてもらって入社することが望ましいです。

見る人(面接官)のことを考える

面接官は基本的には現場のプロです。
選考で何人ものポートフォリオを見ることになりますし、忙しい本職の時間割いて見てもらってるということを意識するべきです。
その為時間を無駄に取ってしまうようなプロフィールの作りは避けるべきです。
その辺は下記記事に書いています。
記事の内容をまとめると以下です。

Webエンジニアならこんなポートフォリオはやめましょう

  • 自分にとって高すぎるレベルを目指さない(未経験の場合)
  • 凝った演出は必要なし
  • 見にくい、崩れ、アクションが多い
  • やたら重い
  • 不必要なことを載せる

この辺はWebサイトを作るにあたっても共通して言えることです。

  • 自分にとって高すぎるレベルを目指さない(未経験の場合)
  • 凝った演出は必要なし

は必須でやめた方がいい、というわけではないのでチャレンジできそうな人はやっていいと思います。
ですが、やめましょうと言ってる理由も後ほど解説します。

ポートフォリオに盛り込むコンテンツとは?

基本的にコンテンツは必要最低限の下記3つで大丈夫です。
  • 実績(スキル)
  • プロフィール
  • 誘導
この中で何が重要かというとダントツで実績です。
ただ実績がある人はいいですが、未経験や学生の方は実績を作る必要があります。
実績は職種によって盛り込む内容は変わります。

webデザイナー

  • 架空サイトのコーディング
  • デザインした案件
フロントエンドエンジニア(orコーダー)
  • 架空サイトのコーディング
  • コーディングした案件
プログラマー
  • 受託開発
  • 個人開発
実績の作り方や詳細は後日記事にする予定です。

自作とテンプレのポートフォリオどっちがいい?

ここまででポートフォリオの

  • 目的
  • 注意点
  • コンテンツ
がわかりました。
では、ポートフォリオについて実際どう作るかですが、2種類の作り方があります。
  • 1から作る
  • テンプレを利用する
1から作る人とテンプレを利用する人はどちらが多いのかなと思いTwitterで以下アンケートを取ってみました。結果結果は下記です。

14人中2人がテンプレ、12人が1から作ったということで予想以上に1から作る人が多数派でした。

自作の良い所

自作の良い所はポートフォリオ作るだけでも勉強になるという点です。
自分もWeb系企業の1回目、2回目の転職は自作しました。3回目の転職活動では結果的に転職しませんでしたがテンプレ、フリーランスになってからもテンプレで業務委託案件を探しています。

あとは実績が薄い場合、ポートフォリオの出来きも関わってきます。
実績>>>ポートフォリオではあるので実績に時間をかけてほしいのですが、ポートフォリオ自体でのアピールもできるため未経験のうちは特に1から作るのをお勧めします。

自作のデメリット

自作のデメリットはどうしても時間がかかるという点です。
実績がすでにある状態にもかかわらず、ポートフォリオにこだわってしまい転職活動に支障をきたすのは避けなければいけません。
これが先述したハイレベルを目指さない方がいい理由です。

テンプレの良い所

テンプレは割とサクッと案件だけ載せて見せれるので効率的に転職活動できますね。
すぐ働きたいという方はテンプレの方がいいかもです。

テンプレの良くないところ

有名なポートフォリオのテンプレであれば割と面接官にとってはこのポートフォリオ以前も見たなとなりかねません。
なので、そのまま使うよりは若干デザイン変更するか、実績に自信があればよいと思います。

【無料】ポートフォリオの半テンプレを提案

ということで、1から作って勉強したいけど時間がかかるしどっから作ったらいいかわからない。
でもテンプレは人と被る。。という人の為に半分テンプレを用意してみました。
つまりhtmlだけテンプレにしてcssやJSで自由デザインできるということです。

たいしてお助けにはならないかもですが、どっから作っていいかわからない、工数を短縮したいという人にとってはいいかもです。突貫で作りましたので、今後修正する可能性はあります。
またhtmlも自由に変えてもらって大丈夫です。

また、要望等あればDMでお願いします。

codepenに書きましたので試しにFROKで進めるもよし、コピーhtmlファイルに張り付けてもらうもよしです。
別タブで見たい場合は右上のCODEPENロゴをクリックしてFORKというナビをクリックしてもらうとURLが変更されます。

 

See the Pen ZNMNqq by funclur (@funclur) on CodePen.

ポートフォリオがある程度進んだら面接に進みましょう。
面接を受けるタイミングについては以下の記事を参照ください。

【徹底解説】プログラミング独学中どの段階で面接に行くべき?面接のタイミング
Web企業に3社転職、現在フリーランスをしている自分がプログラミング独学中どの段階で面接に行くべき?問題について解説します。

 

【無料】WebIT系優良就活・転職サイトまとめ
レバテックキャリア
レバテック キャリア

レバテックと言えば、フリーランスエージェントが有名ですが、
そのノウハウをそのままにIT・Webの業界や技術に精通した専任のスタッフが正社員の転職求人を紹介してくれます。
自分も利用した時は条件面交渉もがんばってくれました。

Tech Stars Agent

1. エンジニア経験のあるコンサルタントのみ担当!
2. IT・WEB・ゲーム業界特化の専門エージェント
3. 転職だけでなく、独立の支援も行っています
4. エンジニア限定イベントへのご招待も!
厳しい審査を通過した、厳選された求人のみを紹介しているので、
安心して転職を行うことができます。

マイナビクリエイター

転職サイトでは3本の指に入るマイナビですが、マイナビクリエイターはその中でもWeb職・ゲーム業界に特化しています。
つまり求人数が多いことはわかるのですが、量よりも質を重視しているとエージェントの方が仰っていたので、よりお勧めできます。

Web転職する ポートフォリオ作成の手順 転職したい
フォローする
プロフィール
hoshi

フロントエンドのフリーランスとして週5フルリモートで働いてます。

営業

Webデザイナー(アルバイト)

Webデザイナー(正社員)

フロントエンドエンジニア(正社員)

フリーランスとして独立しました。

詳細なプロフィールはこちらを参照ください。

フリーランスエージェントとは28社と面談・取材してきました。

【完全版】フリーランスエージェント28社面談を受けた現役が比較・おすすめランキングを作った

このブログでは、自身の経験からフリーランスを目指す方や駆け出しエンジニアの方に向けてWebを仕事にする方法やトレンド情報をアウトプットしています。

・フリーランスエージェント紹介キャンペーン
・転職やプログラミングの悩み相談
・仕事の依頼

など、各種お問い合わせはこちらからお願いします。

フォローする
hoshilog

コメント

タイトルとURLをコピーしました