Cara Membuat Ikon Tombol yang Menarik Menggunakan Adobe Illustrator CC 2018


Menurut  laman Stock Photo Doesn't Suck terdapat 3 jenis ikon yang pokok:
  • Universal Icons. Singkatnya ikon yang sudah banyak dikenal orang. Misalnya: ikon rumah, surat, dan keranjang belanja adalah ikon yang banyak orang kenal.
  • Conflicting Icons. Ikon yang memiliki makna yang saling bertentangan. Ambil contoh ikon hamburger untuk navigasi. Sebagian besar UI designer menggunakannya sebagai scrollable overlay, tetapi yang lain menggunakannya untuk mewakili daftar. Ikon yang bertentangan membingungkan pengguna dengan artinya yang berbeda.
  • Unique Icons. Ikon yang unik. Ikon unik berfungsi di luar tindakan standar, seperti contohnya sharing dan prnting. Banyak desainer gagal dalam membuat ikon dalam kategori ini karena jenis ikon ini biasanya sulit dikenali 
Tutorial di bawah ini merupakan langkah-langkah bagaimana membuat ikon yang universal. Berhubung keyboard laptop saya rusak, jadi gambar penjelasnya saya foto pakai ponsel,mudah-mudahan masih dapat teman-teman pahami.

1. Buat lembar baru di Adobe Illustrator CC 2018 dengan ukuran 3000 x 3000 px. Kemudian buat lingkaran dengan cara klik Ellipse Tool, klik di lembar kosong kemudian tahan sembari tekan tombol Shift di keyboard supaya lingkaran yang dihasilkan simetris.


2. Beri warna lingkaran secara gradient. Caranya dengan klik Gradient di  sisi kanan. Ingat, selalu atur warna gradient beranngsur-angur ke warna yang menyerupainya. Jangan warna merah tiba-tiba jadi hijau.  Saya memakai warna #FF2FA, #FF45D2, dan #B4219D. Hasilnya bisa dilihat di bawah.



3. Kemudian buat lingkaran dengan warna gradient. Caranya hampir sama dengan cara nomor dua, namun rubah warnanya menjadi putih yang berangsur-angsur menghilang. Cara membuat warna yang berangsur menghilang ini dengan cara beri warna putih pada salah satu pin gradient dan pada salah satu pin rubah opacity-nya menjadi 0%.


Buat lingkaran lagi yang lebih kecil, ulangi dengan langkah yang sama.


Buat lingkaran lagi dan letakkan di bagian tengah agak bawah. Beri efek gradient. Beri warna #B8B03B. Atur opacity menjadi 49% dan beri efek Screen.




4. Maka hasilnya akan seperti ini. Lalu, buat ikon searching dengan memanfaatkan Ellipse Tool dan Rectangle Tool untuk yang ini memang perlu beberapa kali latihan. Hasil akhirnya bisa dilihat di gambar paling bawah.


Hasil akhir:

 Bila ada pertanyaan bisa langsung komentar di bawah atau e-mail dinasectio@gmail.com.

Post a Comment

0 Comments