Sebagai pengembang yang berkolaborasi dengan desainer dalam pengembangan produk, kita akan menghadapi berbagai tantangan yang dapat menghambat kerja sama tim yang efektif. Banyak dari masalah ini muncul dari keterlibatan yang terbatas dalam proses desain atau aset desain yang tidak lengkap. Figma telah memperkenalkan Mode Dev Figma untuk mengatasi masalah ini yang bertujuan untuk mendukung kolaborasi pengembangan desain yang mulus.
Bagaimana ini akan memengaruhi alur kerja sebagai pengembang? Kenali lebih lanjut Mode Dev Figma, jelajahi fitur-fiturnya, dan temukan praktik terbaik untuk penggunaannya.
Apa itu Mode Dev Figma?
Figma adalah alat desain antarmuka yang populer, populer dengan tim yang membangun prototipe atau membuat maket situs web. Mode Devnya diumumkan perusahaan pada Config 2023 yang bertujuan untuk berfungsi sebagai ruang kerja pengembang setelah pencipta menyadari betapa sulitnya mereka berinteraksi dengan kanvas Figma. Mode Dev mirip dengan alat inspeksi di Chrome tetapi menyampaikan maksud desainer dalam bahasa yang lebih familiar.
Mode Dev Figma menawarkan berbagai fitur termasuk inspeksi, cuplikan kode, plugin, sistem desain, status bagian, dan kemampuan untuk membandingkan perubahan. Fitur-fitur ini akan membantu meningkatkan komunikasi, merampingkan proses, dan mempertahankan alur kerja desain hingga pengembangan yang konsisten.
Saat ini Mode Pengembang masih dalam versi beta dan dapat mengaksesnya menggunakan browser web atau aplikasi desktop Figma.
Komunikasi Mulus Dengan Mode Pengembang
Saat mengakses file desain, konten dapat terlihat seperti banyak panel, penuh dengan terminologi desain yang mungkin sulit dipahami dan bahkan mungkin tidak tahu harus mulai dari mana. Hanya dengan menekan satu tombol akan menjelma menjadi ruang yang terasa lebih akrab.
Panel navigasi tidak terlalu sempit dengan menu tarik-turun yang berisi banyak bingkai dan lapisan yang diperluas untuk menampilkan bagian yang berbeda. Versi baru ini jauh lebih terorganisir.
Fitur hebat lainnya yang mungkin perlu diperhatikan adalah stempel waktu yang menunjukkan suntingan terakhir. Kita dapat melihat detail edit dengan mencentang opsi bandingkan perubahan di panel Inspeksi. Ini berarti kita dapat melihat dan melacak perubahan yang dilakukan, mirip dengan versi riwayat sebuah konsep yang cocok.
Panel Inspeksi menyajikan informasi yang relevan menggunakan bahasa yang mudah dipahami. Kita dapat memeriksa elemen dan menambahkan plugin yang lebih cocok untuk pekerjaan. Mode Pengembang menawarkan berbagai fitur interaksi yang memungkinkan berbagi ide dan saran di berbagai titik. Fitur-fitur ini termasuk obrolan kursor, blok komentar, obrolan audio, dan tombol bagikan.
Fitur-fitur ini memungkinkan kolaborasi pengembangan desain bersamaan karena umpan balik terjadi secara real time dalam lingkungan yang sama. Hasilnya ini meningkatkan produktivitas dan mempercepat alur kerja.
Ekstraksi Aset yang Efisien
Tidak jarang desainer memberikan aset desain yang tidak lengkap yang bisa membuat bingung. Pengembang menghargai sumber daya dan ketersediaan komponen untuk memastikan efisiensi pembangunan. Dengan Mode Pengembang, ekstraksi aset sangat mudah dengan hanya beberapa klik.
Setiap kali memilih bingkai, panel inspeksi menampilkan daftar aset yang digunakan. Itu juga membuat mereka tersedia untuk diunduh dalam empat format berbeda.
Alat ini memungkinkan kita mengakses aset tanpa harus bolak-balik dengan tim desain. Ini membantu menghindari kesalahan atau kebingungan, membantu menghemat waktu dan memungkinkan kita untuk fokus pada tugas lain.
Proses Handoff yang Disederhanakan
Mode Dev adalah paket terbaik untuk menangani handoff. Ini menggabungkan semua yang dibutuhkan di satu lokasi yang dapat disesuaikan dengan alur kerja. Mode Pengembang membantu mempercepat proses handoff dengan mengaktifkan:
- Desain dan pengembangan dalam satu lingkungan
- Kolaborasi waktu nyata
- Inspeksi dan cuplikan kode
- Integrasi sistem desain
- Label status bagian
Tips Menggunakan Mode Pengembang
Kita dapat menggunakan Dev Mode Figma sebagai bagian dari alur kerja, tetapi bagaimana kita memanfaatkannya? Coba saran ini.
- Gunakan sumber daya dan plugin Dev untuk menyesuaikan pengalaman, tautkan alat yang sudah digunakan dalam Mode Pengembang untuk merampingkan alur kerja. Dari GitHub hingga kerangka kerja di tumpukan ada beragam pilihan.
- Gunakan fitur inspeksi dan cuplikan kode untuk mengakses pengukuran, spesifikasi, gaya, dan aset elemen desain. Kita juga dapat membuat kode di pustaka yang berbeda dengan menggunakan plugin.
- Pantau perubahan desain untuk memastikan tidak melewatkan apa pun. Fitur Compare changes berfungsi sebagai alat riwayat versi dan pastikan untuk memeriksanya secara teratur.
- Manfaatkan semua fitur kolaborasi untuk komunikasi dan hubungi desainer menggunakan komentar, obrolan kursor, dan lainnya.
- Kita juga dapat memeriksa elemen dalam Kode VS dengan ekstensi Kode Figma VS yang baru. Ini juga memungkinkan kita melakukan lebih banyak aktifitas termasuk navigasi file, pelacakan perubahan, kolaborasi desainer, dan akselerasi implementasi desain tanpa meninggalkan VS Code.
- Tetap up-to-date pada fitur-fitur yang lebih baru, lihat seberapa baik mereka dapat melayani dan tingkatkan keterampilan di setiap kesempatan.
Menggunakan Mode Pengembang untuk Merampingkan Alur Kerja
Mode Dev Figma akan membuat alur kerja lebih efisien, memungkinkan kolaborasi desainer dengan pengembang yang lebih baik dengan fitur-fitur yang diperlukan. Ada lebih banyak bagian dalam ekosistem Figma dan popularitas aplikasi berarti ini adalah alat berharga yang dapat dibawa dari satu pekerjaan ke pekerjaan lain.
