Figma × AI
¥7,700
商品情報にスキップ
Figma × AI
¥7,700
税込。
送料無料。
Figma × AI（アップデート）
「Figma Design - マスター編」のAIに関係するパートを単体商品化。
※本商品は「Figma Design - マスター編」に含まれています。重複購入にご注意ください
2026年2月26日、大幅にコンテンツ内容を刷新して、AIレディな作業環境の作り方も新たに追加しました。LLMとMCP／AIエージェントの話といったAIコーディングやFIgma MCPの概要から、Figmaファイル編集時の注意点、Figma MCPを使った基本的なコード生成の方法、コンテキストエンジニアリングの解説などを含んだコンテンツに加え、VSCode、Gemini、CaludeへのMCPサーバの追加方法も最新の手法にアップデート。MCPの追加方法だけでなく、Geminiの公式拡張機能コードアシストやClaude Codeの公式拡張機能を使い、VSCodeの画面から操作する方法も追加。
2026年2月に公開されたMCPの新ツール「Code to Canvas（generate_figma_design）」に加えて、2026年3月に追加で公開された「Write to Canvas（use_figma）」、コードからFigmaファイルを生成する双方のツールの解説動画も追加済（2026.03.27）。
---
Figma MCPと生成AIを使ってFigmaファイルを試そうにも、エディタをはじめ開発環境の用意が必要になってしまいます。そこで、GitHubのクラウド仮想環境である「Codespaces」を立ち上げて、エンジニア職以外の方もブラウザから仮想環境を使ってAIコーディングを試せるような解説は【番外編】として同梱しております。
---
※こちらはFigma内の解説やファイル操作だけではなく、テキストエディタ（VSCode）での操作や設定方法、実行操作も多く含まれます。
※本商品の購入後、販売中の「Figma Design - マスター編」「Figma Design - パック」のいずれかを後日あらためて購入される際には、チェックアウト時にクーポンコード「V9SVZ972YJB8」をご利用いただくことで現在の販売価格分の値引きが適用されます。
動画本数: 81本
総時間: 6時間12分
（2026年3月27日現在）
---
公式LINEアカウントの新規友だち登録で10%割引のクーポンコード発行中。
購入前の事前登録がお得です。
https://lin.ee/EOgmkKQ
実際にFigma MCPを使ってコーディングしている様子はノーカットでYouTubeに掲載済
FigmaファイルをAIコーディング（HTML + CSS）
FigmaファイルをAIコーディング（React + Tailwind）
---