JAGDA入会審査ポートフォリオをClaude CodeとFigmaで作った
日本グラフィックデザイナー協会（JAGDA）の入会審査に向けて、10作品のA4ポートフォリオをClaude CodeとFigmaで制作した過程の記録。
JAGDAに入りたい
JAGDA（日本グラフィックデザイナー協会）の正会員になるには、入会面談でポートフォリオを提出する必要があります。A4サイズの印刷物で、自分の代表作を並べて「この人はグラフィックデザイナーとして十分な実力がある」と審査員に伝えるためのもの。
約30年のキャリアで制作してきたものの中から、10作品を選んでA4に落とし込む。シンプルに聞こえますが、「何を選ぶか」「どう並べるか」「何を伝えるか」のすべてが問われる、ポートフォリオ制作そのものがデザインの仕事でした。
10作品の選定
まず21件の制作物を棚卸しして一覧化するところから始めました（この棚卸し作業自体も別の記事に書いています）。
選定の基準は3つ。
- グラフィックデザインとしての強度 — JAGDAはグラフィックデザイナーの協会なので、UI/UXよりもポスターや印刷物の比重を高く
- 領域の幅 — ポスター、リーフレット、ブランドデザイン、空間、UIまで。一人のデザイナーが手がけた多様性を示す
- 並び順のストーリー — グラフィックからプロダクト、空間、ブランド、UI/UXへとグラデーションを描く構成
最終的に選んだ10作品は、コンセプトビジュアライゼーションから始まり、ポスター群、プロダクト、空間実装、ブランドデザインを経て、UIデザインで締める流れにしました。
除外したものと理由
選ばなかった作品にも理由があります。
- あるサービスのLP → 同じクライアントのポスターの方がインパクトが強いため差し替え
- 金融系のUI → 他のUI作品と役割が被る
- ブランドガイドライン → 自分のデザインではなく策定作業のみ
- エネルギー企業のプレゼン資料 → 別のPPTテンプレートと被る
「入れたいけど入れない」判断の連続でした。10枠しかない中で、1つ入れると1つ外れる。ポートフォリオの編集は、雑誌の誌面構成に近い感覚です。
Claude Code + Figma で制作
ポートフォリオの実制作は、Claude Code と Figma MCP を組み合わせて進めました。
HTML版（印刷用）
職務経歴書とポートフォリオをHTMLで作成し、ブラウザからPDF印刷する方式です。A4サイズ（595 × 842px）のフレームに、画像と最小限のテキストを配置。Claude Code にデザインの意図を伝えながら、レイアウトを調整していきました。
Figma版
同時にFigmaでも同じ構成のポートフォリオを作成しました。Figma MCP を使って、スクリーンショットの取得・画像のアップロード・フレームへの配置を半自動化。
ただし、Figma の Starter プランではレート制限があり、連続でスクリーンショットを取得するとエラーになることもありました。急ぎすぎず、間を置きながら作業を進める必要がありました。
画像の結合
1つのページに複数の制作物を並べたい場合、Pillow（Pythonの画像処理ライブラリ）で画像を横並びに結合してからFigmaにアップロードしました。これも Claude Code が自動でスクリプトを書いてくれたので、自分で画像編集ソフトを使う必要はありませんでした。
AI時代のポートフォリオ
JAGDAへの入会を志望する理由の1つに、「AI時代にデザインが安易に量産される中で、本質を追求するデザイナーであることの証明」があります。
皮肉なことに、そのポートフォリオ自体をAIの力を借りて作っています。でも、矛盾はしていないと思っています。
AIが担ったのは、スクリーンショットの取得、画像の結合、HTMLのコーディングといった実作業の部分。「何を選ぶか」「どう並べるか」「何を伝えるか」という設計の判断は、すべて自分の中にあるものでした。
道具が変わっても、デザインの本質は変わらない。そのことを、このポートフォリオ制作を通じて改めて確認できた気がします。
