UIデザイナーのポートフォリオ作成ガイド：転職・就職に勝てる作品集の作り方
UIデザイナーのポートフォリオ作成方法を解説。ケーススタディの書き方・プロセスの見せ方・Figmaを使ったポートフォリオサイト・Behance・Notionでの公開方法まで、採用担当者に刺さるUIデザイナーのポートフォリオ作成の実践的なガイドを紹介します。
UIデザイナーとしての転職・就職活動において、ポートフォリオは最も重要な評価材料です。単にUIのスクリーンショットを並べるだけでなく、「デザインプロセス・問題解決能力・コミュニケーション力」を伝えることが採用担当者の心を動かします。本記事では、刺さるUIデザイナーのポートフォリオ作成方法を解説します。
ポートフォリオで採用担当者が見るもの
スキルではなく「思考プロセス」：
最終的なUIデザインだけでなく、「なぜこのデザインにしたのか」「どんな問題を解いたのか」「どのようなプロセスを経たのか」が重要です。
問題解決能力：
「かっこいいUIを作れる」より「ユーザー課題とビジネス課題を理解した上でUIに落とし込める」能力が評価されます。
コミュニケーション能力：
ポートフォリオ自体が、デザインを言語化・説明する能力の証明です。
ケーススタディの書き方
ケーススタディの構成（推奨フォーマット）：
- 概要（Overview）：
プロジェクトの概要・自分の役割・期間・使ったツールを1段落で説明します。
- 課題（Problem）：
「どんなユーザー課題・ビジネス課題があったか」を明確に説明します。
「〇〇というユーザー（ペルソナ）は、△△という状況で□□という問題を抱えていた」という形式が理想的です。
- リサーチ・発見（Research & Insights）：
どんなリサーチを行い、どんな発見があったかを示します。インタビュー・ユーザビリティテスト・競合分析などのアクティビティと、そこから得られた重要なインサイトを記載します。
- デザインプロセス（Design Process）：
スケッチ・ワイヤーフレーム・プロトタイプ・ユーザーテスト・反復という過程を示します。「最初のアイデア→フィードバックを経た改善→最終デザイン」という変化が見えると評価が高まります。
- 最終デザイン（Final Design）：
完成したUIをスクリーンショット・プロトタイプで見せます。
- 成果（Results）：
可能な場合は数値的な成果（コンバージョン率○%向上・エラー率○%減少など）を示します。
ポートフォリオの掲載作品の選び方
数より質：
3〜5件の充実したケーススタディの方が、10件の薄いスクリーンショット集より評価されます。
多様性を見せる：
UIデザイン・UXリサーチ・デザインシステム・モバイル・Web、など異なる種類の仕事を含めると幅の広さを示せます。
チームプロジェクトの場合：
「このプロジェクトにおける自分の具体的な貢献」を明記します。
ポートフォリオのプラットフォーム
Webサイト（推奨）：
自分でコーディングまたはWebflow・Framer等のノーコードツールで作成するポートフォリオサイト。最もプロフェッショナルな印象です。
Notion：
セットアップが簡単で、ケーススタディをリッチに表現できます。転職活動の初期段階に適しています。
Behance：
ビジュアル重視のプラットフォーム。広くデザイナーに閲覧されます。
Figma（Community）：
Figmaファイルを直接公開。デザインの細部まで確認できるメリットがあります。
まとめ
UIデザイナーのポートフォリオは「スクリーンショット集ではなく、問題解決の物語」です。ケーススタディ形式でデザインプロセス・課題・解決策・成果を丁寧に説明することで、採用担当者に「この人と一緒に働きたい」と思わせるポートフォリオが完成します。