こんにちは、グッドパッチでUIデザイン組織のマネージャーをしている蔡(さい)です。

普段はプロジェクトでUIデザインも行いながら、採用や評価制度など、デザイナー視点での組織づくりにも携わっています。2023年から新卒採用に関わっており、説明会や面接を通して、デザイナーを目指す学生の方たちと日々接しています。

私は留学を機に来日し、UIデザインに触れたのはGoodpatchのサマーインターンがきっかけ。その後、長期インターンでより深くUIデザインを学び、2016年に新卒のUIデザイナーとしてGoodpatchにジョインしています(詳しくはこちらのインタビューをどうぞ)。

現在のデザイナー就活においては、学生はポートフォリオを制作し、企業は書類選考時に提出を求める、というスタイルが一般的になっています。皆さんの中にも、学校で先輩のポートフォリオを見せてもらった、という方も多いかもしれません。一方で、ポートフォリオを「見る側」の企業が、どんな観点で見ているのかを知る機会は少ないようです。

そこで、今回はポートフォリオ制作連載の第3弾として、面接官という立場から、どのデザインのポートフォリオにも共通する基本的な観点を中心に、面接での活用方法、そして、UI作品ならではのポイントを解説したいと思います。

企業によって見ているポイントはさまざまという前提で、私が普段どんな観点でポートフォリオを見ているかをお伝えすることで、デザイナーを目指す方々に、企業の中の人たちの頭の中を知ってもらい、ポートフォリオ制作に取り組むきっかけになればうれしいです。

「文字」「色」「レイアウト」の基本は押さえよう

そもそも、デザイナーとは何をする人でしょうか?

私は、「複雑で抽象的なことを、できるだけシンプルに見える形にして他の人に伝える職種」だと考えています。これはUIデザインに限らず、どの領域のデザイナーにも言えることです。

そのためデザイナーを目指すのであれば、ポートフォリオでも、複雑なものをシンプルにして伝えるための、最低限のビジュアルコミュニケーションを求めます。

具体的には、文字・色・レイアウトの3つです。ポートフォリオをざっと眺める際にも、この3つの要素を見ています。

文字のサイズ、行間、フォントの選択が適切か。色の数、意味、コントラスト比を考慮して使われているか。レイアウトは、情報のグルーピングや読む順番を考えて配置しているのか──これらはどんなデザインをする上でも必要な、デザインの基礎的要素のため、とても大事にしているポイントです。

皆さんが小説や雑誌を読むときを思い出してみてください。「なんか読みづらいな」と感じて、なかなか内容が入ってこないものと、集中して読み続けられるものがあるでしょう。ポートフォリオでもそれは同じ。「読める」「読みたくなる」というポイントは第一ステップです。

蔡 漢翔|UIデザイナー・デザインリード
台湾出身、大学では工業デザインを専攻。台湾の電子機器メーカーにて工業デザイナーとして従事したのち来日し、慶應義塾大学大学院メディアデザイン研究科に進学。 2016年にUIデザイナーとしてグッドパッチに入社。UIデザイナーとしてヘルスケア、SNS、人事、マーケティング、金融など幅広い業界のサービス立ち上げや改善に携わる。2021年よりUIデザイン組織のマネージャーを担う。

アウトプットに至る「プロセス」が重要

ポートフォリオの中身については、UI、プロダクト、サービスなど、作品の種類によって異なる見せ方がありますが、最終的なアウトプットだけではなく、プロセスも含めて見ています。

プロセスがあるというのは、「そのアウトプットに至るために考えたことが、読み手に伝わるように説明されている」ということです。

課題を何と定義したのか、なぜそれが課題だと思ったのか。解決策は何か、それは課題とどう紐づくのか。そしてその解決策を作品にどう落とし込んだのか……こういった思考の流れを見ています。

この時注意したいのは、自分の考えをただ羅列するだけでは伝わらないということ。あれもこれも考えたからと詰め込むと、まるで論文のようなポートフォリオになってしまいかねません。

最初に書いたことにつながりますが、膨大で複雑な情報をシンプルに分かりやすく伝えるのが、デザイナーの腕の見せどころです。

とはいえシンプルを目指しすぎて、本来伝えるべきことまで削ぎ落としてしまっては元も子もありません。内容がなく薄っぺらくなっては意味がなくなりますし、読み手の記憶にも残りづらくなってしまいます。中身のある内容をシンプルに伝える。このバランスが大事です。

そのため、ポートフォリオ作りでは、ビジュアルだけでなく文章力と伝える順番も大切になってきます。

新聞やニュースの記事を思い出してみましょう。まず見出しで引きつけ、サマリーで要点を伝え、詳細を伝える、という流れになっています。これと同じで、作品を伝える際にも見出しは何か?要点は?を考え、そこから詳細な説明、そしてアウトプットにつなげると伝わりやすくなります。

自社の例ではありますが、GoodpatchのIR資料は、複雑で難しい情報を視覚的に表現する一例だなと感じています。この資料も「見出し」「サマリー」「詳細」、という構成で情報をデザインしています。

企業は「あなたの強み」を見つけたい──自分の強みを生かした表現を

デザインに完璧がないように、デザイナーにも得意不得意があります。学生の方と話していても、表現力のある方、情報の整理が得意な方、コンセプトづくりや発想がうまい方など、さまざまなタイプの学生の方がいます。

そのため、ポートフォリオを見るときには「この人は何が得意で、強みなんだろう?」ということを考えながら見ています。ポートフォリオではぜひ、自分がどんなタイプかを認識し、自分の「強み」として伝えることを意識してみてください。

強みが分からないという場合は、周りの大人、特に大学の先生に聞いてみるのもおすすめです。さまざまな学生を見てきた上での「強み」と言えるものは何か、客観的な視点をもらうことができます。

もっと手近な見つけ方は、「これをやっていると自分はすごく楽しいな」と思えるかどうかです。必要だからではなく、趣味のようにずっとやれる、主観的な楽しさもヒントになります。

例えば、私の場合は情報整理が得意。膨大でまとまっていない情報を整理し、使える情報に変えていくのが好きで、昔からやっていました(いろんな種類のクレジットカードを比較できるように見やすく整理する……なんていう地道な作業も好きだったりします)。

また、インタラクションデザインに関することも大好きで、常に情報収集していました。iPhoneのホームボタンが廃止され、ジェスチャー操作に変えたときのインタラクションのスムーズさには衝撃を受けましたし、最近の「Apple Vision Pro」の指先での操作を想定したインタラクションにも感動しています。自分が気づけば追いかけてしまうテーマや、大好きでいくらでも考えられることの中に、強みが隠れていると思います。

客観的に見た強みと、主観的な楽しさ、両方とも兼ね備えたものであれば、強固な強みと言うことができそうです。

具体的な強みの見せ方はさまざまですから、自分の得意を存分に発揮して考えてみましょう。表現力が強いのであれば、高いクオリティの作品を大きく強調する。情報設計が得意であれば、表やチャートを活用して伝える。コンセプトや発想が得意ならば、アイデアを面白く見せるなど、自分の強みによって違う見せ方を意識してみると良いです。

応用編:「やらなかったこと」で語ることもできる

ここまで話してきたことと一見矛盾するようですが、個人的には「何を作ったか」だけではなく「何をやらなかったか」「何を捨てたか」というのも大事だと考えています。

デザインはたくさんの試行錯誤があって、最終的にたどり着くまでの営み全体を指すもの。日々の仕事でもプロトタイプは大切で、作っては壊しながら進めています。

最終的に採用したものだけではなく、アイデア段階の手書きのスケッチや、採用しなかったボツ案、失敗したアイデアなども実は見てみたいポイントです。

ポートフォリオを「過去に作った最高の作品集」と考えてしまうと、ボツ案は見せたくない、失敗したアイディアや、綺麗になっていないラフスケッチは載せたくない……と感じてしまうかもしれません。

その気持ちも分かりますが、見せてもらうことで、面接で「それってなぜそうしなかったの?」と、思考のプロセスを一緒にたどっていくことができます。そんな考え方ができるんだ、面白い軸で判断したな、など、新しい観点で作品を見ることにもつながります。あなたが「選ばなかったもの」にも、思考の跡がにじみ出ているのです。

UIデザインのポートフォリオで重視するポイント

私自身がUIデザイナーということもあり、学生の皆さんから「UIデザイナーを希望しているなら、ポートフォリオにはUI作品だけを載せた方がいいのでしょうか」という質問をもらうこともあります。そのとき私は、ぜひUI以外の作品も載せてほしいと伝えています。

グッドパッチでは、UI以外の領域のデザインをすることもありますし、「自分はこういうこともできるよ」ということを、見せて欲しいなと思っています。個人的に「この人はこういうこともできるんだ」と可能性を発見するようなスタンスでポートフォリオを見たり、面接をすることを大切にしています。

その上で、UI作品をポートフォリオに乗せる場合、押さえてほしいポイントはいくつかあります。

誰の、何の課題を解決するのか

そもそもUIデザインというのは、「誰かの課題を解決するため」になされています。そのため「誰の、なんの課題のために作られたものなのか」という前提が重要です。

課題をどこまで深掘りして理解しているか。その理解の上でどんな解決策を考えたのか。その解決策によって何が解決するのか。この前提条件の説明はよく見ています。

デザインをした自分自身はよく分かっていて当たり前のことでも、読み手にとっては初めての情報ばかり。前提は飛ばさずに伝えましょう。

デザインへのフィードバックがあるか

作ったUIに対し、想定しているユーザーや身の回りの人からフィードバックをもらったかという点も重視しています。

そのフィードバックを基に改善した「Before」「After」のデザイン比較があればなお良いですが、デザインを修正して反映できていなかったとしても、こういうフィードバックを受けてこう考えた、というブラッシュアップの方向性に関するアイデアがあれば、それだけでも価値があります。

動くプロトタイプがあるとうれしい

ポスターやチラシと違い、UIは動くものです。実際のサービスの中で、ユーザーはUIの何らかの要素を操作し、システムからフィードバックをもらい、また次の操作をするという一連の流れを何度も繰り返します。

そこで、ユーザーが違和感なく操作できるUIであるかどうかを見るために、FigmaやプロトタイプのURLが掲載してあれば、必ず見るようにしています。何かしらの形で、ユーザーが実際に操作した時の一連の流れが分かるようなプロトタイプがあるとうれしいです。

優れたUIは、まるで昔から使い方を知っていたかのように一瞬で理解して使えるものですが、そのシンプルさの裏側には、製作者の考え抜かれた意図が必ず存在しています。操作しやすいだけではなく、楽しく操作できるためのちょっとしたギミックなど、情緒的な価値も掛け合わせることで、より魅力的なUIが作れます。

UIのクオリティを判断するには、静止画だけではなく、動くプロトタイプを実際に触ってみるのが一番分かりやすいのです。

応用編:UIデザイン作品がない場合

UIデザインに興味はあるものの、大学の学科にない。授業で選択できないからUIデザインを学べない。UIデザイナーに応募したいが、UIの作品がない。といった相談を受けることもあります。

そんな方には、UIデザインに興味を持っているのであれば、「身の回りの使いづらいと感じているサービスを題材にして、リデザインしてみる」ことをお勧めしています。

また、自分の実体験から生まれた「こういうサービスがあったらいいのに」というサービスを一からデザインしてみるのもいいでしょう。

ただし一つ注意があります。学生の場合、テーマが似たり寄ったりになりやすく、「新しいSNSサービス」や「就活を頑張るためのサービス」といったテーマは、すでに多くの学生が取り扱っていて、面接官にとって見慣れたものとなりがちです。

あえて自分の趣味の内容をテーマにし、自分自身がユーザーだからこそ深掘りした課題を基にしたデザインを1つ作ってみる、というのも面白いでしょう。

ポートフォリオの説明も「結論ファースト」が大切

最後に少しだけ、面接の話もさせてください。面接では、ポートフォリオの解説をしてもらうことが多いです。

よくあるのは、作品を1つずつ紹介してもらう形ですが、前置きがあまりにも長すぎると、結局、何の話だったのか分からなくなってしまうことも。自分の作品を面接で解説することを想定した準備はしておくべきです。

まず「結論、何を作ったのか」を短く導入で説明したのち、それを作るためのプロセスをポートフォリオを使って話す練習をしておきましょう。

単にスライドを読み上げるよりも、作品の導入があることで、相手の面接官が興味を持ちやすくなります。相手が興味を持っていれば話すハードルも下がりますし、解説後に質問を引き出しやすくなります。結論を伝えてからプロセスを伝える、というのはどんな場面でも活用できるプレゼン方法です。

UIデザイナーを目指す学生の皆さんへ

ここまで私が面接官として見ているポートフォリオのポイントを書いてきました。そもそもポートフォリオを通して何を知りたいと思っているのか、企業側の人の「頭の中」が少しでも伝わっていたらうれしいです。

ポートフォリオ制作には、情報を分かりやすく整理するレイアウトのスキル、なぜそのデザインになったのかを伝える論理的な説明力、そして自分の作ったものを魅力的に伝える言葉の力など、どの領域のデザイナーとして仕事をする上でも大切なポイントが詰まっています。

これから就活を始める方の中には、ポートフォリオの何を見られるのかわからず、不安に感じる方もいるかもしれません。

ポートフォリオ制作の目的を「就活で選考に通ること」だけに置くのではなく、自分の強みや本当に好きなことを見つける機会として捉えてみてはどうでしょうか。この連載では、キャリアデザイナーや新卒UIデザイナーの視点からも「ポートフォリオの作り方」に迫っています。そちらの記事もぜひご覧ください。