chatgpt figma plugin

Plugin Figma ObrolanGPT

v0.3.6

Plugin ChatGPT eksperimental untuk Figma

---

Ringkasan

Plugin eksperimental ini memungkinkan desainer untuk memanfaatkan ChatGPT Open AI langsung di dalam Figma. "Penciptaan" gambar difasilitasi melalui Lexica dan Unsplash. Ada juga panel kecil untuk mengeksekusi kode dan konsol mini.

Karena plugin ini bersifat eksperimental dan memanfaatkan API ChatGPT tidak resmi, plugin ini hanya beroperasi dalam "mode Pengembang" dan dapat rusak atau berhenti bekerja kapan saja. Anda seharusnya cukup terbiasa dengan terminal, karena pengaturannya agak rumit dan server harus sering di-restart mengingat minat ChatGPT saat ini.

Tonton demonya

---

Memulai

Prasyarat

1. Buat akun OpenAI
2. Pastikan Anda telah menginstal Node 18.0+ . Saya merekomendasikan nvm untuk menangani pembuatan versi Node.

Unduh dan Bangun

1. Kloning repositori ini ke direktori pilihan Anda. git clone https://github.com/frederickk/chatgpt-figma-plugin.git
2. Instal dependensi yang diperlukan npm install
3. Buat file .env , dan tambahkan kredensial login OpenAI Anda OPENAI_EMAIL="..." dan OPENAI_PASSWORD="..."
4. Bangun npm run build

Instal dan Jalankan

1. Jalankan server perantara ChatGPT npm run serve .
2. Muat plugin di dalam Figma Plugins > Development > Impor plugin dari manifes...
3. Dan voila!

---

Penggunaan

Cukup masukkan pertanyaan atau permintaan ChatGPT, klik tombol Kirim (ikon pesawat kertas), dan (setelah beberapa detik) hasilnya akan:

1. menelurkan kotak teks baru atau
2. mengganti isi teks dari kotak teks yang dipilih
3. kesalahan keluar... coba lagi?

Buka panel Lexica untuk mencari Lexica untuk karya yang dihasilkan AI yang sesuai dengan deskripsi yang Anda berikan.

Buka panel Kode dan masukkan javascript Figma Plugin API valid yang ingin Anda jalankan. ️ Hati-hati! ini dilakukan menggunakan eval() dan bukan yang paling aman ️ .

Buka panel Konsol untuk menampilkan sedikit keluaran konsol sehingga Anda dapat melihat apa yang terjadi di balik layar.

---

Membangun

Memerintah	Keterangan
npm run build	Menjalankan proses pembuatan Webpack satu kali
npm run clean	Membersihkan ./build dan semua file cache
npm run dev	Menjalankan proses pembuatan Webpack dan memperhatikan perubahan; membangun kembali jika diperlukan
npm run dev:serve	Sama seperti dev tetapi dengan UI yang dapat diakses melalui http://localhost:8080
npm run serve	Menjalankan server perantara API ChatGPT http://localhost:3000 . Ini diperlukan agar plugin dapat berfungsi.