生成AI × Figma MCP
生成AI × Figma MCP
「Figma Design - マスター編」のAIに関係するパートを単体商品化。
エンジニア以外でもブラウザからクラウドの仮想環境を使って、AIコーディングを試せるようGitHub Codespaceの立ち上げ方〜使い方の解説も新たに追加しました。
LLMとMCP/AIエージェントの話からFigmaファイル編集時の注意点、基本的なコード生成までをまとめた「生成AIとFigma MCP」、Figmaファイル生成におけるポイントを取りあげた「AIにも優しいFigmaファイル」の動画20本に加え、新たにサンプルファイルを使ってコード生成までチャレンジする「Copilot/Geminiを使った実践」を追加しました(2025年12月3日)。
Figma MCPと生成AIを使ってFigmaファイルを試そうにも、エディタをはじめ開発環境の用意が必要になってしまいます。そこで、GitHubのクラウド仮想環境である「Codespaces」を立ち上げて、エンジニア職以外の方もブラウザから仮想環境を使ってAIコーディングを試せるような解説を新たに10本の動画として追加しました(2025年12月7日)
---
※本商品は「Figma Design - マスター編」に含まれています。重複購入にご注意ください
※こちらはFigma内の解説やファイル操作だけではなく、テキストエディタ(VSCode)での操作や設定方法、実行操作も多く含まれます。
※本商品の購入後、販売中の「Figma Design - マスター編」「Figma Design - パック」のいずれかを後日あらためて購入される際には、チェックアウト時にクーポンコード「V9SVZ972YJB8」をご利用いただくことで現在の販売価格分の値引きが適用されます。
動画本数: 40本
総時間: 3時間40分
(2025年12月7日現在)
---
公式LINEアカウントの新規友だち登録で10%割引のクーポンコード発行中。
購入前の事前登録がお得です。
https://lin.ee/EOgmkKQ
実際にFigma MCPを使ってコーディングしている様子はノーカットでYouTubeに掲載済
FigmaファイルをAIコーディング(HTML + CSS)
FigmaファイルをAIコーディング(React + Tailwind)
---