Dev Mode Figma, Bantu Optimalisasi Kerja Developer

(sumber: https://www.figma.com)

Figma merupakan salah satu tools desain grafis yang cukup sering digunakan di kalangan mahasiswa. Sebagai mahasiswa Departemen Sistem Informasi (DSI), tentunya kita sangat familiar dengan Figma. Mata kuliah Rekayasa Kebutuhan Perangkat Lunak dan Desain Pengalaman Pengguna merupakan beberapa mata kuliah di DSI yang memanfaatkan Figma untuk menunjang pembelajaran di kelas, yakni dengan membuat desain UI/UX (User Interface/User Experience) dari aplikasi yang kita rancang. Selain mudah digunakan, Figma juga memberikan akses secara gratis untuk penggunanya. Beberapa waktu yang lalu, Figma secara resmi meluncurkan beberapa fitur terbaru mereka, dan salah satu inovasi mereka dirasa sangat menarik perhatian bagi komunitas IT yakni adanya fitur Dev Mode. Fitur ini bertujuan untuk membantu pengembang dalam menerjemahkan desain yang berbentuk grafis ke kumpulan barisan kode fungsional dengan cepat. Hal ini tentunya sangat mempermudah developer dalam melakukan pekerjaannya.

Dari survei yang telah dilakukan oleh Figma, jumlah pengguna yang memiliki latar belakang  developer lebih banyak daripada pengguna yang bertujuan untuk desain semata. Hal ini lah yang mendasari peluncuran Fitur Dev Mode. Sebagai Developer Front-end maupun Full Stack, seringkali kita mengalami kesulitan untuk mentranslasikan desain yang telah dibuat oleh UI/UX menjadi kode yang fungsional. Fitur Dev Mode akan membantu developer untuk mendapatkan code sesuai desain yang diinginkan.

(sumber: https://www.animaapp.com)

Penggunaan

Cara penggunaan fitur ini cukup mudah. Kita hanya perlu melakukan beberapa setting, seperti bahasa pemrograman yang digunakan, jenis hardware yang digunakan, dan melakukan koneksi dengan VSC, GitHub, Anima, Jira, maupun teks editor lain. Setelah melakukan pengaturan awal, kita hanya perlu memilih desain yang kita inginkan. Secara otomatis rincian code dari desain tersebut akan muncul. Tidak hanya itu, semua aset yang kita gunakan di Figma akan muncul dan dapat kita download. Di samping itu, Figma juga menyediakan extension untuk Visual Studio Code, yang tentunya sangat berguna bagi developer. 

Meskipun telah melakukan setting di awal, kita masih bisa mengubah spesifikasi yang diinginkan, seperti bahasa pemrograman dan koneksi ke teks editor. Tidak perlu khawatir, Fitur Dev Mode ini tidak akan mengubah desain yang telah dibuat sebelumnya. Selain itu, kita juga bisa menonaktifkan fitur ini, sehingga bisa beralih untuk pembuatan desain lagi.

Fitur Dev Mode dan Figma untuk Visual Studio Code tersedia dalam versi beta dan gratis untuk semua pengguna selama sisa tahun 2023. Tetapi mulai tahun 2024, kita memerlukan paket berbayar untuk mengakses Fitur Dev Mode. Terdapat dua opsi paket berbayar, yaitu untuk organisasi sebesar $25/bulan dan untuk perusahaan sebesar $35/bulan. Oleh karena itu, selagi fitur ini bisa diakses secara gratis, yuk kita coba pelajari dan explore salah satu fitur powerful terbaru dari Figma ini!

Penulis: Melatie Raghyl Putri

Editor: Abraham Mauritz Talakua, Ellion Blessan, I Kadek Wahyu Dwi Pranatasana

Referensi:

https://www.figma.com/dev-mode/

https://www.figma.com/blog/introducing-dev-mode/