このプロジェクトについて

TalkToFigmaは、AIエージェント(Cursor、Claude Code、Codex)とFigmaの間にModel Context Protocol(MCP)ブリッジを実装します。WebSocketサーバーと付属のFigmaプラグインを通じて、エージェントはドキュメントや選択範囲を検査し、ノードの作成と編集、テキスト、オートレイアウト、スタイル、コンポーネント、アノテーションの管理、ノードの画像としてのエクスポートができます。 アーキテクチャ - src/talk_to_figma_mcp: Figma操作をツールとして公開するTypeScript MCPサーバー。 - src/cursor_mcp_plugin: エージェント側と通信するFigmaプラグイン。 - src/socket.ts: MCPサーバーとプラグイン間でメッセージを中継するWebSocketサーバー。 セットアップ Bunをインストールし、`bun setup`を実行(アクティブなCursorプロジェクトにMCPサーバーも登録されます)、`bun socket`でソケットを起動し、コミュニティページからFigmaプラグインをインストールするか、manifest.json経由でローカルにリンクします。手動のMCP設定では、~/.cursor/mcp.jsonで`bunx cursor-talk-to-figma-mcp@latest`を使用します。Windows + WSLガイドでは、socket.tsのホスト名0.0.0.0のコメント解除について記載されています。 使用フロー WebSocketサーバーを起動し、MCPサーバーをインストールし、Figmaを開いてプラグインを実行し、`join_channel`でチャンネルに参加してから、エージェントからコマンドを発行します。ベストプラクティスには、最初にチャンネルに参加すること、編集前にドキュメント情報と選択範囲を読み取ること、get_node_infoで検証すること、大規模なデザインにはバッチ操作を使用することが含まれます。 ツールの範囲 - ドキュメントと選択範囲: get_document_info、get_selection、read_my_design、get_node_info、get_nodes_info、set_focus、set_selections。 - アノテーション: get_annotations、set_annotation、set_multiple_annotations、scan_nodes_by_types。 - プロトタイピング: get_reactions、set_default_connector、create_connections(FigJamコネクタ線用)。 - 作成: create_rectangle、create_frame、create_section、create_text。 - テキスト: scan_text_nodes、set_text_content、set_multiple_text_contents。 - オートレイアウト: set_layout_mode、set_padding、set_axis_align、set_layout_sizing、set_item_spacing。 - スタイリング: set_fill_color、set_stroke_color、set_corner_radius、set_image_fill。 - 整理: move_node、resize_node、delete_node、delete_multiple_nodes、clone_node、rename_node、set_parent。 - コンポーネントとスタイル: get_styles、get_local_components、create_component_instance、get_instance_overrides、set_instance_overrides。 - エクスポート: export_node_as_image(PNG、JPG、SVG、PDF。画像エクスポートは現在base64テキストを返します)。 - 接続: join_channel。 プロンプト ヘルパープロンプトが複雑なタスクを導きます: design_strategy、read_design_strategy、text_replacement_strategy、annotation_conversion_strategy、swap_overrides_instances、reaction_to_connector_strategy。 特筆すべき提供機能には、一括テキスト置換とインスタンスオーバーライドの伝播が含まれます。MITライセンスの下で提供されています。