Skip to content Skip to sidebar Skip to footer

Widget HTML #1

Gambar Produk 1
Jasa Desain Kaos, Desain Batik, Setting Sablon Kaos dan Desain Grafis Lainnya

CARA MEMBUAT DESAIN LAYOUT WEB SEDERHANA DENGAN PHOTOSHOP

cara-membuat-desain-layout-web-sederhana-dengan-photoshop
CARA MEMBUAT DESAIN LAYOUT WEB SEDERHANA DENGAN PHOTOSHOP  cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Memiliki Desain Layout Website yang keren dan unik tentu bagi para pelaku webmaster dan para pembuat web online  menjadi suatu keberhasilan dalam menhadirkan situs web yang menarik. Desain layout web sederhana bisa menampilkan desain logo perusahaan sendiri ditambah efek 3d dengan  logo icon favicon yang manarik.


Sobat bisa membuat sendiri desain layout web sederhana dengan cara menggunakan adobe photoshop. Kali ini admin studio desain akan memberikan tutorial photoshop bagaimana cara membuat desain layout web sederhana dengan photoshop.  

Berikut adalah langkah-langkah cara membuat layout web sederhana namun efektif kontemporer untuk Studio Desain Sobat. Pada kesempatan ini admin menggunakan photoshop CS3, sobat bisa memakai adobe photoshop CS4, CS5, CS6, CS7

Buka file baru memiliki 555 × 671 px dan 72 dpi, kemudian cat dalam kode ini warna yang ditunjukkan ini:586.168.



cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Pilih setelah itu instrumen berikut dan membuat bagian dari panel situs terendah ini:


cara-membuat-desain-layout-web-sederhana-dengan-photoshop

 Blending Options-Gradient Overlay



cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Gradient ini parameter:



cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Memilih instrumen yang sama, itu mungkin untuk membuat panel situs terendah dalam 3 tahap.
Pada tahap pertama kita akan membuat elemen pertama (memperbaiki sudut dengan instrumen ditampilkan di sini ).

Tahap kedua meliputi menekan tombol Shift dan melakukan sisa pekerjaan.
Pada tahap ketiga tetap menekan tombol Alt dan menghapus tengah gambar.


cara-membuat-desain-layout-web-sederhana-dengan-photoshop




cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-Drop Shadow



cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Blending Options-Gradient Overlay


cara-membuat-desain-layout-web-sederhana-dengan-photoshop



Gradient ini parameter:


cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Ambil alat berikutnya dan mewakili garis vertikal membagi, berwarna 464F56.


cara-membuat-desain-layout-web-sederhana-dengan-photoshop

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-Warna Tampilan

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-Stroke
cara-membuat-desain-layout-web-sederhana-dengan-photoshop



Membuat lima salinan dari lapisan ini dibuat baru dan tempat segala cara yang terlihat dalam gambar berikutnya.
cara-membuat-desain-layout-web-sederhana-dengan-photoshop



Kemudian mengambil instrumen berikut dan menciptakan lapisan terendah dari bagian situs pusat.

cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Jangan lupa untuk menempatkan dengan benar semua lapisan, persis seperti yang ditampilkan di sini:
Blending Options-Drop Shadow

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-Gradient Overlay

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Gradient ini parameter:

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Ambil instrumen sebelumnya untuk menciptakan waktu ini unsur header situs:

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-Outer Cahaya
cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-Gradient Overlay

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Gradient ini parameter:
cara-membuat-desain-layout-web-sederhana-dengan-photoshop



Memanfaatkan alat berikutnya untuk menarik satu elemen lebih dicadangkan untuk header situs:

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-batin Bayangan

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-batin Cahaya

cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Memadukan Pilihan-Bevel dan Emboss

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-Gradient Overlay

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Gradient ini parameter:
cara-membuat-desain-layout-web-sederhana-dengan-photoshop



Membuat tiga salinan dari lapisan yang dibuat baru dan menempatkan semua salinan cara itu ditunjukkan di bawah ini:

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Kemudian kita harus mewakili header situs dalam beberapa tahap, metode yang kita gunakan sebelumnya.
Instrumen utama adalah yang satu ini: .

Memperbaiki sudut dengan alat berikutnya dan bukaan dapat dipotong dengan menekan tombol Alt.



cara-membuat-desain-layout-web-sederhana-dengan-photoshop


cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Blending Options-Drop Shadow


cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-batin Cahaya

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-Gradient Overlay


cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Gradient ini parameter:
cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Menggunakan alat berikutnya sekarang , Mungkin untuk menggambar garis tipis di atas tengah header:

cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Blending Options-Gradient Overlay


cara-membuat-desain-layout-web-sederhana-dengan-photoshop



Gradient ini parameter:


cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Ambil alat ditunjukkan sekarang dan merupakan garis horizontal warna hitam.


cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Sekarang kita harus mewakili garis vertikal beberapa di header dengan cara yang sama kami mewakili mereka di panel situs terendah (atau mereka mungkin hanya disalin).


cara-membuat-desain-layout-web-sederhana-dengan-photoshop


Menggunakan instrumen ditampilkan di sini , Menggambar garis membagi pada panel tombol menu ini.


cara-membuat-desain-layout-web-sederhana-dengan-photoshop


cara-membuat-desain-layout-web-sederhana-dengan-photoshop



Blending Options-Gradient Overlay



Gradient ini parameter:



Buatlah dua salinan layer dibuat baru dan menempatkan mereka dengan cara yang mungkin Anda lihat dalam gambar yang ditampilkan berikutnya.


Pilih berikutnya tool berikut untuk mewakili lapisan kedalaman pada bagian atas tombol.





Isi 0% pada lapisan.
Blending Options-Gradient Overlay



Gradient ini parameter:



Ambil instrumen yang sama dan mewakili satu lapisan lagi pada satu baru dibuat.




Blending Options-Drop Shadow



Blending Options-Gradient Overlay



Gradient ini parameter:



Untuk kenyamanan kita, kita harus menggabungkan ke dalam kelompok semua lapisan, yang berisi kedalaman bagian atas dengan pengaturan biru. Kemudian membuat tiga salinan dari kelompok ini dibuat baru.


Ambil instrumen berikutnya dan membuat satu lapisan lagi pada bagian situs pusat




Blending Options-batin Cahaya



Blending Options-Gradient Overlay



Gradient ini parameter:



Isi bagian tengah situs dengan teks yang ditampilkan berikutnya, menjaga tuntutan dari tabel di bawah ini:






Masukkan sekarang dengan foto berlawanan setiap paragraf.


Parameter yang sama untuk semua foto.
Blending Options-Stroke



Menulis sekarang nama situs, menjadi perhatian dengan tuntutan dimasukkan dalam tabel berikut:




(Studio)



Parameter dari kata Desain:
Blending Options-Outer Cahaya



Memadukan Pilihan-Bevel dan Emboss



Blending Options-Warna Tampilan


Parameter untuk kata Studio:
Blending Options-Drop Shadow



Perkenalkan sekarang judul untuk tombol menu yang terletak di header situs:





Ambil instrumen berikutnya dan mencoba untuk mewakili garis kontinu terbentuk dari titik-titik beberapa:



Buat salinan dari layer yang dibuat baru dan menempatkannya cara itu ditampilkan di sini:



Fitur terakhir ini meliputi menggambar garis pada tombol menu situs ini, dilakukan dengan instrumen dari sini :






Blending Options-Gradient Overlay




Gradient ini parameter:


Hasil Akhir
cara-membuat-desain-layout-web-sederhana-dengan-photoshop

Demikian tutorial photoshop :  cara membuat desain layout web sederhana dengan photoshop
selamat mencoba !!

related post