Technique and Trick With Noise Background Image

Pernah melihat gambar dengan efek noise! Arti dari kata noise itu sendiri adalah bising/gaduh/ribut/kacau... Cerita sebelumnya yaitu Snippets Code To Make Better Code dan sekarang kita persempit fokus kepada trik membuat background dengan teknik memakai gambar bertemakan noise! Sekilas mungkin trick berikut tampak seperti postingan dulu tentang Making Effect Television For Image!
Jika waktu itu memakai gambar ekstension GIF, sekarang kita pakai ekstensi PNG. Pemakaian gambar PNG di sini tidak perlu dengan resolusi yang besar, cukup dgn resolusi sedang² saja bahkan dgn ukuran kecil pun bisa! Intinya sekarang Koben mau berbagi trick menghias latar belakang (background) dengan menambahkan pemakaian gambar bertekstur noise terhadap sebuah konten. Sobat mungkin sudah melihat bagaimana tampilan background browse mozilla jika sedang membuka sebuah gambar?

Background Noise Mozilla Browser

Masih kurang ngeuh mungkin jika melihat demo di atas karena penggunaan noise dengan efek yg sangat lembut sekali ;)) Check this one...
With Color

Smooth Colour

Used Image

Image

Terlihat ada efek/tekstur noise pada demo tersebut! Pasti sudah mulai mengerti apa itu teknik noise texture :)

Karena membuat gambar tekstur noise lumayan gampang² susah, oleh karena itu cara terpintar yaitu memakai tools generator :D Berikut contoh tingkat ahli patterns, textures, dan noise dalam design web 30+ Examples of Patterns, Textures and Noise Effects in Web Design

Tools noise generator:

---

http://noisepng.com
http://bgpatterns.com
http://bg.siteorigin.com
http://www.patternify.com
http://rappdaniel.com/noisy
http://www.stripegenerator.com
http://www.pixelknete.de/dotte
http://www.noisetexturegenerator.com

Jangan lupa juga baca trik trick css3 make multiple background image.
Happy noise \m/