就職のためのポートフォリオ（自分の作品や経歴をまとめて見せるWebサイト）は、作品を並べるだけでは伝わりません。Webデザインの専門校の授業で、ポートフォリオ制作について先生から教わったことの中で、特に大事だと感じた3つのことを、良い例・悪い例と一緒にまとめます。
この記事でわかること
- 就職用のポートフォリオで、企業が見ているポイント
- ファーストビューで「一番見せたいもの」を伝える理由
- マイナスなことや、関係のない自分の話を書かないほうがいい理由
- 学校での成果を「期間」と「成長したところ」で見せる方法
- それぞれの良い例と悪い例
結論
就職用のポートフォリオは、見る人（採用担当の人）が「この人がうちの会社に入ったら、どう成長して、どう役に立ってくれるか」を想像しやすい作りにすることが大切です。そのために、最初の画面で一番見せたいものを伝え、マイナスな話は書かず、どのくらいの期間で何ができるようになったかを分かりやすく見せます。
就職用のポートフォリオは「自分を伝えるWebページ」
ポートフォリオ制作を教えてくれた講師の先生は、ブログでも、就職のためにWebページを作るときの考え方を順を追ってまとめています。
その記事では、就職用のWebページで企業が見ているポイントとして、次のようなものが挙げられています。
- 見た目（デザイン）
- ページの組み立て（構成）
- 使いやすさ
- コード（Webページを作るための命令文）の基本が分かっているか
- 「なぜそう作ったのか」を説明できるか
特に大切にされているのが、最後の「なぜそう作ったのかを説明できること」です。作品がきれいにできていても、作った理由を言葉にできないと、考えて作れる人なのかが伝わりにくくなります。
また、作品ごとに「作った目的」「だれに向けたものか」「工夫したところ」「使った技術」などを書いておく形も紹介されていました。くわしくは、講師の先生の記事「就職のためにWebページを作る」（Web白描）で読めます。
ここからは、授業で先生から直接教わった3つのことを、順番に見ていきます。
1. ファーストビューで一番見せたいものを伝える
ファーストビューとは、Webサイトを開いたときに、スクロールしなくても最初に見える画面のことです。授業では、ファーストビューで「一番見せたいもの」を伝えるように教わりました。
採用担当の人は、たくさんの応募者のポートフォリオを見ます。最初の画面で「何ができる人なのか」が分からないと、その先を読んでもらえないこともあると考えられます。だからこそ、最初の画面には、いちばん伝えたいことを一つにしぼって置くことが大切です。
悪い例
- 大きな背景写真と「ようこそ！」という言葉だけで、何ができる人か分からない
- 作品は、何回もスクロールしないと出てこない
- 動きのある演出が多く、読み込みや表示に時間がかかる
良い例
- 「Webデザイナー」のような職種と名前、得意なことを短い一文で書いている
- 一番見てほしい作品（代表作）の画像が、最初の画面に見えている
- 「作品を見る」のように、次に何をすればいいかが分かるボタンがある
自分のポートフォリオを作るときは、まず「この画面で一番伝えたいことは何か」を一文で書いてから、デザインを考えると迷いにくくなります。最初の画面や余白の決め方で私が悩んだ話は「Webデザインの勉強で一番つまずいたこと｜余白と最初の画面に悩んだ話」に書いています。
2. マイナスなことは書かない（関係のない自分の話もいらない）
Photo by Kelly Sikkema on Unsplash
2つ目は、マイナスなことは書かないということです。特に、仕事と関係のない自分の事情や気持ちの話は、ポートフォリオにはいらないと教わりました。
ポートフォリオは、自分の良さを知ってもらうための場所です。「まだ未熟ですが」「苦手ですが」と書くと、謙虚な気持ちのつもりでも、読む人には「自信がない人」「できないことが多い人」という印象が先に残ってしまいます。また、体調や家庭の事情、前の職場の話など、仕事に関係のない話は、読む人が知りたい情報ではありません。
ただし、「苦労したこと」を全部書いてはいけない、というわけではないと思います。先生のブログでも、作品の説明に「苦労した点」を入れる形が紹介されていました。大切なのは、苦労を「できなかったこと」で終わらせず、「どう工夫して乗り越えたか」まで書くことです。そうすると、マイナスな話ではなく、問題を解決する力を伝える話に変わります。
悪い例
- 「デザインはまだ未熟ですが、見ていただけるとうれしいです」
- 「途中で体調を崩してしまい、思うように進みませんでした」
- 「前の仕事が合わなかったので、Webの道を選びました」
- 「配色が苦手で、うまくできませんでした」
良い例
- 「見る人が迷わないことを一番に考えて作りました」
- 「配色に迷ったので、参考になるサイトを3つ見比べて、使う色を3色に決めました」
- 「スマホで見たときに文字が詰まって見えたため、行の間隔と余白を調整しました」
- Webを選んだ理由は、「伝え方を工夫するのが好きだから」のように、前向きな理由を短く書く
悪い例の「配色が苦手で」と、良い例の「参考サイトを見比べて3色に決めました」は、同じ悩みから生まれた文章です。書き方を変えるだけで、「苦手な人」から「調べて決められる人」に印象が変わります。
3. 学校での成果は「期間」と「成長したところ」を分かりやすく
Photo by Theme Photos on Unsplash
3つ目は、企業へ学校での成果を見せるときの考え方です。授業では、「この人がうちの会社に入ってくれたら、どのように成長して貢献してくれるか」を採用担当の人がイメージしやすいように作ることを教わりました。そのために、どのくらいの期間で、どこが成長できたのかを分かりやすく見せることが大切です。
学校で学んだ人は、まだ仕事としての実績が少ないことが多いです。だからこそ、「今どれくらいできるか」だけでなく、「短い期間でここまで伸びた」という成長の速さや伸び方が、入社後の成長を想像する手がかりになります。
悪い例
- 作品が作った順番に関係なく並んでいて、いつ作ったものか分からない
- 「たくさんのことを学びました」「とても成長できました」とだけ書いてある
- 学校で学んだことの一覧はあるが、それで何ができるようになったかが書いていない
良い例（書き方の見本）
- 「6か月の学習期間で、HTMLとCSSの基本から始めて、WordPressでオリジナルのサイトを1つ作れるようになりました」
- それぞれの作品に「制作時期（例：2か月目）」と「その作品で新しくできるようになったこと」を書いている
- 最初の課題と卒業制作を並べて、「どこが良くなったか」を一言で説明している
- 最後に「今後は〇〇を学び、△△の仕事で役立てたい」と、これからの成長の方向も書いている
良い例の「6か月で」「2か月目」のように、期間を数字で書くと、読む人は成長の速さをイメージしやすくなります。また、「これから何を学びたいか」まで書いておくと、入社後の姿を思い浮かべてもらいやすくなります。Webデザインの専門校の6か月で学んだことの全体は「Webデザインの専門校で学んだことの全体像｜6か月で学べたこと」にまとめています。
3つに共通するのは「見る人の立場で考える」こと
3つのことを並べてみると、どれも「自分が見せたいもの」より先に、「見る人が知りたいこと」から考えている点が共通しています。
- ファーストビュー：見る人が、最初の数秒で「何ができる人か」を分かるようにする
- マイナスなことを書かない：見る人が知りたいのは、できないことより、どう工夫できるか
- 期間と成長：見る人が、入社後の成長と貢献を想像できるようにする
これは、Webサイトを作るときの考え方とまったく同じです。サイトを見る人がだれで、何を知りたいのかを考えて作る。ポートフォリオは、その考え方を自分自身について練習する場所なのだと感じました。
以前、卒業制作のポートフォリオについて書いたとき、私はポートフォリオを「学びの過程と成長を伝える場所」だと考えていました。授業で教わった「期間と成長したところを分かりやすく」という話は、その考えを、企業の目線から具体的にしてくれるものでした。卒業制作のポートフォリオで意識したことは「卒業制作のポートフォリオで意識したこと｜Webデザインの専門校での学びの記録」に書いています。
この記事のまとめ
就職用のポートフォリオは、作品を並べる場所ではなく、「この人と働いたらどうなるか」を想像してもらうためのWebページです。授業で教わった3つのことをまとめると、次のようになります。
- ファーストビューでは、一番見せたいもの（何ができる人か・代表作）を伝える
- マイナスなことや、仕事と関係のない自分の話は書かない。苦労は「どう工夫したか」まで書く
- 学校での成果は、「どのくらいの期間で」「どこが成長したか」を分かりやすく見せる
どれも、見る人の立場で考えるという、Webデザインの基本につながっています。
よくある質問
Q. ポートフォリオのファーストビューには何を置けばいいですか？
A. 名前と職種、得意なことを表す短い一文、一番見てほしい作品（代表作）、作品一覧へ進むボタンなどがあると、何ができる人なのかがすぐに伝わります。
Q. 苦労したことは書かないほうがいいですか？
A. 苦労したことそのものは書いてもかまいません。「できなかった」で終わらせず、「どう工夫して乗り越えたか」まで書くと、問題を解決する力として伝わります。
Q. 学校で学んだ期間が短くても、成長は伝わりますか？
A. 伝わります。期間が短いほど、「〇か月でここまでできるようになった」という伸び方が分かりやすくなります。作品ごとに制作時期と、新しくできるようになったことを書いておくのがおすすめです。
参考
関連記事
