Figma Images to Excel

About this plugin

選択した画面を一括でExcelファイルに自動貼り付けするプラグインです！

✨ 主な特長

1. 複数の画面を一括でPNG画像に変換
2. Excelファイルに自動で貼り付けてダウンロード
3. 手間なく資料やレビューシートを作成可能

📄 プラグインの概要

ノンデザイナーとの協業で「Figmaの画面を社内展開用にExcelに貼ってほしい」と頼まれること、ありませんか？

このプラグインを使えば、選んだフレームやコンポーネントを一括で書き出し、Excelファイルに自動で貼り付けた状態でダウンロードできます。面倒な手作業が一瞬で終わります。

⚠️ レイアウトは完璧じゃないです

FigmaとExcelで座標の仕様が異なるため、極力再現できる様にしていますが完璧なレイアウトは期待しないでください。。セルのサイズをもとに計算し再現しています。

✅ 仕組み

1. 画像データは外部に送信されません
2. データは一切保存されません（localStorage等も未使用）
3. 通信はExcelJSライブラリの読み込みのみです(ライブラリはローカルで動作し、Excelファイルもローカルで生成されます)

1. Figma Plugin APIによるデータ取得。プラグインはFigmaのPlugin APIを利用し、ユーザーが選択したフレームやセクションの情報を取得します。画像データ（PNG）は、FigmaのAPI（例：getBytesAsync()）を通じて取得されます。
2. バックエンド（code.js）とフロントエンド（ui.html）の連携。バックエンド（code.js）で取得した画像データやフレーム名・セクション名などの情報は、postMessageを使ってフロントエンド（ui.html）に送信されます。この通信はFigmaプラグインのサンドボックス内で行われます。
3. Excelファイルの生成。フロントエンド（ui.html）では、CDN経由でExcelJSライブラリを読み込みます。受け取った画像データやテキスト情報をもとに、ExcelJSで新規ワークブックとワークシートを作成します。画像はExcelワークシート上の指定セル範囲に貼り付けられ、フレーム名やセクション名もセルに記載されます。
4. ファイルのダウンロード。完成したExcelファイルは、ExcelJSのwriteBuffer()メソッドでバイナリデータ化され、Blobとして生成されます。生成されたファイルは、aタグのdownload属性を使ってユーザーのローカル環境にダウンロードされます。
5. 一時データの扱い。画像データやExcelワークブックなどの中間データは、処理中のみメモリ上に保持されます。ダウンロード後はこれらのデータはメモリから解放されます。
6. 外部ライブラリの利用。Excelファイル生成にはExcelJS（CDN: unpkg.com）を利用しています。その他、外部APIやストレージは利用していません。

📌 ご利用にあたって

本プラグインは、個人の業務改善の一環として開発・公開しているものであり、Figma社およびMicrosoft社とは一切関係がありません。

ご利用は、あくまでご自身のご判断のもとでお願いいたします。

万が一、不具合や問題が発生した場合につきましても、開発者は責任を負いかねますこと、あらかじめご了承ください。