Cara Mudah Memasukkan Icon Gratis di Adobe XD

Facebook
Twitter
LinkedIn

Icon telah menjadi bagian penting dalam sebuah UI design. Selain dengan teks, aplikasi bisa berkomunikasi dengan pengguna melalui icon. Dengan icon yang sesuai, pengguna dapat memahami apa yang harus mereka lakukan di dalam sebuah aplikasi. Desainer yang baik dapat dengan cerdas memilih icon yang sesuai dengan kegiatan yang terjadi di dalam aplikasi.

Berberapa desainer UI yang juga merupakan desainer icon dapat dengan mudah membuat icon – icon yang sesuai dengan kebutuhan dari aplikasi. Namun jika kamu bukan seorang desainer icon, kamu tidak perlu khawatir. Ada banyak penyedia icon yang berbayar seperti Font Awesome, atau The Noun Project dan penyedia icon gratis seperti Material Icon, Feather Icon dan Ionicon.

Untuk pengguna Adobe XD, kamu dapat dengan mudah menemukan dan mengimpor icon secara gratis melalui plugin Icons 4 Design yang tersedia di dalam Adobe XD Market. Berikut cara – cara penggunaan dan penerapan plugin ini di dalam sebuah desain UI.

Baca Juga – Cara Aku Dapetin Transferan Dollar tiap Bulan dari Desain Icon Hitam Putih

Ayo Mulai !

Sebagai contoh aku akan membuat sebuah desain UI low fidelity dengan ukuran artboard iPhone. Hanya sebagai contoh.

Jika kamu belum menginstal plugin Icons 4 Design, silahkan buka menu plugin di pojok kiri paling bawah dari tampilan Adobe XD – mu.

menu plugin ada di pojok kiri paling bawah dari tampilan adobe XD

Setelah tab plugin terbuka, kamu bisa menambahkan plugin baru dengan menekan tombol + pada tab plugin.

Jendela Adobe XD Market akan terbuka. Disini kamu bisa menemukan berbagai macam plugin untuk keperluan desain kamu.

Selanjutnya tekan icon 🔍 pada Adobe XD Market, lalu cari Icons 4 Design

tekan icon 🔍 pada Adobe XD Market
cari Icons 4 Design

Klik plugin Icons 4 Design, lalu install plugin tersebut. Tunggu berberapa saat hingga plugin selesai diinstal.

Klik plugin Icons 4 Design
install plugin Icons 4 Design

Memasukkan Icon ke Design

Pada menu Plugin, buka plugin Icons 4 Design.

masukkan keyword icon yang akan kamu masukkan, lalu masukkan ukuran dari icon di input sebelahnya.

Klik untuk memilih icon yang akan kamu masukkan, lalu sesuaikan dengan desain yang kamu buat!


Itulah cara untuk mengimpor icon ke dalam Adobe XD. Cukup mudah bukan dengan plugin yang satu ini?

Baca Juga:

Muhammad Fajar Estu
Muhammad Fajar Estu
Fajar adalah seorang fullstack programmer yang sekarang bekerja sebagai .NET programmer. Memiliki pengalaman selama 3+ tahun di bidang programming web, mobile, API hingga aplikasi computer vision. Sekarang Fajar menulis artikel tutorial dan berbagi seputar dunia perkuliahan IT.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *