MCP — Model Context Protocol — memungkinkan agen AI melakukan panggilan alat runtime ke layanan eksternal. Figma mengirimkan server MCP resmi, dan komunitas telah membangun beberapa lagi. Pitchnya: agen Anda dapat meminta data desain dari Figma secara langsung, sesuai permintaan, di tengah percakapan. Tidak ada langkah ekspor. Selalu langsung.
figmascope mengambil taruhan arsitektur yang berlawanan: ekspor sekali, kirimkan bundle, jangan pernah terhubung lagi. Ini adalah pilihan yang benar-benar berbeda dengan implikasi yang berbeda. Inilah apa yang sebenarnya dibiayai dan diperoleh masing-masing.
Apa itu server MCP Figma
Model Context Protocol adalah standar terbuka Anthropic untuk menghubungkan agen AI ke alat eksternal melalui antarmuka server. Server MCP mengekspos alat bertipe yang dapat dipanggil agen: "get_file," "get_node," "get_styles," dan seterusnya. Ketika agen memerlukan konteks desain, ia memanggil alat, server MCP memanggil API Figma, dan hasilnya kembali sebagai konteks untuk prompt saat ini.
Server MCP resmi Figma mencakup pembacaan file, inspeksi node, pengambilan komponen, dan akses komentar. Server MCP komunitas (ada beberapa di GitHub) memperluas ini dengan skema kustom, transformasi tambahan, atau cakupan yang lebih sempit yang dioptimalkan untuk workflow agen tertentu.
Untuk menggunakan server MCP Figma mana pun, Anda mengkonfigurasinya di klien agen Anda (Claude Desktop, Cursor, Continue, dll.), menyediakan PAT Figma, dan server berjalan sebagai proses lokal. Ketika agen Anda memerlukan konteks Figma, ia memanggil alat. Anda tidak secara eksplisit mengekspor apa pun — agen mengambil apa yang dibutuhkan ketika dibutuhkan.
Model MCP dalam praktik
Workflow Figma berbasis MCP yang umum terlihat seperti ini: Anda membuka Cursor, memulai percakapan, mengatakan "implementasikan layar checkout dari file Figma ini," dan agen memanggil get_file, menarik pohon node, dan memiliki data desain dalam konteks. Jika Anda kemudian mengatakan "desainer memperbarui token tombol," agen dapat memanggil lagi dan mendapatkan data terbaru.
Model koneksi langsung ini nyata dan menarik untuk beberapa workflow. Agen bekerja dengan data terkini. Anda tidak mengelola artefak ekspor. Tidak ada langkah manual antara "desainer mendorong perubahan" dan "agen memilikinya."
Di mana MCP unggul
Data langsung, tanpa langkah ekspor. Agen mengambil status terkini sesuai permintaan. Jika desain berubah sepuluh menit yang lalu, agen dapat melihatnya. figmascope memerlukan ekspor ulang manual untuk menangkap perubahan.
Eksplorasi desain percakapan. "Apa warna tombol CTA?" "Berapa banyak layar yang mereferensikan komponen ini?" Dengan MCP, agen dapat menjawab ini dengan memanggil Figma. Dengan bundle, jawabannya hanya setua ekspor terakhir.
Mengedit Figma secara langsung. Beberapa server MCP mengekspos operasi tulis — membuat node, memperbarui properti, memposting komentar. Ini hanya mungkin dengan koneksi langsung. Bundle statis tidak memiliki jalur tulis.
Tidak ada workflow manual. Untuk pengembang yang sudah menggunakan setup agen yang terhubung MCP, tidak ada langkah ekspor berarti satu hal yang lebih sedikit untuk dilupakan. Manajemen konteks didelegasikan ke agen.
Di mana MCP kalah
Model koneksi langsung memiliki biaya arsitektur yang mudah diremehkan.
Status terikat sesi. Panggilan MCP terjadi dalam konteks sesi percakapan. Data yang diambil agen dalam sesi A tidak tersedia dalam sesi B tanpa pengambilan ulang. Jika Anda memulai chat baru, agen memulai dari awal. Bundle figmascope bertahan antar sesi, antar pengembang, dan antar alat — hanya file.
Tidak transparan ke git. Tidak ada artefak. Tidak ada yang perlu di-commit. Konteks desain yang menginformasikan kode Anda tidak berada di repositori. Enam bulan dari sekarang, jika Anda ingin memahami bagaimana tampilan desain ketika komponen dibangun, tidak ada catatan. Dengan bundle di repo, Anda memiliki riwayat commit maksud desain.
Memerlukan koneksi. MCP memerlukan server yang berjalan, koneksi API Figma yang aktif, dan PAT dengan akses. Jaringan mati, API Figma mati, PAT kedaluwarsa — agen tidak memiliki konteks. Bundle berfungsi di pesawat.
Pengambilan bergantung model. Apa yang diminta agen melalui MCP bergantung pada apa yang diputuskan untuk ditanyakan. Ia mungkin tidak mengambil nilai token. Ia mungkin tidak menarik inventaris komponen. Ia mungkin hanya meminta subpohon node yang dianggap dibutuhkan, melewatkan konteks spasial dari node yang berdekatan. Pengambilannya bersifat probabilistik, bukan deterministik. figmascope mengambil semuanya, setiap saat, dengan skema tetap.
Lebih sulit diuji dan direproduksi. "Agen saya membangun komponen ini dari data Figma ini pada saat ini" tidak dapat diverifikasi dengan MCP. Pengambilannya bersifat sementara. Dengan bundle, Anda dapat memutarnya kembali: bundle yang sama, agen yang sama, prompt yang sama — output deterministik. Ini penting untuk debugging, peninjauan kode, dan akuntabilitas rilis.
Tekanan context window. Panggilan get_file yang naif pada file Figma yang kompleks mengembalikan pohon JSON yang sangat besar. Agen harus melakukan panggilan alat selektif untuk tetap dalam anggaran konteks. Ini memperkenalkan heuristik dan penilaian yang bisa salah. figmascope memproses pohon terlebih dahulu menjadi IR terstruktur hanya dengan yang diperlukan, pada ukuran yang diketahui dan dibatasi.
Model bundle figmascope: tangkap sekali, kirimkan selamanya
figmascope mengekspor .zip dari file biasa dari Figma REST API — tanpa plugin, tanpa server, berjalan di browser Anda. Bundle berisi:
CONTEXT.md— spesifikasi yang dapat dibaca manusia, spesifikasi yang dapat dibaca agentokens.json— design token bertipe, sumber bertingkat: variabel Figma → disimpulkan dari frekuensi → tidak adascreens/*.json— IR per-layar dengan semantik tata letak: stack, overlay, absolute, leaf;componentIdpada node INSTANCE;stringRef.keypada teksscreens/*.png— screenshot referensi 2×components/inventory.json— indeks komponen lengkapstrings.json— semua konten teks, dikunci_meta.json— metadata ekspor
Setelah diekspor, bundle bersifat mandiri dan tidak dapat diubah. Ia masuk ke repo Anda bersama kode yang dideskripsikannya. Agen mana pun, sesi mana pun, pengembang mana pun, pekerjaan CI mana pun dapat membacanya. Tidak diperlukan koneksi ke apa pun.
Diff yang dapat diversi: membandingkan bundle seperti kode
Ini adalah argumen terkuat model bundle. Karena outputnya adalah JSON terstruktur dan Markdown, Anda dapat men-diff-nya.
Ekspor bundle sebelum sprint desain. Ekspor lagi setelah. Jalankan diff pada tokens.json:
- "spacing.4": "16px"
+ "spacing.4": "14px"
Itu adalah perubahan yang merusak dalam skala spacing Anda. Ini terlihat, dapat ditinjau, dan dapat dilacak ke commit. Dengan MCP, perubahan yang sama terjadi secara diam-diam — saat berikutnya agen mengambil, ia mendapatkan nilai baru, dan tidak ada catatan bahwa sesuatu berubah.
Anda dapat menjalankan ini sebagai gerbang PR: ekspor bundle sebagai bagian dari design handoff, commit, minta tanda tangan desainer dan dev pada diff sebelum implementasi dimulai. Itu adalah spesifikasi-desain-sebagai-kode. MCP tidak memiliki padanan.
Argumen determinisme
Versi file Figma yang sama + ekspor figmascope yang sama = bundle yang sama. Setiap saat. Skema IR tetap. Logika sumber token bersifat deterministik. Ekstraksi kunci string berbasis aturan.
Pengambilan MCP tidak deterministik. Agen memutuskan apa yang harus diambil. Agen yang berbeda, phrasing prompt yang berbeda, anggaran konteks yang berbeda — perilaku pengambilan yang berbeda. Outputnya bergantung model.
Untuk production UI codegen, determinisme penting. Anda ingin spesifikasi yang menghasilkan komponen dapat direproduksi. Anda ingin dapat meregenerasi komponen dari input yang sama dan mendapatkan hasil yang konsisten. Bundle mendukung ini. Sesi MCP tidak.
Perbandingan
| Dimensi | Figma MCP | Bundle figmascope |
|---|---|---|
| Kesegaran data | Selalu langsung — mengambil status Figma terkini | Snapshot — setua ekspor terakhir |
| Langkah ekspor diperlukan | Tidak | Ya — satu kali per versi desain |
| Dapat dikontrol versi | Tidak — tanpa artefak | Ya — bundle adalah JSON + Markdown yang dapat di-diff |
| Bertahan antar sesi | Tidak — harus mengambil ulang setiap sesi | Ya — file bertahan tanpa batas |
| Berfungsi offline | Tidak | Ya |
| Output deterministik | Tidak — pengambilan bergantung model | Ya — input yang sama → bundle yang sama selalu |
| Tekanan context window | Tinggi — JSON Figma mentah besar dan tidak terstruktur | Rendah — IR diproses terlebih dahulu, ukuran dibatasi |
| Operasi tulis pada Figma | Ya (beberapa server MCP) | Tidak — ekspor hanya baca |
| Spesifikasi desain dalam riwayat git | Tidak | Ya — commit bundle, lacak riwayat desain |
| Setup agen diperlukan | Ya — konfigurasi server MCP per klien agen | Tidak — agen mana pun yang membaca file berfungsi |
| Kunci string i18n | Tidak dalam skema MCP Figma dasar | Ya — stringRef.key dalam IR + strings.json |
| IR spasial / tata letak | Pohon node Figma mentah (tanpa tipe tata letak semantik) | IR bertipe: stack / overlay / absolute / leaf |
| Sumber token | Variables jika ditetapkan; jika tidak nilai mentah | Variables → disimpulkan dari frekuensi → tidak ada |
MCP unggul untuk "edit Figma langsung" — bundle unggul untuk "bangun UI produksi"
Ini adalah ringkasan yang jujur. Jika workflow Anda adalah eksplorasi desain percakapan — "ubah komponen ini," "anotasi layar ini," "apa token warna pada frame ini" — koneksi langsung MCP adalah model yang tepat. Agen adalah kolaborator dalam proses desain, dan ia memerlukan data terkini untuk melakukan itu.
Jika workflow Anda adalah membangun UI produksi dari desain yang sudah final (atau hampir final) — mengimplementasikan komponen, menghubungkan status, menulis pengujian — model bundle lebih baik. Anda ingin spesifikasi yang tertambat di repo Anda, dapat di-diff di seluruh iterasi desain, dapat dibaca oleh agen mana pun tanpa konfigurasi, dan cukup deterministik untuk dibangun.
Kedua model ini saling melengkapi. Gunakan MCP ketika desain masih berubah dan Anda sedang beriterasi secara kolaboratif. Ekspor bundle figmascope ketika desain stabil dan Anda menyerahkannya ke insinyur untuk implementasi. Bundle menjadi sumber kebenaran yang dibangun implementasi — dapat dilacak, dapat ditinjau, dapat direproduksi.