Membuat Pattern Untuk Background Website Dengan Photoshop

URL:http://goo.gl/FvnaKJ
November 13th, 2013 Freebie, Graphic Design, Tutorial Comments Off

Pattern adalah gambar yang sama dan muncul berulang-ulang dan biasanya digunakan sebagai background. Bisa untuk background website, poster, dan lainnya.

 

Disini kita akan mencoba membuat pattern dinding semen dengan photoshop (Seamless Concrete Pattern Photoshop)

hasil

Sebelum mulai, siapkan gambar yang akan dijadikan pattern. Di sini akan digunakan gambar dari :

http://www.flickr.com/photos/tendolab/2624600725/sizes/l/in/photostream/

Kenapa tidak menggunakan gambar asli secara langsung sebagai pattern?
Inilah yang akan terjadi jika gambar asli tanpa diedit dengan photoshop langsung diterapkan menjadi background (lihat Untitled-1) :

concretepat_1

Terlihat adanya garis-garis yang jelas membatasi tiap gambar yang diulang. Agar garis-garis tersebut tidak terlihat lagi maka gambar asli diedit terlebih dahulu dengan photoshop dan menghasilkan seamless pattern.
Langkah-langkah :

1. Buka file gambar, munculkan grid untuk membantu cropping agar tepat persegi. Lakukan cropping dengan crop tool pada bagian yang kita anggap paling rapi polanya

concretepat_2

2. Klik Filter – Other – offset :

concretepat_3

3. Hasil setelah di offset, di sini diperlukan ketelitian dan kejelian melihat garis-garis yang masih muncul (lihat panah) :

concretepat_4

4. Hilangkan garis-garis tadi dengan Stamp tool  :

concretepat_5

5.  Setelah itu lakukan lagi offset, perhatikan garis yang masih muncul dan hilangkan lagi dengan stamp tool

6. Jika dianggap semua garis pembatas telah hilang simpan sebagai pattern, dengan cara klik menu Edit – Define Pattern ….

7. Beri nama pattern tadi, disini dinamai my_concrete. Pattern yang telah tersimpan akan muncul pada jendela pattern

concretepat_7

8. Simpan gambar hasil pattern tadi sebagai jpg, jika kita ingin menggunakannya sebagai background halaman blog atau web. Gunakan menu File – save for web and devices, agar file pattern tidak terlalu besar. File pattern yang besar dapat membebani waktu loading blog atau web.

Untuk set pattern lengkap dapat di download di :

cover





Comments


Klik Tombol Like / Suka ya kawan..

Klik tombol "Like" atau "Suka" untuk mendapatkan update tutorial, tips & tricks serta info terbaru seputar dunia web design & development