Membuat Toolbar & Tombol Model Vista untuk Menu Blog


Kalau dilihat, trend vista sudah menjamur dan pada beberapa website/blog banyak yang memodifikasi tampilannya menggunakan model baru ini. Artikel kali ini akan menjelaskan step by step cara membuat toolbar dan tombol model Vista. aplikasi yang dipergunakan adalah Adobe Photoshop


1. Toolbar




Perhatikan gambar toolbar diatas, untuk membuatnya :
a. Buat dokumen baru dengan ukuran lebar 100px dan tinggi 40px (atau lebih kecil)
b. Gunakan "Ractangle Tool" untuk menggambar pada semua bidang gambar.

c. Pada bagian "Layers" aktifkan "Blending Options" atau pada menu pilih "Layer > Layer Style > Gradient Overlay", klik no.1 kemudian klik no. 2


d. Teknik menampilkan gambar seperti efek Vista, gunakan warna yang tajam dan untuk warna bagian lainnya gunakan warna yang sama tetapi lebih terang. lihat "Gradient editor" seperti dibawah ini :


e. Pada gambar diatas, gunakan slider (no. 1, 2 dan 3) untuk mengatur posisi warna pada toolbar

Nah.., untuk tempat tombol (toolbar) sudah selesai..., untuk membuat tombolnya gunakan cara yang sama sesuai selera

2. Tombol Lingkaran
Untuk membuat tombol lingkaran caranya hampir sama dengan diatas, tetapi menggunakan object lingkaran dan "Gradient Style" yang dipilih adalah "Radial" sedangkan bentuk persegi adalah "Linear", lihat tutorial dibawah ini.

a. Buat lingkaran seperti dibawah ini :

b. Tambahkan lingkaran baru yang lebih kecil hingga menjadi seperti dibawah ini :



c. Gunakan "Gradient Tool" untuk memberi warna pada lingkaran kedua ini, jangan lupa
gradient style yang dipilih adalah "Linear" dengan pilihan warna atas cenderung putih dan warna bagian bawah usahakan hampir sama persis dengan warna tengah lingkaran yang pertama, setelah itu klik "ok"

d. Aktifkan "Blending options" pada lingkaran pertama kemudian atur "Opacity" untuk memperoleh nilai transparansi, dan sesuaikan sesuai dengan efek yang dipilih.




lihat hasilnya seperti dibawah ini :


Selamat mencoba..., (ngga bakalan bisa kalo ngga dicoba...!!)

1 komentar: