Joomla Indonesia

Login or Sign Up
Sign In or Register
Avatar
Not Registered Yet?

Join Now! It's FREE. Get full access and benefit from this site

Reset My password - Remind Me My username

Username
Password
Remember me
  • Home
    Home This is where you can find all the blog posts throughout the site.
  • Categories
    Categories Displays a list of categories from this blog.
  • Tags
    Tags Displays a list of tags that have been used in the blog.
  • Bloggers
    Bloggers Search for your favorite blogger from this site.
  • Team Blogs
    Team Blogs Find your favorite team blogs here.
  • Login
    Login Login form

Desain Webstyle 2.0 yang populer

Posted by on in Tip Dan Trik
  • Font size: Larger Smaller
  • Hits: 12641
  • 6 Comments
  • Subscribe to this entry
  • Print
Sekarang Web 2.0 style menjadi populer di mana-mana, tiap situs-situs baru yang kita lihat memiliki tipikal yang simple, cerah dan mengkilat. Tidak ada standar untuk membuat elemen-elemen Web 2.0 tapi ada beberapa fitur yang umum seperti warna yang bersih dan gradiasi.
Saat ini saya akan tunjukan bagaimana membuat tombol WebStyle 2.0
dengan menggunakan Photoshop CS2.

Langkah-langkahnya adalah sebagai berikut :

Buka Photoshop dan buat dokumen baru untuk tombol.

Buat bentuk tombol pada layer baru dengan menggunakan Rounded Rectangle Tool pada toolbar atau tombol keyboard 'U', tentukan radius lengkungannya (mis 15px) dan pilih warna yang diinginkan. Beri nama layer tersebut "Button"

  

Klik kanan mouse pada rectangle layer di layers palette, pilih Blending Options

Set parameter Gradient Overlay effect, contohnya warna untuk first dan second thumb #434343, third thumb #000000.

 Pada Stroke Effect, pilih warna dengan parameter #363636

  

Set opsi Inner Glow Effect 

  

Hasil yang akan didapat adalah sebagai berikut :

Buat kotak lagi pada layer baru dengan Rounded Rectangle Tool yang akan digunakan sebagai efek kilat pada tombol, beri nama pada layer "glare" dan letakkan di atas kotak tombol (layer "Button") yang telah kita buat.

  

Klik kanan pada layer "glare" dan pilih Rasterize Layer.

Klik Edit in Quick Mask Mode di toolbar atau tekan tombol keyboard 'Q'.

Pilih Gradient Tool ('G') buat gradiasi seperti gambar ini :

  

 Keluar dari  Edit in Quick Mask Mode di toolbar atau tekan tombol keyboard 'Q', akan ada garis-garis seleksi di situ kemudian tekan 'delete' pada keyboard.

  

Buat text pada layer dengan isi "Entries RSS" dan tambahkan icon RSS, set parameter efek Drop Shadow seperti ini :

  

Setelah itu kita dapat melihat hasilnya seperti ini :

  

Setelah merubah parameter pada efek-efek tadi dan juga menambahkan serta merubah beberapa elemen maka tombol kita dapat menjadi seperti ini :

 




File sumber PSD dapat diambil dengan meng-klik gambar tombol-tombol di atas, atau jika tidak ingin repot dengan hal-hal di atas,silahkan gunakan file style untuk Photoshop CS2 di sini.

 Selamat berkreasi dan salam. 

 

 

 

0

People in this conversation

Kategori Blog

Joomla User Group Indonesia

Joomla User Group indonesia

Id-joomla.com adalah situs resmi Joomla User Group (JUG) Indonesia dan Joomla Translation Team

 
Download Terjemahan Joomla terakreditasi dari JoomlaCode dan laporkan bugs, ide dan saran nya di Sub Forum Hanacaraka

Socials

twitter id joomlafb idjoomla