MCPサーバーを利用してAntigravity と Figmaを接続できると聞きました。どうやってセットアップするのですか?
npxコマンドはパッケージをダウンロードしてきて実行するためのコマンドです。パッケージをローカルマシンにインストールせず、
実行後にダウンロードしたパッケージを削除する動作になります。
(ローカルマシンにインストールする場合はnpmコマンドになります。)
Antigravity と FigmaをMCPサーバー機能で接続する手順を紹介します。
npxコマンドが必要になるため、Node.jsをインストールします。
Node.jsのインストール手順はこちらの記事を参照してください。
Figma Desktop アプリをインストールします。
インストール手順はこちらの記事を参照してください。
MCPサーバーを有効化します。
Figmaのデスクトップアプリを起動します。デザインファイルを作成します。
Devモードに切り替えます。
右側の[MCP]パネルの[デスクトップMCPサーバーを有効にする]のボタンをクリックします。
[MCP]パネルの[サーバーステータス]の表示が[有効]になります。
Antigravityを起動します。下図のメインウィンドウが表示されます。
ウィンドウ右上の[Agent]のパネルの[...]ボタンをクリックします。ドロップダウンメニューが表示されますので、[MCP Servers]の
項目をクリックします。
[MCP Store]が表示され、利用できるMCPの一覧が表示されます。
上部の検索ボックスに"Figma"を入力して絞り込みます。
一覧に[Figma Dev Mode MCP]の項目が表示されます。クリックして選択します。
左側に"Figma Dev MOde MCP"の詳細が表示されます。
[Install]ボタンをクリックします。
Error: exec: "npx": executable file not found in %PATH%.
インストール後に次のエラーが出る場合は、Figmaのデスクトップアプリが起動されていません。
Figmaのデスクトップアプリが起動していてMCPサーバーも起動している場合、以下の表示になり、Figma Dev Mode MCPが有効になります。
