21 Contoh Penggunaan Pola dan Tekstur dalam Desain Web

[box type="info"]

Artikel ini adalah bagian dari seri Panduan Desain Web untuk Pemula.


1. Kuis Berhadiah Buku "Panduan Mudah Desain Web Professional"
2. 8 Tips Belajar Desain Web
3. Mendesain Login Form Gelap Bergaya Modern
4. 10 Tutorial Desain Web yang Perlu Dipelajari Pemula
5. 21 Contoh Penggunaan Pola dan Tekstur dalam Desain Web
6. Mendesain Interface Menu Modern
7. Pemenang Kuis Panduan Mudah Desain Web Profesional
[/box]

Salah satu trend yang berkembang selama beberapa tahun ini adalah penggunaan pola dan tekstur secara ringan (subtle). Ini sangat berbeda dengan trend di era Web 2.0 yang banyak menggunakan gradient dan efek glossy. Di artikel ini, kita akan mengamati beberapa contoh penggunaan pola dan tekstur secara apik dalam desain web.

[hr]

Cast Iron Design Company


Situs ini menambahkan tekstur pada semua area situs, termasuk pada logo yang digunakannya. Memberikan kesan unik karena sangat cocok dengan font tulisan tangan yang digunakannya.

Whiteloupe


Whiteloupe menggunakan sangat sedikit tekstur bahkan lebih terlihat seperti warna solid.



Bitfoundry


Bitfoundry menggunakan tekstur noise yang sangat ringan di seluruh latarnya. Namun untuk teks, mereka tetap menggunakan warna solid. Ini menambah kontras antara teks dan latar.



SachaGreif.com


Situs ini menggunakan pola garis-garis diagonal di latar. Untuk memberikan kesan konsisten, heading widgetnya menggunakan pola yang sama.



More Air


Sedikit noise pada tekstur sudah cukup untuk menambah kontras latar dengan teks. Bunga-bunga di dekat iPad memberikan efek kedalaman pada desain.



Tvornicca Bannera


Latar situs ini menggunakan warna solid. Tapi di ilustrasinya, dia menggunakan tekstur yang cukup kasar. Logonya pun menggunakan tekstur yang sama.



Carter Digital


Desain situs ini sangat bersih. Tekstur hanya ditemukan dalam persegi gelap di bawah judul situs.



Launch Factory


Di sini digunakan banyak tekstur. Bahkan teksnya pun terlihat kasar.



Mynus


Tekstur paling berat digunakan di situs ini. Untuk menjaga kontras teks dan latar digunakan warna teks yang terang dengan drop shadow hitam untuk mengurangi tekstur di belakangnya.



Decode


Tekstur noise yang digunakan sangat lembut. Teks dan berbagai elemen lainnya bersih tanpa tekstur.




Lake Wapogasset





kippt





Village


Pola hanya digunakan di latar. Di antara latar dan elemen lain ditambahkan drop shadow sebagai transisinya.



The Black Harbor


Pola yang digunakan adalah beberapa noise besar di latar. Di area utama, tidak ada tekstur sama sekali.



Doublenaut


Pola digunakan di latar sementara gambar menggunakan tekstur.



Kelli Anderson Blog


Pola digunakan di latar situs. Sedikit tekstur di gunakan di area navigasi. Pola juga digunakan di dalam drop shadow logo.



Victoria and Albert Museum


Pola berupa ilustrasi buku digunakan di latar. Sangat cocok dengan ilustrasi situs yang juga berupa foto buku.



Stellavie


Tekstur pola pixel digunakan di latar. Warnanya sama atau mungkin mirip dengan warna logo.



The Buffalo Lounge


Pola berupa noise yang membentuk kolom-kolom digunakan dalam latar.



S.O.S Mamute


Ada banyak tekstur di sini. Cocok untuk memberi kesan alami apalagi dengan penggunaan teks tipe tulisan tangannya yang banyak digunakan.



Hack Fwd


Pola digunakan dalam latar. Di area utama, tidak ada tekstur.