Contoh Tutorial design Web Komunitas menggunakan aplikasi photoshop

Assalamualikum Wr.Wb, disini saya akan membuat contoh tutorial design web komunitas, oke langsung saja gan kita mulai, pertama-tama agan buka aplikasi photoshop, disini saya menggunakan aplikasi photoshop cs6 dan saya akan membuat desig web untuk komunitas reptil, oke gan setalah agan buka aplikasi photoshop agan, agan langsung saja ke menu bar pilih File-New(Ctrl N) untuk membuat layer, spesifikasi layernya seperti Gamabr 1.

Gambar 1.

Klik ok pada Gamabr 1, maka layer akan terlihat seperti di Gambar 2, selanjutnya saya akan merubah layer background menjadi layer dengan gamabar hutan, untuk mengambil gambar pilih menu bar File-Open(Ctrl O), lalu ambil gambar di laptop atau PC agan, maka tampilan akan terlihat seperti di Gambar 3, drag layer gambar hutan ke layer pertama dengan cara membuka dahulu icon gembok yg ada di bawah kanan di Gambar 3, lalu pilih Move Tool(V) dan drag ke layer background, lalu atur posisi dengan menakan CTRL T seperti Gambar 4.

                                                                 Gambar 2.

                                    Gamabr 3.                                                           Gambar 4.

Setalah layer hutan sudah diatur posisinya maka layer akan terlihat seperti Gambar 5, lalu berikan efek gradient supaya layer terlihat lebih gelap dengan menggunakan Gradient Tool tapi sebelumnya harus di sleksi menggunakan Rectangular Marquee Tool lalu drag dari setiap sisi layer maka layer akan terlihat seperti Gambar 7.

                                   Gambar 5                                                           Gambar 6

                                                                    Gambar 7.

Selanjutnya saya akan mebuat text dengan tulisan Komunitas Reptil, langsung saja untuk membuat text agan pilih Horizontal Type Tool, dan ketik dilayer hutan, disini saya menggunakan font "Century Schoolbook" dan saya akan memberik style pada text dengan memlih style stroke maka hasilnmya seperti Gambar 9.

                                 Gambar 8                                                             Gambar 9.

Lanjut gaaan, sekarang kita buat layer navigation dengan link-link bertulisan:Home,About,Galery dan Informasi, saya buat dengan sesederhana mungkin hanya dengan text saja tapi kalo agan punya kreasi lain pun tidak apa-apa, layer navigantion yang saya buat sepeti di Gambar 10.

                                                                        Gambar 10

Selanjutnya membuat layer konten dengan menggunakan Rectangle Tool dan letakan layer konten di bawah layer-layer navigation, di layer konten saya memberikan style Stroke maka layer konten akan terlihat seprti Gambar 11.

                                                                           Gambar 11.

dan isi layer konten dengan jenis-jenis dan keterangan hewan reptil, gambar saya dapatkan dari google. maka hasil isi konten seperti Gambar 12.

                                                                       Gambar 12.

maka hasil design web komunitas reptil pun sudah selesai, terima kasih semoga bermanfaat. Wassalamualikum Wr. Wb,........