Dalam tutorial ini saya akan menunjukkan beberapa teknik yang sangat
mudah, dengan menggunakan gradien dan lapisan gaya, yang bisa kita
gunakan untuk menghasilkan efek 3D yang bagus halus dalam desain web
kami.
Setelah itu, mengubahnya menjadi Cerdas Filter, menerapkan Gaussian Blur dan mengubah opacity menjadi 60%.
Pergi ke Layer> Layer Mask> Reveal All. Menggunakan Gradient Tool, pilih Radial Gradient dari hitam ke putih dan menerapkan masker untuk kelompok kami. Mulai gradien dari pusat kelompok.
Gandakan kelompok dan menempatkannya di bawah link putih, mengubah warna teks hitam dan memindahkan kelompok 1 pixel dan kiri. Itu akan menciptakan efek 3D yang bagus, persis seperti yang kami lakukan dengan garis-garis.
Gandakan layer header dan mengganti nama untuk pola. Pergi ke Layer Styles dan menonaktifkan Gradient Overlay dan menetapkan Overlay Pola. Pilih 'webPattern' kita buat dan mengubah Blend Mode ke Color Overlay.
Setelah itu menerapkan lapisan masker ke lapisan pola menggunakan Gradient Radial.
Pola
Untuk teks, jenis PSDTUTS +, pilih jenis huruf yang berani untuk PSD dan reguler atau cahaya untuk Tuts. Pergi ke Layer Styles dan menerapkan Drop Shadow, Gradient Overlay, dan Stroke. Itu efek yang sangat umum dan indah.
Langkah 1
Buat dokumen baru dengan 1000x750px. Klik pada layer background dan di Color Overlay dan memilih coklat gelap ganda.Langkah 2
Aktifkan penguasa (View> Rulers) pada dokumen Anda dan menambahkan beberapa panduan seperti yang ditunjukkan di bawah ini. Buat 2 panduan horisontal, yang pertama di 30px dan yang kedua pada 250px. Setelah itu tambahkan 2 panduan vertikal di 100px dan 900px.Langkah 3
Buat persegi panjang dengan Rectangle Tool (U). Gunakan panduan untuk referensi. Ubah nama layer ke header.Langkah 4
Pilih hitam untuk warna foreground. Pilih Ellipse Tool dan membuat bentuk yang akan menjadi bayangan. Buatlah sedikit lebih tinggi dari persegi panjang putih seperti yang ditunjukkan. Ubah nama layer untuk bayangan dan meletakkannya di bawah lapisan sundulan.Setelah itu, mengubahnya menjadi Cerdas Filter, menerapkan Gaussian Blur dan mengubah opacity menjadi 60%.
Langkah 5
Dengan lapisan judul yang dipilih, klik dua kali untuk membuka kotak dialog Layer Style. Pilih Gradient Overlay. Mengubah gaya gradien radial. Untuk warna saya menggunakan merah gelap.Langkah 6
Selanjutnya, pilih Line Tool (U) dan memilih warna lebih terang dari gradien header dan membuat garis. Setelah itu pilih hitam dan menciptakan baris lain hanya 1 pixel di atas garis merah. Pilih 2 baris dan kelompok mereka. Ubah nama grup "vDivider".Pergi ke Layer> Layer Mask> Reveal All. Menggunakan Gradient Tool, pilih Radial Gradient dari hitam ke putih dan menerapkan masker untuk kelompok kami. Mulai gradien dari pusat kelompok.
Langkah 7
Buat menu menggunakan Horizontal Type Tool (T). Gunakan putih untuk warna teks. Pilih semua link dan kelompok mereka. Ubah nama grup Putih Links.Gandakan kelompok dan menempatkannya di bawah link putih, mengubah warna teks hitam dan memindahkan kelompok 1 pixel dan kiri. Itu akan menciptakan efek 3D yang bagus, persis seperti yang kami lakukan dengan garis-garis.
Langkah 8
Ulangi Langkah 6, tapi kali ini membuat pembagi horisontal untuk link. Gunakan alat garis untuk menggambar garis merah dan 1 pixel ke kiri menarik garis hitam. Kelompok mereka dan menduplikasi kelompok 5 kali. Mendistribusikan kelompok seperti yang ditunjukkan di bawah ini.Langkah 9
Pilih semua kelompok garis dan kelompok mereka. Mengubah nama grup seperti Pembagi. Setelah itu oleskan masker lapisan, Layer> Layer Mask> Reveal All. Tapi kali ini menggunakan Linear.Langkah 10
Buka file pola, atau mendapatkan pola yang Anda suka. Pilih semua dan pergi ke Edit> Define Pattern. Sebut saja webPattern.Gandakan layer header dan mengganti nama untuk pola. Pergi ke Layer Styles dan menonaktifkan Gradient Overlay dan menetapkan Overlay Pola. Pilih 'webPattern' kita buat dan mengubah Blend Mode ke Color Overlay.
Setelah itu menerapkan lapisan masker ke lapisan pola menggunakan Gradient Radial.
Pola
Langkah 11
Sekarang kita dapat menambahkan logo dan sendok.Untuk teks, jenis PSDTUTS +, pilih jenis huruf yang berani untuk PSD dan reguler atau cahaya untuk Tuts. Pergi ke Layer Styles dan menerapkan Drop Shadow, Gradient Overlay, dan Stroke. Itu efek yang sangat umum dan indah.
Kesimpulan
Ketika kita bekerja dengan desain web kita harus mempertimbangkan ukuran file, kompatibilitas browser yang dan banyak masalah lainnya. Terkadang detail-detail kecil seperti gradien halus atau perbatasan menggunakan 2 warna dapat menciptakan efek visual yang sangat bagus atau gaya yang unik tanpa memerlukan banyak hacks dan penyesuaian.
Tidak ada komentar:
Posting Komentar