Design Web 2 Style.

Ada banyak macam cara bikin web 2 style ini.. saya coba bikin cara yang sederhana yaa..

Pokoknya maknyuss pemirsa.. hehehe…

pertama buat dokumen baru :

Bikin shape dengan rounded marque tool

Klik kanan kotaknya lalu klik make selection. abis gitu klik New layer .. 

Warnain pake item.. pake Brush aja..

klik kanan layer 1 , klik blending Option.. terus contreng gradient overlay setting seperti dibawh :

Jangan dulu di OK in… setting Stroke nya juga seperti dibawah :

Tetep jangan di OK in… Lalu Settung eh.. setting inner glow nya, tetepp.. seperti dibawah :

Nah boleh deh tuh.. di OK in ..

Terus Bikin kotak kecil di dalemnya pake rounded rectangle tool .. cara bikin nya seperti, bikin kotak yang gede yaa… masa lupa sih… bisa kan yaa..

lalu klik new layer lagi , terus klik Quick layer mask seperti gambar di atas.

Tarik gradient dari atas ke bawah.. setting seperti gambar di bawah yaa..

Jadi deh… kasih tulisan ditengah nya.. tulisan apa aja… mau nama kamu, nenek kamu, ibu kamu, terserah deh pokoknya.. hehehe..  jadinya kayak gini nih :

keren kan boss… ?

kalo mau berwarna … Tinggal klik kanan layer 1 , klik blending option.. klik gradient overlay..

warnain deh tuh.. saya coba kasih warna ijo yaa..

Ok.. Ok in..

hasilnya gini nih..

Selamat mencoba…

15 Responses to “Design Web 2 Style.”

1. arissuryana says:

   June 24, 2008 at 7:14 am

   good…good…good…
2. Mades Rosanda says:

   June 24, 2008 at 5:25 pm

   bagus mas!! tapi tolong lebih banyak lagi ya tutorialnya!!!he he he
3. andre says:

   June 26, 2008 at 11:39 pm

   kali ini lu ga kreatif bro!!

   jelek!!

   biasa ajah….
4. Sigit eko says:

   July 1, 2008 at 4:46 am

   maaf yaa mas andre..
5. ginna says:

   July 1, 2008 at 9:08 am

   wah Mas Sigit jangan patah semangat, buat pemula yang kuaatrroo berat kaya akyu, tips-tipsnya membantu sekali.. ayo buat lagi ya.. terima kasih banyak sudah mau berbagi
6. denny says:

   July 14, 2008 at 9:20 am

   mas,.,.
   klu bkin web pake potoshop gmn she cra’a.,.
   blz ke email saya adja ya,.,.
   pnrb_deny@yahoo.com
   tararengQyu
7. flug,. says:

   July 14, 2008 at 9:25 am

   huy bung andre,..,
   klu anda mang kreatip ,.,.
   tunjukin dung hasil karya anda ,.,.
   jngn cma bsa ngatain duaex,,.,.,.
8. riyanto says:

   July 16, 2008 at 6:10 am

   Gimana dong design wallpaper pake photoshop 7? Aq masih bingung neeh..
9. desman says:

   October 15, 2008 at 5:14 am

   apapun ceritanya mau biasa aja kek hasilnya tetapi yg terpenting…tutorial ini sangat berharga terlebih lagi gw sebagai pemula….

   keep posting mas
10. cuex says:

    October 20, 2008 at 1:29 pm

    mas niy yang dipakai dalam contoh photoshop Cs 3 ya ko tampilannya beda dengan photoshop yang Ver.6 heheheheh sorry namanya juga baru belajar dan palainya juga photoshop lama
11. 4me says:

    February 11, 2009 at 7:57 am

    mas,,,mau request donk..
    bikin tutor design template ala web 2.0, haduh aku newbie banget neh… *penasaran modeON

    thx b4
12. ruddy says:

    February 20, 2009 at 6:32 pm

    wah mas.. tutorialnya cuantikkk… and pls hargai karya orang.. wong gratisan aja.. keep terus bro…
13. shooGiE says:

    April 11, 2009 at 4:17 am

    Mas Sigit bagus mas tutorialnya, itung2 belajar buat website kan butuh tutorial yang kayak ginian. Kalo bisa sih tambahin lagi yg banyak mas tutorial yg kayak gini cos masih katroxxx banget nih pakai photoshop.

    Maju terus dan buat tutorial lagi yang banyak…
14. reef says:

    June 7, 2009 at 5:16 am

    mz minta tolong dong kirimin tutorial untuk bikin web lengkap dari awal sampai selesai. coz aku dah bener bener bingung n gak ngerti wktu lihat trik2 buat web yang lain. aku otodidak maz, pliz ya kirimin…!! semoga karyanya terus tetap berkembang dan bermanfaat
15. vivi says:

    April 3, 2010 at 11:38 am

    langsung bisa hehe….ciiipppp