Monday, November 24, 2008

Cara Desain Layout Header

Desain Layout  Header

Iseng-iseng mainan Photoshop, seperti biasa pengen cari yang aneh-aneh di Google. Terus akhirnya sampai pada pencarian akan PSD yang siap download buat ngedit-ngedit header dan navigasinya biar lebih hidup...

Tentu saja hal pertama yang harus dilakukan adalah download PSD-nya. Nah kalo sudah download baru deh bisa di coba kasiatnya.

Mulai...

1. Mulai dengan buka photoshop dan buat new document dengan ukuran 1000×275.

new document

2. Pertama-tama yang harus kita lakukan adalah membuat background buat navigasinya. menggunakan marquee tool, membuat seleksi yang sama pada bawahnya, kemudian mengisinya dengan beberapa warna.

fill color

3.Pada layer tersebut, klik kanan kemudian pilih blending options.

blending options
gradien editor

4. Kemudian, buat seleksi yang sama lagi pada yang berikutnya kemudian isi dengan beberapa warna.

fill color

5. Sekarang masukkan blending options yang berikutnya ke dalam layer yang baru saja dibuat.

blending options
gradien editor

6. Document akan terlihat seperti ini.

current document

7. Kemudian langka selanjutnya membuat tombol sendiri menggunakan bulatan rectangle tool, dengan rasio 35px, diikuti dengan membuat rectangle pada ukuran yang sama.

make button

8. Rasterize layer dengan klik>rasterize, yang diikuti dengan memasukkan blending options.

blending options
gradien editor
layer style

9. Copy tombol layer. Pindahkan di bawah tombol dan gunakan marquee tool fitu untuk membuat refleksi, dan permainkan menggunakan sedikit opacity yang akan terlihat seperti ini:

current document

10. Kemudian dapat dimaskukin juga beberapa teks seperti ini:

add some text

11. Sekarang saatnya mengulang bagian 7 sampe 9 untuk membuat beberapa tombol baru lagi.

repeat step

12. Buat link aktif seperti yang diinginkan. Semua sama kecuali sebagai ganti dari penggunaan bagian gradien 8, akan digunakan seperti ini:

layer style
layer editor

13. Kemudian grab font sesuai pilihan untuk logo. that will be your logo. Sebagai contoh coba pake GE Centurion, dengan diikuti blending options:

layer style
layer editor

14. Akan terlihat seperti ini:

current

15. Terakhir adalah menggunakan beberapa line art dan juga beberapa brush yang lembut sebagai tambahan sedikit lagi pada header, dan inilah akhirnya..

tada...

hasil akhirku

Kalo nyoba sendiri bakal lebih mudeng kok karena ini emang enak buat main-main...

9 comments:

ipung Monday, November 24, 2008 3:29:00 AM PST  

Langsung save dulu.. nanti dibuka lagi kalo uda mudeng photoshop :)

khafi Monday, November 24, 2008 5:30:00 AM PST  

aduh.. kok kalo masalah desain2 gini. .aku jadi maless ya..

hehe

Syamsul Alam Monday, November 24, 2008 6:58:00 AM PST  

Huehuehue... ko ga secara langsung, aku masih bingung... huehuehue............

Ardy Pratama Monday, November 24, 2008 8:53:00 AM PST  

keyeeenn.... save dlu ah, trus prktek! Thanks bgt tutorialx... :)

Taktiku Monday, November 24, 2008 9:53:00 AM PST  

mantap nih save as dulu yah

.: AngeL :. Tuesday, November 25, 2008 8:46:00 PM PST  

hahaha, tetep ga bs bikin header nih meski dah nyontek dari sini

Paman Gober Tuesday, November 25, 2008 8:48:00 PM PST  

wah tutornya manteb neh bro... save as dulu ya

rahma Monday, March 30, 2009 8:13:00 PM PDT  

coba dulu ah...save ah hasil dari tutorialnya

sa2kphonsel Friday, May 15, 2009 10:57:00 PM PDT  

savenya pake extensi jpg ato tetep psd,.?

Post a Comment

U Buzz I Buzz!!

  © Copyright 2007-2012. Fariez TheFachia.com. All rights reserved. TheFachia.com is proudly powered by Blogger.

Back to TOP