UIデザイナーとして転職活動をするとき、避けて通れないのが「ポートフォリオづくり」。
しかしUIデザイナーとしての特性をどうやって見せればいいのか、迷ったことはありませんか？協業や機能性も重視される「UIデザイナーの価値の可視化」について、デザインと開発でプロダクト開発を支援するCRUTECHの執行役員兼UIデザイナー・堀田さんとバイネーム代表の井上で語り合いました。UIデザイナーの価値や評価について、採用する側／される側、それぞれのリアルな視点からヒントが見えてきました。

※ 今回はXスペースで配信した内容を記事として読みやすく編集した内容でお届けします。

プロフィール

堀田愛子
株式会社CRUTECH 執行役員／UI/UXデザイナー
グラフィック、Webデザイン、UIデザイン、プロダクトデザインなど15年以上のマルチなデザイン経験を経て、2024年よりCRUTECHの執行役員に。現在は一人目デザイナーとして組織づくりにも注力。

井上一貴
株式会社バイネーム　代表取締役社長／UI/UXデザイナー
デザイナーやPM経験を経て独立。2022年に株式会社バイネームを設立。現在は会社を経営しつつ、自身もUX、UIデザイナーとして活動している。

■ UIデザイナーの価値は、画面の設計だけじゃない

井上：UIデザイナーの評価や判断基準って、本当に難しいですよね。私が業界に入った頃は職種としてもまだ新しく、担い手も多くありませんでした。堀田さんは、UIデザイナーを始めた頃に意識していたことはありますか？

堀田：私はWebからUIに進んだのですが、当初は「デザインスキルよりもまずコミュニケーション力を身につけたい」と思っていました。ヒアリングなど、いわゆるソフトスキルですね。

Webデザイナー時代は受託だったので、クライアントへのヒアリング→ディレクター経由でデザイナーに伝達、という流れが一般的でした。しかし事業会社に移ると、POやエンジニアリーダーと直接会話しながら決めていく場面が一気に増え、圧倒的に“会話の量”が必要になったんです。だからこそ、一番必要だと感じたのがコミュニケーション力でした。

井上：なるほど。私も最初にUIデザイナーになった頃はディレクションも兼任していました。自分で要件整理からレイアウトや機能設計まで一気通貫で対応していたんです。UIを形にするプロセス自体を探りながら進めていたのが、今振り返ると “UIデザイナー” という職種が生まれた頃の特徴だったのかもしれません。

■ WebデザイナーとUIデザイナーの能力は違う

井上：UI/UXはセットで語られることが多いですが、両方を高いレベルで担うのは簡単ではありません。だからバイネームでは「UIデザイナー」として募集していますが、それでもUIをきちんと噛み砕けていない方も多く見かけます。

Webの経験を基に“表層のUI”を作れる、というだけだと、私が想定するUIデザイナーとは少し違うんですよね。もちろんWebにもUI要素はありますが、アプリケーションとは文脈が大きく異なると感じています。アプリのUIデザイナー募集なのに、ポートフォリオがWeb案件ばかりだと「違うかもしれない」と思ってしまうことがあります。

堀田：それはすごくわかります。UIもWebも実績があるなら、応募先や希望職種によってポートフォリオの構成を変えるものじゃないんでしょうか？

井上：変えている人は優秀ですね。ただ実際は、UIデザイナーとして応募しているのにWebの強みを前面に出す人が多い。企業ごとにカスタマイズするのは手間ですが、Web中心だとその時点でアンマッチだと判断してしまいます。

特に今はアプリケーションの要件も明確になってきていて、Webの経験だけでUIデザイナーになるのは、昔よりだいぶ狭き門になっていると思っています。

堀田：Webサイトが「見る／読む」が主軸なのに対し、アプリケーションは「操作」が伴うので、同じUIでも文脈が違い、求められるデザインも変わりますよね。

井上: 堀田さんが「この人いいな」と感じるポートフォリオはありますか？

堀田: そうですね。私は成果物そのものより「そこに至るプロセス」を重視しています。どんな考えでこのアウトプットに辿り着いたのかを知りたいんです。

優秀だと感じるのは、考えや信念が言葉で明確に整理され、それが成果物と矛盾なく一致している人。ビジュアルと記述がつながっていると「良いデザイナーだな」と感じます。ただ、そういったポートフォリオは全体の20％以下かもしれません。

井上: わかります。そこまで形に落とせている人は少ないですよね。

応募する側に気をつけてほしいのは、採用担当者は大量のポートフォリオを短時間で見るということ。UIデザイナーを求める会社なら、Webの実績より自主制作でもUIやプロセスを優先的に載せたほうがいいと思います。堀田さんはポートフォリオづくりでその点を意識していましたか？

堀田: 私は応募先に合わせて内容や順番を結構変えていました。応募が多い会社では1件あたりの選考時間も限られるので、UIをやりたいなら一番最初にUIの実績を置いておくのがいいのではないかと。それだけで「自分はUIデザイナー（になりたい）」という意思表示になります。自分が最も見てほしい内容を前に出すのは本当に大事です。

井上: なるほど。ポートフォリオは構成も大事ですが、もちろん内容も見ますよね。堀田さんは「どういう意図やプロセスでUIを作ったか」を重視すると言っていましたが、僕はどちらかというと“どれだけプロジェクトを経験したか”くらいしか見ていません。

というのも、プロセスを丁寧に書いているのはプラスですが、それが「ちゃんと考えて作った結果」なのか「後から理由を付け加えたもの」なのか、ポートフォリオだけでは判断がつかないので。

■ 結局「生Figmaデータ」が最強説

堀田: 事業会社出身だと、携わったプロジェクト数が少ない人もいますよね。1つのプロダクトだけをずっとやってきた人もいますし。そういう場合ってどう評価しますか？

井上: そのプロダクトを担当していた年数や、どんな改善をしてきたかを見ます。キャリアやスキルの厚みは、そういうところから判断できます。我が社の場合、ポートフォリオ選考のハードルはそこまで高くなくて、「ある程度やっていそうだな」という感触で通すことも多いです。

1つのプロダクトを長く続けている人もいれば、同じ期間で複数のプロジェクトを回している人もいる。どちらが優秀かは、正直一緒に仕事をしてみないとわからないんですよね。

だから可能であれば、Figmaファイルを見せてもらうようにしています。もちろんクライアントデータそのままではなく、自主制作や個人ワークの範囲で。レイヤー構造やオートレイアウト、フレームの整理の仕方、コンポーネントやデザインシステム、バリアントの設計バランスなどを見ると、その人がどんな考え方でUIを組んでいるかがよくわかる。ポートフォリオで「できそう」でも、最終的にはデータを見ないと判断できないですね。

堀田: 確かに。最近「ポートフォリオはいらない」という投稿をXで見たんですけど、それに近いですね、実際のFigmaを見るという意味では。

井上: そうかもしれません。僕自身、サラリーマン時代の転職はリファラルが多くて、職務経歴書やポートフォリオをちゃんと作ったことがあまりないんです。「デザインするのは楽しいけど、自分のポートフォリオをまとめるのは面倒」という人、多いと思います。結局、自分の価値をどうアピールすればいいかわからないから、仕方なく作っているケースもあるんじゃないかなと。

でも最近は、「ポートフォリオ＝自分の価値の可視化」とは限らないと感じています。PDFやスライドで綺麗にまとめた実績よりも、UIコンポーネントの作り方や考え方が見える方が、UIデザイナーとしての価値の可視化に近いのではないかと思っていて。そういったデザイナーの実力を、堀田さんはどう見ていますか？

堀田: コンポーネントやバリアントの設定、フレームやオートレイアウトの使い方など、エンジニアにデータを渡すときの配慮って本当に大事だと思います。実装しやすいように考えられている人の方が信頼できますし、逆にカラースタイルが未適用だったり、レイヤーがバラバラだったりすると「ちょっと雑かな」と感じることもあります。

データの作り方が崩れていたり、考え方が整理されていないと、すぐに現場投入するのは難しいです。そういった点がわかるのはFigmaデータならではですね。

井上: もともとWebデザイナーのポートフォリオは、静的データを作ってパーツ単位で切り出してWebに落とし込む形が多く、デザインデータの作り方そのものを細かく見る文化はあまりなかったと思います。

Webデザインは最終成果物を見れば判断できることも多いですが、UIデザインは前後の関係性がより強い。だから実データを見ること自体が価値の可視化なんじゃないかと感じています。

堀田: わかります。データの作り方って、その人らしさが如実に出ますよね。性格も反映されるし。

井上: そこはかなり見ています。商談でも「どういうデザインデータを作るんですか？」と聞かれることが意外と多いので、自社のデザインシステムをベースにした業務系サンプルアプリのデータを見せて、「コンポーネントはこの単位」「スタイルはこう整える」「Web／iOS／Androidでフォントやサイズはこう分ける」といった細かい考え方まで説明するようにしています。

■ UIデザイナーの職域はどこまで？「責任範囲」のリアル

井上: （配信コメントにて）「UIデザイナーの責任範囲を聞きたい」という質問がありました。画面設計書やワイヤーに装飾を加えるだけでいいのか、アプリならエラー・入力値変化・エンプティステイトなど状態分岐まで設計すべきなのか。さらにユーザビリティや開発連携、軽いディレクション／PM的動きまで含むのか。正直、会社や人によって職域はかなり違います。これは定義しきれなくて、「現場による」としか言えないですね。

堀田: 最近の現場でいうと、UIデザイナーは「触れる状態に落とし込む」ことが仕事だと感じています。画面の見た目だけでなく、操作性や動線まで設計する。実装後のテスト（QA）も、デザイナーがQAシートを作ることが増えてきました。

「この機能はこう動く想定」「こうなったら不正」という振る舞いの洗い出しですね。会社によっては専任QAがいますが、私は“作ったものが意図どおりに動くか”の確認まではデザイナーが担うのが良いと思っています。

井上: なるほど。責任感があるすごく良いUIデザイナーだと思います。UIデザイナーの職域は本当にバラバラで、エンジニア寄りもあればPM寄り、UX寄り、マーケ寄りまである。そのうえで、それをポートフォリオでどこまで伝えられているかというと、多くの人が十分に伝えきれていない。見た目や設計思想は書けても、実際の現場でどう動いていたかのほうが魅力的に感じますね。

堀田: 実装時に「この表示はどうなる？」「ここを押したらどう動く？」といった質問が全部デザイナーに来ること、よくありますよね。本来はディレクターに聞くべきだとしても、現場ではデザイナーに聞かれがち。

そこで「範囲外だから知りません」で終わるのか、自分から確認してエンジニアに伝えるのか。そのコミュニケーションの動きができるかはすごく大事です。でもこれはポートフォリオに載せづらい。でも一緒に働く中で知っておきたい大切な情報です。

井上: デザインとUI、そしてアウトプットに至る経緯を書くのは“できて当たり前”なので、そのうえで採用側はプラスアルファの情報を求めています。生データを見るのも、仕様理解や開発連携、運用フェーズの想定までわかるから。そこまでポートフォリオに書いてあれば、もっと読み込みます。

堀田: デザインの言語化ですね。少人数の実務だと、考えてはいるけど言葉にできず、作業だけ先に進めてしまうことがあります。だからこそ、自分で言語化の練習をすることが大事だと思います。

井上: 本当にそうですね。私の印象に残りやすいポートフォリオは、プロジェクト概要がしっかり書いてあるもの。クライアントは伏せながらも「◯◯系のDXプロジェクト」「メンバー構成」「体制図」「自分の役割」「半年の中で前半はこう動き、後半はこう動いた」といった簡単なストーリーマップが載っていました。プロジェクト概要＋アウトプット＋データの作り方があれば、僕は判断しやすいです。

■ テンプレに寄りすぎない、“伝わる”ポートフォリオとは

井上：個人的にポートフォリオは定型に寄せすぎず、今の時代に合わせて考え直していくのがいいと思う。だから、ちょっと型破りなポートフォリオを見ると、ワクワクするんだよね。

堀田：例えばどんなものですか？

井上：前にみた印象的なものだと、職歴より先に自分の両親の写真をドンと載せて、真ん中に自分の写真。その下にキャリアを書いてましたね。グラフィック寄りの表現だったけどインパクトがあって、「読んでみたいな」と思いました。

堀田：それは確かに目が止まりますね。

井上：もちろん、目的から外れないことは大事。写真をたくさん貼ればいいわけじゃなくて、あくまで“フック”ですね。でも、同じ情報でも見せ方に特徴があると良いと思います。

堀田：（配信のコメントから）「UXデザイナーに応募しているのに、読み手のUXを考慮していないポートフォリオはがっかり」という意見、すごくわかります。

井上：最近はNotionにまとめてそのままポートフォリオとして出す方も多いですが、提出や更新は楽なんですけど、そのまま出すのはもったいないですよね。

もしテンプレを出すなら、見た目より“書き方”に寄ったものがいい。「現場」「体制」「自分の役割」「求められたこと」「出したアウトプット」、こういうストーリーをそのまま記述できるテンプレートは本当に便利だと思う。

堀田：自分の振り返りにもなるし、読み手が欲しい情報をサッと埋められるとすごく助かりますね。

井上：生データは、もらえるなら見たいけど、プロジェクト背景の記述だけでも十分。
“どう成長して、今はどう作れる人なのか”が見えると、信頼感が生まれるし、僕は話してみたいと思う。

 さて、まとめると――書けることは全部書こう。
・プロジェクトの背景
・自分のポジション
・チームの状況（言い方には配慮しつつ）
・求められたこと
・アウトプット（同等のデータや成果物など）
　※ただし実際の案件データはNG、あくまでサンプルデータ
これがあるだけで、入社後の動きが想像しやすくなるのでオススメです！

ーーー

堀田さん、配信にご参加いただきありがとうございました！

実際の配信はこちらから。
https://x.com/katsuki_inoue/status/1983758983224848688

［各種情報］
堀田さんが執行役員を務めるCRUTECH：https://www.crutech.co.jp/
井上が代表を務めるバイネーム：https://byname.in/

株式会社バイネームでは一緒に働く仲間を募集しています。
少しでも興味のある方は、ぜひWantedlyをチェックしてください！
・UI/UXデザイナー