Figma merilis agen desain

• Agen desain khusus Figma yang bekerja langsung di atas kanvas telah dirilis, menghadirkan lingkungan tempat desainer bisa bolak-balik antara kolaborasi AI dan manipulasi langsung tanpa berpindah alat
• Di-fine-tune untuk memahami secara mendalam konteks sistem desain seperti komponen, token, standar, dan best practice, sehingga menghasilkan output yang dioptimalkan untuk pengeditan file Figma
• Prompt dapat dimulai dari mana saja di layer desain, dengan parallel prompt untuk menjelajahi banyak ide secara bersamaan, serta agen dan pengguna dapat mengedit pada saat yang sama
• Dapat dimanfaatkan untuk mengotomatiskan pekerjaan repetitif (busywork) seperti mengubah variabel secara massal, mengganti komponen, beralih ke dark mode, dan mengganti lorem ipsum
• Akan dirilis bertahap dalam versi beta selama beberapa minggu ke depan, tanpa konsumsi kredit selama masa beta, tersedia untuk pengguna Full seat pada paket Professional/Organization/Enterprise

---

Latar peluncuran dan positioning

• Elemen inti yang dibutuhkan desainer adalah eksplorasi, eksperimen, kolaborasi, dan presisi, dan Figma dirancang sebagai kanvas multiplayer yang memungkinkan semua itu
• Saat tim mulai mengadopsi alat agen, muncul pilihan biner yang keliru (false choices) seperti "kecepatan vs presisi" dan "hasil AI vs manipulasi langsung", tetapi posisinya adalah tidak perlu memilih salah satu
• Setelah awal tahun ini membuka kanvas Figma untuk agen pihak ketiga, kini Figma merilis agen Figma yang tertanam langsung di kanvas dan rel kiri (left rail)
• Tujuannya adalah membuat agen yang mahir di Figma dan native terhadap cara kerja tim, dengan menjadikan Figma sendiri dapat dibaca model (legible) pada tingkat yang tidak mungkin dicapai alat pihak ketiga

Agen Figma vs server MCP

• Agen Figma

  • Digunakan saat bekerja di kanvas, bersifat bawaan, dan memiliki konteks tambahan tentang sistem desain
  • Selalu tersedia di kanvas tanpa pengaturan terpisah atau perpindahan konteks

• Server MCP

  • Digunakan saat membawa kode ke kanvas (pull) atau mengekspor kembali desain ke kode (push)
  • Menangani workflow antara kode dan kanvas bersama use_figma

Cara kerja inti

• Bekerja di samping kanvas sebagai kolaborator sejati (true collaborator) yang beroperasi bersama tim dalam file yang sama
• Di-fine-tune untuk pengeditan file Figma sehingga menghasilkan output yang sesuai konteks desain, dan dirancang agar manipulasi langsung tetap memungkinkan sehingga pengguna mempertahankan kendali
• Berbeda dari server MCP, agen ini hadir langsung di kanvas sehingga tidak memerlukan pengaturan terpisah atau perpindahan konteks
  • Prompt bisa dimulai dari layer desain mana pun
  • Mendukung parallel prompting untuk membuka banyak ide sekaligus
  • Saat agen bekerja, pengguna juga bisa mengedit dan melakukan iterasi secara bersamaan

Menjelajahi lebih banyak arah (Explore more directions)

• Desain terbaik tidak muncul dari ide pertama atau prompt pertama; menjelajahi arah, membandingkan pendekatan, dan melakukan iterasi adalah inti dari desain

• Meluas (Go wide)

  • Dengan cepat menghasilkan pendekatan gaya yang berbeda untuk masalah yang sama
  • Membandingkan beberapa alur checkout yang dioptimalkan untuk tujuan bisnis yang berbeda
  • Dapat meminta tiga arsitektur informasi yang berbeda

• Mendalam (Go deep)

  • Memilih satu arah lalu melakukan iterasi, membandingkan implementasi, dan meninjau ulang desain yang ada sambil tetap menjaga keselarasan dengan sistem desain
  • Menggunakan komponen yang paling sering dan paling baru dipakai sebagai titik awal
  • Dapat memilih library tertentu dan menentukan token/variabel/komponen lewat @mention untuk mengarahkan output — semacam pintasan untuk sistem desain

• Keterkaitan dengan Figma Make

  • Membuat layer desain dengan agen di Figma Design untuk memperjelas maksud alur, state, copy, dan struktur → mengirim ke Make untuk membuat layer kode → lalu menyematkannya kembali ke Figma Design
  • Atau mulai dari Figma Make → menyalin frame ke Figma Design → melakukan iterasi dengan agen → lalu mengirimnya kembali ke Make
• Semakin mudah membuat desain dengan AI, semakin besar risiko merilis hasil yang biasa-biasa saja, dan agen ini dirancang untuk membantu menjelajahi lebih banyak arah agar bisa memilih yang tepat
• Setelah arah ditentukan, sering kali bekerja langsung dengan tangan lebih cepat, lebih alami, dan lebih efisien token (token efficient)

Mengotomatiskan pekerjaan repetitif (Automate busywork)

• Karena agen bekerja bersama di atas kanvas, pengguna dapat bebas beralih antara bantuan AI dan manipulasi langsung
• Mengotomatiskan pekerjaan membosankan yang memerlukan konteks dan presisi
  • Mengubah nama variabel secara massal demi konsistensi
  • Mengganti komponen yang sama di banyak layar
  • Menerapkan perubahan padding berulang di seluruh alur
  • Mengisi banyak frame dengan konten yang realistis

• Contoh penggunaan spesifik

  • Memperbarui tipografi di seluruh file
  • Mengganti copy lorem ipsum dan gambar di seluruh grid
  • Mengatur semua komponen chip ke state aktif
  • Mengalihkan layar ke dark mode tanpa menyesuaikan fill dan kontras secara manual

• Sangat berguna terutama bagi pengelola sistem desain

  • Memperbarui deskripsi, tag, dan use case di seluruh library secara massal
  • Menstandarkan konvensi penamaan
  • Mendokumentasikan komponen beserta semua state dan variannya
  • Membagikan contoh hasil kerja tim sebagai panduan kualitas

• Handoff dengan server Figma MCP

  • Pekerjaan dapat berpindah antara kode dan Figma tanpa kehilangan fidelitas
  • Mulai dari kode → bawa ke Figma dengan fitur code-to-canvas untuk diiterasikan atau diberi sistem desain → kirim kembali lewat server MCP, dengan semuanya tetap sinkron

Memaksimalkan pemanfaatan umpan balik (Do more with feedback)

• Dalam pekerjaan desain, komentar dan umpan balik seperti catatan kritik, respons pemangku kepentingan, dan pertanyaan yang belum terjawab terus menumpuk di berbagai bagian file
• Karena seluruh tim bekerja di file yang sama, agen sudah memiliki konteks; rasanya bukan seperti memberi briefing ke kolaborator baru, melainkan merapikan pemikiran bersama orang yang memang sudah ada di ruangan yang sama

• Cara memanfaatkannya

  • Merangkum umpan balik, mengidentifikasi tema, dan mengubah masukan menjadi langkah berikutnya
  • Melakukan pressure test desain dari berbagai sudut pandang — misalnya memodelkan reaksi VP yang berfokus pada pendapatan
  • Menyusun thread komentar yang panjang menjadi rencana yang bisa dieksekusi
  • Merapikan pemikiran sebelum sesi kritik (crit) untuk mempertajam arah

Roadmap ke depan dan syarat peluncuran

• Dalam beberapa bulan ke depan, fokusnya adalah meningkatkan dukungan sistem desain, memperbaiki UX, memperluas kemampuan pencarian di seluruh file, dan menambah cara kustomisasi

• Syarat rilis beta

  • Rollout beta bertahap selama beberapa minggu ke depan
  • Selama masa beta tidak mengonsumsi kredit, dan kredit AI akan berlaku saat rilis umum (GA)
  • Pendaftaran waitlist tersedia, tetapi pendaftaran tidak menjamin akses

• Paket yang didukung

  • Tersedia untuk pengguna Full seat pada paket Professional, Organization, dan Enterprise
  • Pengguna seat Collab dan Dev dapat memakai agen di drafts
  • Paket Starter, Education, dan Government tidak termasuk