現在「依頼者作業・確認待ち」、進捗 80%。
https://izanami.dev/post/33bc0c0f-4210-4f5e-90e5-4ee8efe9ac66
Figmaのアカウントをお借りして検証した内容を、以下のページにまとめました。 「Claude Code to Figma」を使い、FigmaとClaude Codeを連携してコーディングさせた検証です。
レポート: https://plus-creative.xyz/nakata/2026/0302/figma-ai-guide/ Basic認証:plustest/plussp
対象デザイン: 一人親方(SP版)
コーディングページ: https://plus-creative.xyz/nakata/2026/0302/hitorioyakata_sp/
レポート本文はAIに作成させたため、やや難しく感じるかもしれません。 内容は主に、AIに意図を正確に伝えるためのFigma側のデザイン構造化についてです。
ClaudeCodeにFigmaのプラグインを作ってと依頼すると簡単にプラグインの作成ができます。 以下の記事の通りに行えば可能です。 https://izanami.dev/post/33bc0c0f-4210-4f5e-90e5-4ee8efe9ac66 こちらの記事のURLをAI(Claude)に渡して、プラグインを作ってと言っただけです。
この記事の内容では、 作成してあるテンプレートバナーに CSVにまとめた見出しや文章を流し入れ10パターン作成するというものでした。 https://gyazo.com/fe9a6b2b16ee6e61ba79e169142e2781
ClaudeCodeにHTMLをFigmaに反映させるプラグインを作らせたので実験してみました。 (1)HTMLで作ったデザインをFigmaに流し込むプラグインのテスト。 (2)今回の記事で作成したプラグインで、(1)へ見出しと文章を反映。 https://gyazo.com/2df40c45c963dfdcc4d0dc9a66a02196
# 見出し h1 ## 見出し h2 ### 見出し h3 #### 見出し h4 ##### 見出し h5 **太字** 水平線 --- > 引用テキスト > 引用テキスト ``` コードの表示(ブロック) コードの表示(ブロック) コードの表示(ブロック) ``` * リスト * リスト * リスト 0. 番号リスト 0. 番号リスト
Figmaのアカウントをお借りして検証した内容を、以下のページにまとめました。
「Claude Code to Figma」を使い、FigmaとClaude Codeを連携してコーディングさせた検証です。
レポート:
https://plus-creative.xyz/nakata/2026/0302/figma-ai-guide/
Basic認証:plustest/plussp
対象デザイン:
一人親方(SP版)
コーディングページ:
https://plus-creative.xyz/nakata/2026/0302/hitorioyakata_sp/
レポート本文はAIに作成させたため、やや難しく感じるかもしれません。
内容は主に、AIに意図を正確に伝えるためのFigma側のデザイン構造化についてです。
Claude Code で、広告バナー200本を15分で作るえぐい手順
https://izanami.dev/post/33bc0c0f-4210-4f5e-90e5-4ee8efe9ac66
ClaudeCodeにFigmaのプラグインを作ってと依頼すると簡単にプラグインの作成ができます。
以下の記事の通りに行えば可能です。
https://izanami.dev/post/33bc0c0f-4210-4f5e-90e5-4ee8efe9ac66
こちらの記事のURLをAI(Claude)に渡して、プラグインを作ってと言っただけです。
この記事の内容では、
作成してあるテンプレートバナーに
CSVにまとめた見出しや文章を流し入れ10パターン作成するというものでした。
https://gyazo.com/fe9a6b2b16ee6e61ba79e169142e2781
ClaudeCodeにHTMLをFigmaに反映させるプラグインを作らせたので実験してみました。
(1)HTMLで作ったデザインをFigmaに流し込むプラグインのテスト。
(2)今回の記事で作成したプラグインで、(1)へ見出しと文章を反映。
https://gyazo.com/2df40c45c963dfdcc4d0dc9a66a02196