見出し画像

【 忘れてない?? 】 ポートフォリオのターゲットは「採用担当者」 目的は「採用されること」  FirE♯577

先日応募した求人が、クリーク&リバー社さん経由の求人であったため、クリエイター登録をしました。

先日その面談があり、職務経歴書のクリエイター特化の書き方や、
ポートフォリオのサンプルなどもいただきました。

これを元に、ポートフォリオサイトの制作実績のページを改修しました。

私は、今回の改修で気づいたことは、WEBサイトには、目的とターゲットがあり、それはポートフォリオサイトにおいて同様であるということです。
ポートフォリオサイトの、ターゲットは採用担当者であり、目的は採用されることです。



【 クリーク&リバー 】

クリーク&リバーは、代表がクリエーター出身で、クリエーターのために何かをしたいという思いから事業を開始されました。

私の受けたエージェント的な事業もありますが、
クリーク&リバー自体が制作会社でもあります。
その分野は、多岐にわたります。

テレビ朝日の「家事ヤロウ」

この制作も実はクリーク&リバーさんとのことでした。

このように多様なクリエイティブに関わる企業の推奨するポートフォリオのサンプルを元に自身のポートフォリオ改修を行います。


【 ポートフォリオサイトの修正 】

面談の際にいただいた、ポートフォリオのサンプルを元にして、
自身のポートフォリオサイトを改修しました。

ポイントは、キャプチャ画像と、サイトの説明です。
ポートフォリオとしては、最低限必要な情報はこのような点でした。

●クライアント:(例:株式会社○○)
●担当役割:(例:デザイン、コーディング)
●制作期間:(例:3週間)
●使用ソフト:(例:Photoshop/illustrator/HTML/CSS)
●リリース日:(例:2022.11)
●コンセプト:
●ターゲット:
●工夫した点など:


これを元に、制作実績を改修しました。

サイトのキャプチャーは、スクロールできるようになっています。
PCサイズと、SPサイズでコーディングします。

本来はさらに詳細に「この部分」は「こういう意図で〜」という風に説明を加えると効果的とのことでした。

このような構成のページを作る際に便利な
WEBページ全体を一枚の画像として書き出してくれるChromeの拡張機能があります。


【 おすすめ拡張機能 】 FireShot

超有名なプラグインなので、知ってるよ!という方が多いでしょう。

FireShotを使うと、このように、どの範囲をキャプチャするのかが選択できます。

ページ全体をキャプチャすると、WEBサイト全体を長ーい一枚の画像として書き出してくれます。

また、レスポンシブ時のサイトを画像にしたければ、
Googleの[ 検証 ]から、レスポンシブ表示に切り替えてから、FireShotでキャプチャすればOKです。

レスポンシブ画像はこのようになります。↓


【 スマホ版の見せ方 】

キャプチャした画像をマークアップしていきます。
その後、CSSでスマホの高さくらいに見えるように、編集していきます。

キャプチャ画像を入れた<div>にheightを指定し、
overflow: scroll;で、<div>の範囲内で画像がスクロールするようにします。

HTML:

 <div class="capture-sp">
    <a href="https://hogehoge.com">
      <img src="images/works/anela-capture-sp.png" />
    </a>
 </div>


SCSS:

.capture-sp {
  width: 40%;
  height: 360px;
  overflow: scroll;
  margin: 8auto 2auto;

  img {
    width: 96%;
  }
}


CSS (SCSS不使用の場合)

.capture-sp {
  width40%;
  height360px;
  overflow: scroll;
  margin8% auto 2% auto;
}

.capture-sp img {
  width96%;
}

各要素のwidthは任意です。
また、今回のコードの場合、%指定なので、親要素のサイズによって変わります。
この辺りは、カスタマイズしてください。

ポイントは、height の指定と、overflow:scroll; です。

これにより、長いキャプチャもコンパクトに配置でき、スクロールして閲覧できるので、実際のデバイスの可視範囲と近い形でWEBデザインを見せることができます。


【 まとめ 】

ポートフォリオの作成について書きました。

クリエーターの転職に必須となるポートフォリオですが、ただ作品を見せるだけでは、無意味と言ってもいいかもしれません。

私は、実際にポートフォリオを見せながら、口頭で少し説明を加えて面談をしましたが、良い結果にはなりませんでした。

作り込む必要はありませんし、ややこしい動きは控える方が良いと思われます。

WEBサイトに目的やターゲットがあるように、ポートフォリオサイトにも目的、ターゲットがあります。

目的は、採用されることです。
ターゲットは、採用担当者です。

ポートフォリオサイトは、自分のスキルを見せることが目的となってしまっていることが多いように感じます。

しかし、それは、本来の目的ではなく、ターゲットも明確ではないでしょう。

私はこれらの点を今回の改修で気付きました。

採用担当者に刺さらないポートフォリオサイトを見せれば、入社後に、ターゲットに刺さるWEBサイトを作ることは期待されないでしょう。

それくらいに、ポートフォリオサイトは重要ですね。


この記事が気に入ったらサポートをしてみませんか?