Claude Design と Figma Make の出力を並べて読む:UI 生成 AI で「ピクセル」が消えた後に残るもの
同じデザインシステムと PRD を Claude Design と Figma Make に読み込ませて出力を並べたとき、デザイナーの仕事の本質はどこに移るのか。個人開発と UI 設計を 12 年続けてきた立場から、二つの出力傾向を読み解きます。
Claude Designの全体像( — Figma・Canvaと並ぶ選択肢になりうるのか
2026年4月17日に発表されたClaude Designの位置づけを、アプリ開発者の実務視点で整理します。既存デザインツールと何が違うのか、LPを1ショット生成して確かめた実力、誰にとって価値があるのか、FigmaやCanvaと併用する考え方、使い始める前に知っておきたい注意点まで扱います。
Cowork × 複数MCPオーケストレーション:Figma / GitHub / Stripe を連携させる個人開発自動化システムの全設計図
Cowork で Figma・GitHub・Stripe などの複数 MCP を横断するオーケストレーションを設計・実装する方法を徹底解説。個人開発者がゼロから構築できる自動化システムの全設計図を公開します。
Claude × 画像生成AI — アプリ用ビジュアル素材の作成から編集までの
Claudeの画像生成機能でアプリ用のイラスト・背景・UIアイコンを制作する流れをまとめました。素材別のプロンプト例、生成品質を上げるテクニック、Figmaへの取り込みと最適化、SVG化と形式選択、タスク管理アプリを例にした素材一式の実装例、他サービスとの比較まで扱います。
Claude × Figma × Stitch × Canva — アプリアイコンのデザイン比較と最適化ワークフロー
Figma・Stitch・Canvaの3ツールで同じアプリアイコンを実際に制作し、特性・操作性・AI連携を比較しました。ケーススタディに基づく比較表、Claudeを活用したデザインレビューワークフロー、実装時間の分析、プロジェクトに応じた使い分けの基準までを実践的に解説します。
Cowork のコネクタは、読む権限と書く権限を分けてつなぐと迷いません
Cowork のコネクタで Canva・Figma・Slack・Asana・Google Drive・GitHub とつなぐときの基本を、接続の手順、MCP Apps との違い、読む操作と書く操作の線引き、Claude in Chrome との使い分けの順にまとめました。初めて接続する方が、最初の一本を安全に選べるようにしています。
Figma × Claude Code 連携ガイド — MCP でデザインとコードを双方向に橋渡し
Figma の MCP サーバーを Claude Code につなぐ手順を、2026年10月時点の公式案内に合わせて整理しました。リモートとデスクトップの違い、古い sse 形式でツールが空になる原因、席の種類ごとの呼び出し上限、Design to Code と Code to Canvas の使い分けを扱います。