Membuat gradient dimaksudkan agar object pada layar 2D kita seolah memiliki volume, kedalaman, dan highlight / shadow akibat adanya sumber cahaya. Ketiga hal tersebut dimaksudkan untuk menampilkan object 2D kita menjadi seolah 3D.
Jika kita mampu membuatnya dengan baik, mata dan perasaan kita akan melihatnya sebagai sesuatu yang wajar. Namun ketika kita membuatnya dengan sedikit “aneh”, maka mata dan perasaan kita akan berontak. Mengapa? Mata kita telah melihat berbagai macam hal di dunia ini sejak kita lahir sehingga terbiasa dengan bagaimana seharusnya bayangan itu terlihat, bagaimana sebuah objek terlihat jika terkena sorotan sumber cahaya, dll. Maka jika kita melihat suatu image hasil manipulasi yang tidak sesuai dengan kebiasaan mata kita, otomatis kita akan merasa janggal.
Berikut adalah gambar tiga kotak dengan gradien yang berbeda, perhatikan ketiga kotak tersebut dan akan kita lihat perbedaannya :
Gambar 1
Kotak pertama memperlihatkan masalah klasik yang sering kita lihat, yaitu hilangnya saturasi dalam gambar. Perlu dicatat bahwa kotak itu bukannya tidak terlihat 3D sama sekali, kotak itu hanya terlihat datar dan tidak menarik.
Gambar 2
Kotak ke 2 memperlihatkan tipe lain dari sebuah gradasi yang bisa digunakan, meskipun terlihat lebih baik dari kotak ke 1 (karena tidak kehilangan saturasi), gambar tersebut masih kurang menarik. Kotak ke 2 terlihat seperti papan tembaga yang terkena lampu senter, bukan efek yang kita inginkan.
Gambar 3
Kotak ke 3 adalah yang terbaik diantara kotak yang lain. Batas dari sumber cahaya yang ada sulit dipisahkan (tidak terlihat batasnya), warna dari sorotan cahaya yang ada memiliki saturasi yang lebih dibanding 2 kotak pertama, dan perubahan warnanya sudah cukup natural untuk menipu mata kita agar melihatnya sebagai sebuah objek 3D yang memiliki sudut. Jika kita ingin membuat sebuah objek yang terlihat lebih berstruktur, maka tipe inilah yang paling cocok.
Nah sekarang mari kita simak cara membuatnya Read the rest of this entry »
Rounded Corner (pojokan melengkung) adalah salah satu teknik yang masuk sebagai salah satu trend style Web 2.0. Begitu banyak cara yang dimungkinkan oleh teknik CSS untuk membuat rounded corner ini. Bisa dengan bantuan image atau tidak sama sekali. Silahkan pilih salah satu dari sekian banyak teknik membuat rounded corner tanpa image yang berhasil saya kumpulkan dari beberapa sumber dibawah ini : Read the rest of this entry »
