独学・総合大学出身の学生がUI/UXデザイナー新卒就活で勝ち抜くポートフォリオ作りのコツ【チェックシート付き】
デザイナー就活生の皆さん、就活してますか？
きっとこの記事をご覧いただいたということは「就活でポートフォリオを作らなきゃだけど、何も分からん...。」、「ポートフォリオを作ってみたけど、なんかイマイチ...。」とお困りのことだと思います。
僕は21卒として、非美大芸大出身の総合大学出身・デザインは独学でしたが、UI/UXデザイナーの就活をし無事デザイナーとして新卒入社することができました。
でも当時、ポートフォリオを作ろうとしてはじめに思いました。「作り方を調べても、結局ぼんやりとしか書かれてないか自分語りばっかじゃねぇか...」と。
そこで今回は、就活を通して気づいた、採用をもぎ取るために押さえておきたいポートフォリオ作りのコツを書き残しておきたいと思います。ぜひこの記事を活用・踏み台にして、僕と同じような「非美大・芸大出身の総合大学出身で、デザインを独学で学んできたけど、UI/UXデザイナーになりたい！」という方のお役に立てば幸いです。最後にチェックシートも用意したので、ぜひお役立てください！
【この記事で分かること】
・IT企業に刺さるポートフォリオの作り方
・ポートフォリオとして押さえておくべきポイント
【こんな人にぜひ読んでほしいです】
・非美大芸大出身の総合大学出身・デザインは独学だけど、UI/UXデザイナーになりたい学生
【🚨 おことわり】
この記事に書かれている内容はあくまでも個人の意見です。「このコツ通りにポートフォリオを作ったのに第一志望に受からなかった！」といった場合に責任は一切負いませんし、「ウチの採用担当者はこう考えてない！」と言われても「そうですか、違うんですね」としかお返事しようがありません。
就活生の方は、この内容をすべて機械的に鵜呑みにせず、あなただけのポートフォリオを作り上げてください。
まずは目標、次に目次、最後に作品
まずあなたのポートフォリオをつくるにあたり、ポートフォリオの軸を決めましょう。ここで言う軸とは、「あなたがなりたい将来像」です。具体的になりたいデザイナーさんを想像するのもいいですね。
なりたい将来像がぼんやりとでも決まったら、メモ帳に言語化してみましょう。こっ恥ずかしいですが、自分しか見ませんし、就活中辛いことがあっても自分の気持ちを振り返ることができるのでおすすめです。
次にあなたのポートフォリオの枝を作りましょう。ここで言う枝とは、目次です。よくあるのは、トップページ（アイキャッチと作品一覧）・自己紹介・作品詳細・お問い合わせ、ですね。
どういう構成にするかは、採用担当者があなたのポートフォリオを見て、興味を持ち、あなたに連絡するまでのユーザーストーリーを意識してボタンやコンテンツの配置の導線を考えるのがオススメです。
ここまで内容がまとまってくると、きっと将来あなたのなりたい像になるために経験したいこと（例：toCのUIデザイン、ゲームの体験設計など）ぼんやり浮かんできたはずです。これを参考に、志望する企業を考えてみると良いでしょう。各社の新卒採用ページにはその企業が大事にしていることや求める人物像が書かれているので、参考にしてみてください。特に社員インタビューには結構重要なヒントが盛りだくさんだったりしますよ。
最後にあなたのポートフォリオの葉である作品選びについてです。ポートフォリオに載せる作品は比較的新しくて自信のあるもの4〜8個を選びましょう。ここで数合わせの自信なし作品を載せるのは絶対NGです。後述しますが、採用担当者は学生のポートフォリオを日々大量に見ているプロフェッショナルなので、数合わせで載せた作品なんてのはお見通しです👀
「まだ見せられる作品があんまり無い...」という方は、Daily CocodaやDaily UIに取り組んだり（日々継続してデザインに取り組んだというのも立派な実績です！）、未経験でもOKな（ブラックじゃない）会社にアルバイトして実績を作ったり、あなたの周りの仲間を集めてコンテストに応募するのが良いでしょう。
タダでこんなにお題がもらえるなんて素晴らしい！（Cocoda）
独学で非美大芸大出身なら、ポートフォリオはWebがおすすめ
あなたが非美大芸大出身の総合大学出身・デザインは独学な学生なら、ポートフォリオの媒体は断然Webをおすすめします。理由は4つあって、①いつでも編集・修正ができる、②距離を問わない、③Webコーデングの勉強になる、④お金が掛からない、からです。
まず①に関して、文字通りWebは紙媒体と違い製本の過程がありませんので、いつでも作品を加えたり誤字を修正できます。紙媒体だと、修正がある場合は都度印刷業者に発注して完成を待つ...といった手間が掛かるので、僕は断然Web推しです（ポートフォリオは紙媒体しか受け付けない！と言う企業もありますが、僕はそういう企業は「時代の変化に追いつけていない or ITメインではない」から合わないと考えるようにして選択肢から外していました）。
次に②に関して、Webだとポートフォリオを見てもらいたい相手にURLを送るだけ、という手軽さが魅力だからです。最近のご時世的にもぴったりですし。
③に関しては、UI/UXデザイナーを目指す上でエンジニアとの関わりは必須です。Webに関する知識はあって損はしないので、まずは自分のポートフォリオを実験台にして勉強してみましょう。ポートフォリオは個人制作物と違い「作らないといけないもの」なので途中で投げ出すこともありませんし。それでも「やっぱプログラミングはちょっと苦手...」といった人に関しては、知識がなくてもできるnotionやstudioなどがおすすめです。最近だとfigmaで全部作っちゃうなんてのもありですね。
④は、githubの提供サービスとして1アカウントに1つ無料でURL（github.io）を作成でき、実装もPCさえあれば無料で全部できちゃうからです。紙媒体のポートフォリオだと数回製本したら普通に数万円は掛かるそうですよ😇
サーバー代いらず。便利！
・独学で非美大芸大出身なら、ポートフォリオはぜひWebで！
完成品だけでなく、ストーリーをすべて載せる
あなたが目指しているのはアーティストではありません。デザイナーです。作品において、自己表現で社会に訴えかけるのがアーティストで、デザイナーはヒトの心を動かす・良くする最適解を考える設計者です（少なくとも僕はそう考えています）。
ならば、ただあなたの作品の完成形だけを載せるのは避け、作品ひとつひとつの物語を語りましょう。特に押さえておくべきポイントとして、
・作品が完成するまでに至った過程すべて（失敗も恥ずかしがらず載せましょう！）
・作品のターゲットユーザー（ペルソナ）、提供価値仮説、ユーザーストーリー、ユーザーテストの結果、UIの改善過程
・トライアンドエラーのすべて（PCDAサイクルを何度も回していると尚良し）
・配色、ロゴ、フォント選定、UIデザインをそのアウトレットに決めた理由
・作品の将来像（妄想でも計画でも。ビジネス寄りな会社への応募なら具体的な数字まで計算してみましょう）
などを掲載しましょう。
詳しく書いた一例
あなたのポートフォリオはわざわざ採用担当者が見てくれている
企業の採用担当者は、日々何百何千の学生のポートフォリオを見ています。いくらひとつひとつ丁寧に見ようとしても、時間と体力には限界があります。そんな採用担当者に、有象無象のありがちポートフォリオなんて刺さりませんよね（実際、とある企業の採用担当者は「表紙/トップページを見ただけで学生のデザイン能力はおおよそ測れるから、全部見ない」なんて言ってました。※この発言は僕の所属する会社の採用担当者ではないです）。
採用担当者は細部まで見るので作品のストーリをすべて語りましょう、と先述しましたが、これはあくまでも「採用担当者があなたに興味を持ったら」という条件がクリアされたらの話。なのでまずはファーストインプレッションで勝負しましょう。
ではどうするか。それは、あなたのポートフォリオにおいてもUXデザインすることです。日々たくさんの学生ポートフォリオを見る採用担当者の欲しい情報は、パッと見ただけで分かる得意能力・実力＞必要最低限のプロフィール（何年卒？どこ大の何年？何が得意？）＞自社に合った学生かどうか（将来何がしたいどうなりたい？性格は？スキルの幅は？）だと思います。ここの条件をくぐり抜けてようやく、あなたの作品を見てもらうことができます。
では次に、採用担当者はあなたに対して興味を持ったとします。採用担当者はこう思います。「どの作品から見よう？」
ここで迷わせるような隙を与えてはいけません。なので、ここであなたの魅力を最大限伝えられるような作品ベスト3を選んでおき、他の作品よりも少し目立つ形でデザインしましょう（作品サムネイルにラベルを付けたり、大きくしたり、順番を工夫したり）。
ふー。ようやく採用担当者はあなたの作品を見てくれました。じゃあまず上から丁寧に...なんて悠長なことはさせてはいけません。作品詳細ページにもまずは上部に要旨を書くようにしましょう。はじめに作品の概要をざっくり伝えてから全てを見てもらうのと、最初から最後まで見て理解してもらうのとでは、理解に至るまでの時間が雲泥の差です。
また、あくまでもあなたは「デザイナーを目指す学生」です。学生は学ぶのが本業。作品のクオリティが高いに越したことはないですが、経験を通して何を学んだのか・どう成長したのかを書き、あなたの可能性をアピールしましょう。採用担当者はあなたのような新卒に対して、実力だけでなく将来性も含めた能力を知りたがっています。
おつかれさまです。採用担当者は最後まであなたの作品を見てくれました！安心〜！で終わってはいけません。ここまで見てくれたのですから、別の作品を見てくれるような導線を設けましょう！何度でも言いますが、採用担当者はわざわざあなたのポートフォリオを見てくれているのです。ブラウザバックをして作品一覧から次に見るあなたの作品を探す...なんてのは手間と時間がかかりますから、すぐ次の作品を見てもらえる工夫をしましょう。
しつこいようですがダメ押しでもう一度言います。ポートフォリオは、わざわざ自分のポートフォリオを見てくれている相手に対する感謝の心を忘れず作りましょう。
・トップページにはパッと見ただけで分かるように、得意能力・実力、必要最低限のプロフィール（何年卒？どこ大の何年？何が得意？）、自分の内面（将来何がしたいどうなりたい？性格は？スキルの幅は？）の優先順位で載せる
・特に見てほしい作品を3つほど選んでおく
・作品詳細ページにもまずは要旨（オーバービュー）を書く
・製作を通して「学んだこと」もあるとなお良し
・作品詳細の最後には他の作品へのリンクを載せる
・見てくれた人を楽しませることも忘れずに！
いろんな人に見てもらう
ポートフォリオはいわばあなたの能力カタログですが、ポートフォリオそのものも作品の一つです。ならばポートフォリオでもPCDAサイクルを回しましょう。PCDAサイクルと聞くと「面倒くさそう🤮」なんて思う人もいるかもしれませんが、要は感想をもらって改善すればいいのです。
まずは第1段階として、あなたの身の回りの人（家族・友人）に「見た感想を教えて！」とお願いしてまわりましょう。ここでのコツは、「添削して！」とお願いするのではなくまずは「感想を聞かせて！」と言いましょう。こうすることで、お願いされた相手は自然と「間違い箇所を見つけようモード」ではなくあなたのポートフォリオを見て感じた率直な感想を教えてくれます（これぞまさしくユーザーテストですね！）。
ここで自分である程度納得できる完成度まで改善できたら、次はいよいよプロから感想をもらいましょう。プロから感想をもらう方法としては、
・有名デザイナーにDM凸（僕は恐れ多くてそんな勇気はなかったですが、噂では熱意と礼儀をもって接すれば快く応じてもらえるとか）
・企業が開催するポートフォリオレビュー会に参加する
・採用イベントのブースやインターシップ終了後の打ち上げにてプロのデザイナーの方に「ポートフォリオを見てください！」とお願いする
・WantedlyやVivivit、Cocoda、ReDesigner for Studentなどの逆求サービスを活用（作品を掲載してポートフォリオレビューイベントに応募したり、企業からカジュアル面談のお誘いを待つ）
などが挙げられます。たくさんの方からアドバイスをもらって改善を繰り返しましょう。ちなみに、たくさんの人に見てもらうことは面接練習も兼ねることができるので一石二鳥です！
ちなみに早い時期に採用担当者やプロのデザイナーへ雑談レベルでポートフォリオを見せることは、本選考には響かない・やる気をアピールできる・採用担当者のお眼鏡にかなうと個別でインターシップ参加へのお誘いが来たりするという百里あって一害なしのボーナスチャンスなのでぜひ活用しましょう！！
載せる画像のひとつひとつに説明を！
その作品を載せるからには、デザインひとつひとつにそうした経緯、理由、頑張った箇所があるはずです。せっかく苦労して作った作品ですから、余すことなく魅力を伝えましょう。
全部書くのはとーーーっても面倒ですが、採用担当者は一度あなたに興味を持ったが最後、細部に至るまであなたのことを知りたがります。僕も全部に詳細説明を書きながら😫となってましたが、よく採用担当者から「細かいところまで工夫した点が書けてていいね！」と言われました。
・載せる作品画像にはすべて工夫した点、そのデザインにした理由を書く
UIひとつひとつに丁寧な説明を記載する（僕の場合は、常に表示だと画面が文字文字しちゃうので画像をクリックしたら詳細説明が見られるようにしてました）
スキルの☆、意味ありますか？
スキル：illustrator ★★☆、Figma ★☆☆、...。はい、ポートフォリオにありがちな失敗です。そう書いてる人も多いし、テンプレートでもよくあるし書いておこうという気持ちになるのもわかります。でもよく考えてみてください。「知らないゲームキャラの能力が星や点数で書かれてたら、具体的にそいつがどれくらい強いのか分かりますか？」
その評価、あなたの感想ですよね？
...はい、分かりませんね。あなたのツールやスキル、得意分野を表現したい場合は、誰が見ても分かる指標で表現しましょう。誰しもが知ってる指標の例は時間です。星やスコアではなく、ツールを使った時間であなたの得意を表現しましょう。あとは他者から見た客観的な評価である資格や受賞歴もいいですね。
・ツールやスキル、得意分野を表現したい場合は、誰が見ても分かる指標で表現
採用担当者はスマホ画像にうんざり
ポートフォリオにありがちな失敗その2です。UIデザインを載せるにあたって、ぜーんぶモック画像。
採用担当者は、別にモック画像を1つだけ見ればあなたの作品がどの媒体のデザインをしたのか理解できます。なので、モック画像の使用は、作品のサムネイルと、作品詳細ページに1つまでにしましょう。
僕は採用イベントでデザイナーさんに見てもらったときに言われた「別に僕らはiPhoneを見たいわけじゃないんだよねぇ」という言葉が忘れられません。
・モック画像の使用は、作品のサムネイルと作品詳細ページに1つまで
・1つの作品でたくさんのデバイス向けにデザインしました！というアピールにはモック画像の使用は有効
まとめ
以上、僕流、非美大芸大出身の総合大学出身・デザインは独学の、UI/UXデザイナーになりたい学生向けのポートフォリオ作りのコツでした！
就活生の方は、この記事内容をただ機械的に鵜呑みにするのではなく、自分にとって必要な事柄を参考・取捨選択して、ぜひあなただけのポートフォリオを作り上げてください！
こんな長い文章を最後まで読んでくださった真面目なあなたのことです、きっと就活はうまくいくはずです！🙏
なお、就活は通過点でありゴールではありません。入社してからがデザイナーとしてのキャリアスタートです（なので就活で燃え尽きないでね！）。
偉そうなこと言ったんだから、責任持って俺の/私のポートフォリオを添削してくれよな！DMも大歓迎です🙌 ポートフォリオ添削でも就活相談についてでも！
参考までに、僕の就活時のポートフォリオも載せておきます。
また、付録のチェックシートを付けておきます！お役立てください！↓
ポートフォリオ作成参考チェックシート
✅ トップページ
・目を引き、あなたの人となりが分かるようなキャッチ（色や動きでインパクトを与えるのもいいですね）
・必要最低限の自己紹介（名前、◯年卒、出身校、得意なこと）
・作品一覧（特に見てほしい1〜3作品は目立つ形にしておく）
・どのようなジャンルの作品なのか（これによりあなたの能力の幅をアピール！）
・各種SNS、逆求人サイトへのリンク（最終的にそこ経由で連絡がもらえるように！）
✅ 作品詳細ページ
・作品の要旨（作品を一文で言い表すと？特に頑張った点は？どんな役割をした？いつ作った？どれくらいの期間で作った？何のツールを使った？受賞した？授業内課題or自主制作orバイト？グループワークor個人作業？）
・作品が完成に至るまでの経緯（どんな手法を用いた？なぜその手法を使った？具体的に何をした？どういう結果が得られた？）
・作品のモック画像（作品の対応デバイスを伝える！）＆作品の雰囲気が伝わる画像
・立てた目標、作品の将来像
・成果物（工夫、頑張った点はひとつひとつ余すことなく書く！）
・作品作りを通して学んだこと
・他の作品へのリンク
✅ 自己紹介ページ
・名前、◯年卒、出身校、得意なこと
・知ってほしい経験、経歴
・学歴やインターン経験歴
・将来はどんなデザイナーになりたいか
・使える、得意なツール
・自分が大事にしている考え方
✅ 作品は比較的新しくて自信のあるものを！
✅ ツールやスキル、得意分野の表現は、誰が見ても分かる指標に！
✅ 日々の頑張り（読んだ本、あなたが執筆したnote記事、Daily Cocodaなど）
✅ ポートフォリオも作品だけどメインコンテンツではない！最も目立つのは作品になるように！
✅ ポートフォリオについても語れるように！（色、フォントなど、なぜそれを選んだかなど）
✅ ポートフォリオを見た人が楽しい気分になれるように！飽きさせない！
✅ あなたのポートフォリオを見てくれた人への感謝の言葉や気持ち
この記事が気に入ったらサポートをしてみませんか？