Desain tab Web 2.0 dengan Photoshop
Panduan ikuti di bawah ini mencoba memberi Anda ide bagaimana merancang menu tab keren di Photoshop, gaya Web 2.0.
Langkah 1
Buat kanvas baru dengan latar belakang putih [#ffffff] pada ukuran apa pun yang Anda suka, sebaiknya persegi panjang; mereka lebih cocok untuk menggambar tab. Kemudian beralih ke Tab Saluran (Windows -> Saluran), klik Buat saluran baru di kanan bawah.
Langkah 2
Pada layer saluran yang dipilih, gambarkan bentuk yang mirip dengan alat Polygonal Lasso. Isi dengan warna putih [#ffffff]; batalkan pilihan wilayah Polygonal (pilih alat Marquee dan tekan satu layar); berikan bentuknya Gaussian Blur dengan radius 6.0px.
Langkah 3
CTRL-L untuk memanggil Level Dialog dan tekan panah kiri dan kanan untuk memenuhi panah tengah, seperti gambar di atas. Ini akan “halus” bentuk buram Anda ke atas dan memberi Anda bentuk sudut bulat yang bagus.
Langkah 4
Di Tab Saluran, Tahan CTRL, klik Thumbnail Saluran dari layer Alpha 1. Bentuk baru sekarang akan dipilih, kembali ke Tab Layers, Buat Layer Baru dan isi area yang dipilih dengan hitam [# 000000].
Langkah 5
Hapus sudut bulat untuk bot bawah kiri dan kanan bawah, gerakkan ke arah kiri dan posisikan seperti diilustrasikan di atas. Selanjutnya kita akan fokus pada Tab warna hitam.
Memegang CTRL, klik pada tab Thumbnail Lapisan untuk mendapatkan seluruh gambar tab yang disorot. | |
Dengan gambar tab masih disorot, pilih Alat Rectangular Marquee, memegang ALT dan gambar persegi panjang wilayah yang ingin kita hapus. | |
Anda hanya akan melihat bagian atas yang dipilih. Memilih -> Memodifikasi -> Kontrak, Kontrak dengan 2px dan Anda harus mendapatkan sesuatu seperti gambar di sebelah kiri. | |
Buat layer baru, isi wilayah yang disorot dengan warna putih [#ffffff]. Klik kanan, pilih Opsi Blending kemudian Hamparan Gradiant. Ganti pemberhentian warna putih [#ffffff] dengan abu-abu [# 616161]. Tab Anda akan terlihat seperti gambar di sebelah kiri. |
Langkah 6
Buat layer baru; Memilih Alat persegi panjang bulat (Radius 8px), gambar persegi panjang dan letakkan layer ini di belakang layer tab hitam. Klik kanan dan pilih Opsi Blending dan masukkan pengaturan berikut.
Drop Shadow
- Opacity: 31%
- Jarak: 0px
- Spread: 0%
- Ukuran: 2px
Bevel dan Emboss
- Kedalaman: 100%
- Ukuran: 0px
- Lembutkan: 0px
Hamparan Gradiant
- Berikut adalah pengaturan Color stops.
- Warna: #aaaaaa, Lokasi: 0%
- Warna: #ffffff, Lokasi 100%
Langkah 7
Masukkan beberapa teks untuk melihat tampilan web 2.0 secara keseluruhan. Saya menggunakan font Lucida Fax, ukuran font 32pt dan 25pt. Dan tab Anda selesai! Jangan ragu untuk bermain-main dengan kombinasi warna Tab.
Unduh tutorial