Seluruh proses pembuatan halaman web komersial dengan Photoshop

Penulis: Brother Mouse

Hari ini saya akan menunjukkan kepada Anda proses pembuatan halaman web komersial. Teman-teman yang mengetahui halaman web harus mengetahui pentingnya Photoshop dalam proses ini, karena ini adalah dasar dari produksi halaman web. Oleh karena itu penulis telah menyiapkan kumpulan tutorial ini. Tujuannya agar teman-teman pemula dapat lebih memahami proses produksinya. Kedepannya saya akan mempersiapkan lebih banyak lagi dibandingkan dengan album promosi, poster kesejahteraan masyarakat, dll ., proses produksi. Mari kita mulai sekarang!

Mari kita lihat rendering terakhirnya terlebih dahulu:

rendering

Gambar (1) Pertama pilih File>Baru (CTRL+N) dan atur parameter di kotak dialog. Seperti yang ditunjukkan pada Gambar 1.

Tetapkan parameter

Gambar (2) Buat layer baru Sekarang mulailah dengan background. Pertama atur warna gradiennya (disini saya menggunakan warna merah dan hitam sebagai warna background. Warnanya bisa diatur sesuai keinginan Anda.) Tahan shift+ mouse pada gambar Klik kiri untuk meregangkan ke bawah dalam garis lurus. Seperti yang ditunjukkan pada Gambar 2 dan 3. +

Editor Gradien

Diagram efek gradien

Gambar (3) Setelah mengatur warna latar belakang, gunakan alat burn dan dodge (tombol pintasan o) untuk mengeditnya agar memberikan kesan bertekstur. Seperti yang ditunjukkan pada Gambar 4 dan 5.

Sedikit terasa seperti kain

Alat Bakar dan Hindari

Gambar (4) Setelah menggunakan alat tenda (tombol pintasan m) untuk memilih rentang yang sesuai di sudut kanan atas, tahan ctrl+j untuk menyalin lapisan terpisah. Mengedit gayanya. Seperti yang ditunjukkan pada Gambar 6 dan 7.

Tahan ctrl+j untuk menyalin layer satu per satu

Mengedit gaya lapisan

Gambar (5) Pilih layer 2, gunakan metode yang sama seperti di atas, pilih rentang yang sesuai, dan tahan ctrl+j untuk menyalin layer terpisah. Mengedit gayanya. Seperti yang ditunjukkan pada Gambar 8.

Pilih rentang yang sesuai

Gambar (6) Selanjutnya, kita perlu mulai menggelapkan dan menghindari lapisan yang baru saja dipilih dan diedit bingkainya. Pertama pilih layer 3, seperti yang ditunjukkan pada Gambar 9, lalu pilih layer 4 setelah diedit, seperti yang ditunjukkan pada Gambar 10.

Melakukan proses penggelapan dan pencerahan

Gambar (7) Buat Gambar baru 5. Sekarang modifikasi gambar dan gunakan alat marquee untuk memilih rentang yang sesuai, seperti yang ditunjukkan pada Gambar (11) Isi R:255 G:2 B:252. Klik dua kali layer 5 untuk mengedit gaya. Seperti yang ditunjukkan pada Gambar (12). Sesuaikan transparansi lapisan ini menjadi 40%. Seperti yang ditunjukkan pada Gambar (13)

Gunakan alat tenda untuk memilih rentang yang sesuai

Pengeditan gaya lapisan

Transparansi lapisan

(8) Buat layer baru, pilih rentang dan isi dengan R:255 G:2 B:252.Edit gaya seperti yang ditunjukkan pada (14) dan sesuaikan transparansi lapisan ini ke 0.

Pengeditan gaya lapisan

Gambar (9) Sekarang kita masukkan teksnya, (Anda juga dapat memikirkan nama yang Anda suka.) Saya akan memberi nama halaman web Heitongdiba, dan memasukkan beberapa font yang sesuai. Seperti yang ditunjukkan pada Gambar (15).

Ketik teks

Gambar (10) Oke, sekarang kita perlu mengolah font, memodifikasi tema pupil hitam, klik dua kali layer untuk mengeditnya sesuai gaya, seperti yang ditunjukkan pada (16), sesuaikan transparansi layer ini ke 0.

Proses font

Gambar (11) Temukan beberapa gambar yang terkait dan masukkan (tetapi harus sesuai dengan tema yang Anda berikan, jangan hanya mencari beberapa gambar.), lalu letakkan gambar tersebut dalam gaya untuk diedit. Seperti yang ditunjukkan pada gambar (17)

Jika

layer style

Tambahkan beberapa modifikasi kecil

Selesai! Mari kita lihat hasil akhirnya.

efek akhir

Setelah halaman web selesai dibuat, sebenarnya sangat mudah. ​​Pemula dapat menggunakan metode sederhana ini untuk mencoba membuat halaman web mereka sendiri. Desain apa pun tidak harus memiliki banyak efek untuk menjadi bagus. Terkadang kesederhanaan juga merupakan salah satu keindahan. Jika Anda memiliki pendapat berbeda dalam tutorial ini, saya harap Anda dapat berkomunikasi dengan saya.