Unlimited Wordpress themes, plugins, graphics & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Web Design
  2. Figma

Desain antarmuka kolaboratif dengan Figma

by
Length:LongLanguages:

Indonesian (Bahasa Indonesia) translation by Cuma Hapsah (you can also view the original English article)

Figma adalah sesuatu yang sedikit khusus sekarang. Pada pandangan pertama itu adalah hanya aplikasi berbasis web desain, tetapi meskipun ada program lain dengan kesamaan, apa yang membuat satu ini berbeda adalah kemampuannya untuk memenuhi kebutuhan khusus dari perancang antarmuka.

Hal ini jelas orang-orang di belakang Figma memahami bahwa sebagian besar proyek desain antarmuka berbasis tim atau kolaboratif dalam beberapa cara. They're jelas juga menyadari rasa sakit poin tim sering harus bekerja melalui ketika menangani kolaborasi dan sinkronisasi, dengan studios biasanya perlu kasar bersama solusi terdiri dari beberapa desain, pihak ketiga penyimpanan, dan kontrol versi alat.

Figma menghilangkan kebutuhan untuk pendekatan ini terputus-putus dengan menyediakan:

  • Lanjutan kemampuan kolaborasi hidup yang secara otomatis menyimpan semua anggota tim yang disinkronkan.
  • Gabungan Desain, prototipe dan pengembang tangan-off dalam satu aplikasi sehingga lebih dapat dilakukan di satu tempat.
  • Akses pada semua sistem operasi desktop, yaitu Mac, Windows, Linux dan ChromeOS.

Terlepas dari kenyataan Figma's "pada kanvas" alat yang hebat, dan mungkin cukup untuk meyakinkan banyak desainer untuk menggunakan perangkat lunak, ini adalah pendekatan yang berfokus pada kolaborasi yang memimpin banyak Studio untuk menempatkan aplikasi selain lain dan mengkonsolidasikan ke menggunakan Figma sebaliknya.

"Kami sekarang memiliki lingkungan yang dinamis, kolaboratif yang memungkinkan kita untuk melakukan brainstorming bersama-sama, bangkit ide dari satu sama lain dan akhirnya menjadi lebih kreatif."-Taylor Madaffari, Copywriter, lorong roket Studios

Dalam artikel ini Anda akan melihat sendiri mengapa tim mengambil minat pada Figma, seiring langkah Anda melalui bagaimana Anda dapat mengambil keuntungan dari yang gamut penuh dari kolaborasi alat.

Jika Anda belum memiliki rekening Figma Anda bisa mendapatkannya gratis dan ikuti bersama dengan segala sesuatu yang kita bahas.

Figma start hereFigma start hereFigma start here
Antarmuka figma's

Kami akan mencakup cukup banyak dalam posting ini, sehingga Anda mungkin ingin ambil kopi pertama:

  • Bagaimana kolaborasi Figma dilakukan
  • Membuat dan mengelola tim
  • Kontrol tingkat akses anggota tim
  • Komponen bersama tim dan gaya
  • Berbagi dan menanamkan
  • Komentar
  • Riwayat Versi
  • Mengintegrasikan dengan alat-alat tambahan

Bekerja bersama-sama, dokumen yang sama, Real Time

Salah satu fitur kolaborasi Figma yang paling menonjol adalah kemampuan untuk memiliki beberapa anggota tim bekerja sama secara bersamaan, dalam dokumen yang sama, seperti update secara real time.

Hal ini dimungkinkan oleh fakta Figma adalah aplikasi berbasis web. Dalam masa lalu berbasis web desain aplikasi mungkin tidak diambil sepenuhnya serius, tetapi dalam kasus Figma sifat online adalah bagian inti dari apa yang membuatnya begitu menarik.

Untuk setiap orang dengan Figma tertentu file terbuka, kolaborator lain akan melihat sedikit pointer mouse melayang-layang kanvas dengan nama orang itu melekat padanya, menunjuk di mana mereka titik. Setiap perubahan yang mereka buat untuk dokumen akan di-relay ke semua anggota lain, yang akan melihat perubahan-perubahan tersebut muncul secara real time. Perubahan dalam Figma file tersedia untuk orang lain, langsung.

Ini terpusat, nyata waktu update dari kolaboratif file berarti:

  • Tidak ada lagi mengirimkan file bolak-balik antara anggota tim.
  • Tidak ada lagi yang mengkonversi dari satu format ke lain untuk berurusan dengan software yang berbeda untuk tahap yang berbeda dari proyek.
  • Tidak ada lagi upload file ke pihak ketiga penyimpanan sehingga anggota tim lainnya dapat mengakses perubahan.
  • Lagi mendapatkan keluar dari sinkronisasi antara perubahan satu anggota memiliki dalam file mereka dan anggota lain mereka telah di mereka.
  • Anda dapat bekerja melalui ide-ide dan saran bersama-sama, seperti Anda sedang mendiskusikan mereka.
  • Demikian pula, Anda dapat menerapkan klien umpan balik seketika saat Anda menunjukkan kepada mereka sebuah desain.

Jadi bagaimana Anda pergi tentang memungkinkan orang untuk berkolaborasi dengan cara ini? Mari kita Cari tahu.

Bagaimana kolaborasi Figma dilakukan

Dalam Figma ada dua cara Anda dapat bekerja sama.

  1. Satu adalah melalui membuat dan mengelola tim anggotanya semua memiliki akses ke proyek-proyek bersama (pendekatan besar untuk studios).
  2. Yang lain adalah melalui berbagi dokumen, yang dapat baik untuk lebih bebas-bentuk berbasis masyarakat kerjasama.

Kita akan mulai dengan melihat tim, yang menjadi fokus utama Figma kolaborasi.

Membuat dan mengelola tim

Untuk memulai bekerja dengan tim di Figma Anda harus membuat tim baru pertama. Login ke Figma dan menekan tombol tim baru di sudut kiri bawah antarmuka:

new team button in Figmanew team button in Figmanew team button in Figma

Di halaman Anda kemudian akan diarahkan ke, masukkan nama untuk tim baru Anda:

Name your teamName your teamName your team

Selanjutnya, Anda akan dibawa ke halaman di mana Anda dapat memilih antara dua tim rencana jenis. Anda dapat menggunakan tingkat gratis, yang memungkinkan tim dua orang dan pemirsa yang terbatas untuk mengakses tiga proyek, atau rekening dibayar untuk anggota tim dan proyek-proyek serta Beberapa fitur tambahan yang Anda dapat membaca tentang pada halaman harga Figma.

Choose your team planChoose your team planChoose your team plan

Mengundang anggota tim

Saat ini tim Anda telah dibuat dan siap untuk Anda untuk mengundang anggota.

Di daerah browser file Figma, terlihat di sidebar kiri untuk melihat nama tim Anda hanya mengatur. Klik untuk pergi ke jendela manajemen untuk tim:

find teamfind teamfind team

Di kanan bawah antarmuka Anda akan melihat sebuah area dengan judul anggota tim, dan di bawah judul yang Anda akan melihat + mengundang link. Klik link untuk memulai proses undangan.

invite membersinvite membersinvite members

Dalam popup yang muncul, masukkan alamat email dari orang yang Anda ingin mengundang. Pada titik ini Anda juga akan menetapkan tingkat akses anggota tim untuk baik "admin", "bisa mengedit" atau ""dapat melihat"(kita akan pergi ke apa yang berarti izin tersebut segera).

permissionspermissionspermissions

Setelah diundang, orang akan menerima lansiran dalam Figma atau email di mana mereka dapat menerima undangan dan bergabung dengan tim:

invite emailinvite emailinvite email

Menciptakan tim proyek

Setelah Anda memiliki anggota tim Anda mengundang Anda dapat mulai mendirikan proyek tim dapat semua akses.

Pada halaman manajemen tim, klik + baru proyek link Anda akan melihat di bawah nama tim Anda, di sisi kiri di daerah manajemen tim.

new projectnew projectnew project

Anda akan mendapatkan popup dengan bidang di mana Anda dapat menambahkan nama proyek baru Anda, dan daftar dropdown untuk mengatur perizinan tingkat proyek untuk tim.

Catatan: pada tingkat gratis Anda hanya bisa memilih opsi pertama izin, "semua orang di <team>dapat mengedit" (izin ini akan dijelaskan kemudian).</team>

set permissionsset permissionsset permissions

Sekarang ketika Anda melihat daftar di bawah "Tim proyek" Anda harus melihat proyek Anda baru dibuat, siap untuk tim Anda untuk mulai bekerja pada.

newly created projectnewly created projectnewly created project

Kontrol tingkat akses anggota tim

Setiap anggota tim dapat memiliki tingkat akses mereka secara individual diatur ke salah satu dari empat pilihan:

  • Pemilik.
  • Admin.
  • Editor.
  • Penampil.

Ini tingkat kontrol akses:

  • Apakah Anda dapat mengedit atau hanya melihat file.
  • Tingkat anggota tim Anda dapat mengundang untuk proyek.
  • Tingkat anggota tim untuk siapa Anda dapat mengubah hak akses.

Tingkat akses anggota tim akan berlaku untuk semua bahwa tim proyek dan file.

Yang dapat mengubah file?

Setiap tingkat kecuali pemirsa dapat membuat perubahan ke file.

Pemilik dan undangan Admin dan pengaturan izin

Pemilik dan admin dapat mengesahkan sebuah tim dengan kendur, mengundang anggota tim sebagai admin, editor atau pemirsa, dan juga mengubah hak akses anggota tim.

Pemilik dan admin adalah fungsional sama, tapi hanya mungkin ada satu set orang dengan status pemilik sehingga tampaknya menjadi terutama tentang berkomunikasi siapa yang bertanggung jawab atas proyek. Pemilik dapat mentransfer bahwa status ke anggota tim lainnya.

Editor dan penampil undangan dan pengaturan izin

Editor dapat mengundang dan mengubah hak akses untuk editor dan pemirsa. Pemirsa dapat mengundang pemirsa lain tetapi tidak dapat membuat perubahan izin.

Mengubah tingkat akses

Anda dapat mengubah tingkat akses anggota tim di sudut kanan bawah halaman tim, tim pengaturan di bawah:

Changing Access LevelsChanging Access LevelsChanging Access Levels

Atau Anda dapat mengeklik ikon roda gigi Admin Dashboard link di bagian atas kanan, dekat judul tim pengaturan:

Admin Dashboard linkAdmin Dashboard linkAdmin Dashboard link

Di sini Anda memiliki opsi untuk downgrade anggota untuk "Penampil":

downgrade members to Viewerdowngrade members to Viewerdowngrade members to Viewer

Lanjutan izin untuk tim Pro

Jika Anda berada pada tingkat yang dibayar di Figma Anda dapat menggunakan "Advanced Permissions", dimana proyek-proyek individu dapat memiliki tingkat akses yang menimpa anggota tim tingkat akses yang normal. Berikut adalah opsi-opsi tambahan yang disebutkan sebelumnya tersedia di dibayar tingkatan bila Anda membuat proyek baru.

Sebagai contoh, jika sebuah proyek diatur ke "setiap orang di <team>dapat melihat", anggota tim bahkan yang memiliki izin Editor tidak akan mampu membuat perubahan dalam proyek.</team>

Opsi default, tersedia pada tingkatan gratis, adalah:

  • Semua orang di <team>dapat mengedit: ini adalah fungsi akses normal, sehingga tingkat izin individu diutamakan.</team>

Pilihan lanjutan izin adalah:

  • Semua orang di <team>dapat melihat: anggota tim dapat lihat tetapi tidak mengubah proyek.</team>
  • Hanya mengundang - biarkan aku memilih siapa yang memiliki akses: proyek tidak terlihat kecuali seseorang secara eksplisit diundang.

Komponen bersama tim dan gaya

Komponen dalam Figma pra-dibuat objek grafis yang dapat digunakan kembali sebagai diperlukan, seperti kartu, judul dan tombol. Gaya di sisi lain adalah pra-dikonfigurasi koleksi properti yang dapat diterapkan ke objek, seperti teks styling.

Sebagai contoh, ini adalah Perpustakaan penuh tarik & drop siap komponen UI bahan:

a library full of drag drop ready Material UI componentsa library full of drag drop ready Material UI componentsa library full of drag drop ready Material UI components

Aku tidak akan pergi terlalu banyak ke dalam kemampuan komponen dan gaya sekarang, ketika kita berfokus pada kolaborasi alat, tetapi jika Anda ingin mempelajari lebih lanjut tentang masing-masing, kunjungi:

Berbagi Perpustakaan

Perpustakaan komponen dan gaya dapat dibagi di seluruh tim. Pada halaman manajemen tim untuk tim Anda, lihat di bawah "Tim pengaturan" di bagian kanan atas dan klik tautan mengaktifkan Perpustakaan.

Enable Libraries linkEnable Libraries linkEnable Libraries link

Anda akan melihat daftar pustaka yang berpotensi tersedia untuk tim dan Anda dapat beralih akses on atau off untuk masing-masing:

toggle access on or off for eachtoggle access on or off for eachtoggle access on or off for each

Tips untuk mencegah kecelakaan komponen perubahan

Catatan: jika Anda memiliki akses ke lanjutan perizinan, seperti dijelaskan sebelumnya, Anda dapat menggunakannya untuk memastikan tidak ada yang membuat setiap perubahan tidak disengaja komponen yang kemudian bisa digulung di seluruh papan. Hanya perlu komponen utama Anda dalam proyek-proyek hanya Lihat, kemudian anggota tim Anda akan dapat melihat dan menggunakan komponen tapi tidak memodifikasi mereka.

  • Untuk lebih tim di Perpustakaan kunjungi: Figma blog: tim Perpustakaan 1.0

Berbagi dan menanamkan

Kolaborasi Figma adalah tidak hanya untuk tim sendirian. Anda juga dapat menggunakan fungsi berbagi memungkinkan siapa pun untuk mengedit atau melihat salah satu dokumen Anda, sehingga besar untuk lebih longgar terkoordinasi masyarakat dan orang-orang hanya mencari untuk menciptakan dan hadiah aset dengan desainer lain.

Untuk berbagi dokumen tekan tombol berbagi biru di ujung kanan atas toolbar.

To share a document hit the blue Share buttonTo share a document hit the blue Share buttonTo share a document hit the blue Share button

Dalam popup yang muncul klik link yang mengatakan memungkinkan akses link.

Enable link accessEnable link accessEnable link access

Setelah selesai, di samping baris yang berbunyi siapa pun dengan link, pilih apakah Anda ingin orang untuk dapat mengedit atau hanya melihat dokumen. Anda juga dapat menghapus akses link di sini kemudian jika Anda perlu.

choose whether you want people to be able to edit or just view the documentchoose whether you want people to be able to edit or just view the documentchoose whether you want people to be able to edit or just view the document

Selain itu, pada yang sama "Berbagi" popup Anda dapat mengundang seseorang secara langsung daripada memungkinkan akses link. Seperti halnya dengan anggota tim, setiap orang yang mendapatkan akses mengedit dokumen melalui berbagi dapat berkolaborasi di atasnya secara real time.

Embedding

Jika Anda ingin agar dapat menampilkan desain Figma dari dalam situs lain, Anda dapat melakukan ini dengan embedding.

Sementara masih dalam kotak yang terbuka ketika Anda menekan tombol berbagi, klik <>umum menanamkan link di bagian bawah untuk mendapatkan copy dan paste siap menempelkan kode:

click the Public embed link at the bottomclick the Public embed link at the bottomclick the Public embed link at the bottom

Setelah HTML ini digunakan untuk menanamkan dokumen Figma dalam Halaman ini akan terlihat seperti ini:

embed a Figma document in a pageembed a Figma document in a pageembed a Figma document in a page

File tertanam update secara real time, memastikan versi terbaru selalu sedang ditampilkan.

Komentar

Meskipun kolaborasi dapat terjadi dalam real time melalui Figma, itu tidak berarti itu selalu harus. Untuk komunikasi yang tidak secara real time komentar sistem datang ke dalam bermain, sehingga setiap anggota tim atau klien dengan pemandangan akses dapat menambahkan umpan balik di posisi apapun di atas kanvas desain.

For communication thats not in real time the comments system comes into playFor communication thats not in real time the comments system comes into playFor communication thats not in real time the comments system comes into play

Ketika meninggalkan komentar, anggota tim lainnya akan melihat peringatan atas ikon komentar pada toolbar, dan Kapan lansiran yang diklik pada sedikit pidato gelembung akan muncul pada halaman. Pada gilirannya, ketika gelembung diklik teks komunikasi panel akan terbuka melalui yang catatan dapat ditukar.

Riwayat Versi

Salah satu layanan pihak ketiga yang tim kolaboratif sering perlu untuk mengkoordinasikan alur kerja mereka adalah beberapa jenis sistem kontrol versi. Dengan Figma ini dibangun tepat di dan semua itu terjadi secara otomatis, dengan versi diselamatkan setiap kali ada suatu periode tidak aktif pada file selama 30 menit, yaitu ketika tak seorang pun sedang mengerjakan berkata file.

Riwayat Versi kembali 30 hari pada tingkat gratis, dan tidak terbatas pada tingkatan yang dibayar.

Untuk melihat Riwayat Versi file, membukanya kemudian tekan v berbentuk link di sebelah kanan nama file pada bagian atas toolbar, dan memilih Tampilkan Riwayat Versi:

Show Version HistoryShow Version HistoryShow Version History

A list of saved versions will appear in the right sidebar:

A list of saved versions will appear in the right sidebarA list of saved versions will appear in the right sidebarA list of saved versions will appear in the right sidebar

Jika Anda klik salah satu item berikut versi file yang terkait akan memuat ke kanvas, item dalam daftar Riwayat Versi akan berubah menjadi biru, dan tiga titik akan muncul di samping itu. Jika Anda mengklik ini tiga titik-titik yang Anda akan mendapatkan di mana Anda dapat mengubah nama menu, mengembalikan atau duplikat versi itu.

a menu through which you can rename restore or duplicate that versiona menu through which you can rename restore or duplicate that versiona menu through which you can rename restore or duplicate that version

Integrasi dengan alat-alat tambahan

Figma telah Anda cukup banyak tertutup pada semua yang Anda butuhkan untuk berkolaborasi dalam ruang desain. Tapi itu juga membantu Anda untuk memperluas pilihan kolaborasi luar proses desain dengan mengintegrasikan dengan berbagai macam alat pihak ketiga.

Kendur

Kendur integrasi adalah titik fokus tertentu bagi Figma, dengan kemampuan untuk mengubah setiap tim kendur yang ada menjadi tim Figma. Anda juga dapat memiliki pemberitahuan dikirim melalui kendur ketika komentar kiri di Figma file.

Dribbble

Figma memiliki kelancaran arus ekspor bingkai dan mendorongnya langsung ke Dribbble.

Zeplin

Figma sudah memiliki alat tangan-off pengembang sendiri, tetapi jika Anda masih membutuhkan atau ingin menggunakan Zeplin pula Figma menyediakan integrasi dengan mudah mengekspor frame menjadi proyek Zeplin.

Dropbox kertas

Figma's integrasi dengan Dropbox bukan untuk tujuan penyimpanan, melainkan itu adalah untuk memungkinkan Anda untuk dengan cepat embed desain ke file-file kertas Dropbox. Kertas adalah dokumen kolaboratif mengedit layanan. Jadi tim Anda juga dapat berkolaborasi pada dokumen, sementara desain Figma yang tertanam di dalamnya update secara real time sebagai perubahan yang dibuat untuk itu.

JIRA dan Trello

Untuk membantu dengan sisi manajemen proyek hal, Figma terintegrasi dengan Jira kedua dan Trello, memungkinkan Anda untuk memiliki hidup yang komprehensif Figma file di dalam masalah / kartu.

Membungkus

Seperti yang Anda lihat, Figma menyediakan array mengesankan fitur untuk membantu antarmuka desainer bekerja sama bersama-sama dan efisien. Beberapa yang umum sakit poin tim berbasis proyek pergi dengan ini terpusat, pendekatan berbasis web.

Dan sebagai mengesankan seperti alat-alat kolaborasi Figma, itu masih hanya sebagian dari apa yang membuatnya menarik dan menarik aplikasi tersebut.

Untuk mempelajari lebih lanjut tentang mengapa Anda harus memberikan Figma berjalan, periksa beberapa tutorial dan kursus lain kami:


Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.