画像生成からコードまでAIで完結させたら｜Figma MCP経由のLP制作で見えた限界
「画像生成 → Figmaでデザイン → MCP経由でコード化」というワークフローを実際に回しました。動くものを見ながら認識合わせできる価値は確かにある一方、出力コードはベタ書きでレスポンシブは全く対応できていません。定型部分はFigmaを経由しない方が早い、という発見もまとめています。
@ai-katsu-editorial·2026/5/19Claude CodeFigma資料作成・デザイン👁 2 · 👍 0AIくさいスライドを卒業する｜画像生成にデザインカンプを作らせる分業設計
PPTX生成エンジン単体ではAIらしいシンプルなデザインに寄る、という課題に対し、画像生成モデルに「視覚的な正解例」を先に作らせる分業を検討しました。最大の関門は画像から編集可能なPPTXへ戻す工程で、4ルートを固定した評価軸で比較する設計にしています。
@ai-katsu-editorial·2026/5/6OpenAI APIFigma資料作成・デザイン👁 5 · 👍 0CodexとClaude Codeの住み分けを決める｜LP制作が3日から1日になった2週間の検証
2026年4月アップデート後のCodex Desktopを2週間使い込み、コーディング・LP制作・デザインモックそれぞれで最適なツールを確定させました。In-appブラウザによるブラウザ内コメント修正でLP制作工数は体感1/5、並列エージェントで朝20分に3〜4タスクが承認待ちへ。長文推論と大規模コードベースはClaude継続という結論です。
@ai-katsu-editorial·2026/4/28OpenAI CodexFigma業務自動化・ワークフロー👁 2 · 👍 0Claude Design Toolでどこまでできるか｜V0の代替として十分、ただし本番投入には手が要る
リリース当日にClaude Design Toolを検証しました。短いプロンプトからヒーローレイアウト5種×カラースキーム5種の25通りを一度に生成。自然言語で慣性スクロールやパララックスを詰めていける対話体験と、コードがベタ書きで出力されるという実用上の課題をまとめています。
@ai-katsu-editorial·2026/4/18ClaudeFigma資料作成・デザイン👁 2 · 👍 0Figma→Webflowインポートで横並びが崩れる｜Auto LayoutとFlexboxの整合性という壁
Figmaで作成したデザインをWebflowへインポートし、コーディングなしでサイト公開するフローを検証しました。プラグイン利用時に横並び要素が縦並びに変換される不具合が発生。FigmaのAuto LayoutとWebflowのFlexbox構造定義の整合性が原因と見られ、手動修正の工数が大きいため保留とした判断をまとめています。
@ai-katsu-editorial·2025/10/2Figma資料作成・デザイン👁 1 · 👍 0Kombaiでデザインをコードに変換する｜v0を上回る再現度と、実プロジェクトで残る手作業
Figmaデザインをコードに変換するKombai（VSCode/Cursor拡張）を検証しました。デザイン再現度はv0を上回った一方、実プロジェクトへの書き出しではNext.jsやTailwindの設定ファイルが不足し手動調整が必須に。「デザインの骨組みを高速生成するツール」として割り切る現時点の使い方をまとめています。
@ai-katsu-editorial·2025/8/2Kombai資料作成・デザイン👁 3 · 👍 0